可视化大屏 项目中经常会遇到需要渲染echarts地图的情况，为了方便不同城市快速实现效果，将不同城市的echarts地图效果整理出来，供大家参考，今天为大家整理的是南通市崇川区echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
echarts南通市崇川区geoJson地图添加柱状图
echarts地图渲染时,为了让地图上的数据有一个对比的效果,会在地图上标注柱状图,以便于更直观的看出各个区域的数值.
echarts南通市崇川区geoJson地图点击地图插小旗
echarts地图渲染点击地图显示自定义效果实例,效果类似点击插小旗的效果,通过scatter实现.
echarts南通市崇川区geoJson地图阴影
echarts地图阴影效果实例,通过shadowColor控制阴影的颜色,通过shadowBlur控制范围,通过shadowOffsetX和shadowOffsetY控制偏移.
threejs南通市崇川区geoJson地图3d地图自定义贴图加CSS2D标签
通过threejs绘制3d地图并添加CSS2D标签和自定义贴图,如果想系统的学习threejs的话，可以观看threejs视频课程 Three.js视频教程3D可视化
threejs南通市崇川区geoJson地图3d地图鼠标移入显示标签并高亮
通过threejs绘制的3d地图鼠标移入显示标签并高亮
threejs南通市崇川区geoJson地图3d地图自定义贴图加CSS3D标签
通过threejs绘制3d地图并添加CSS3D标签和自定义贴图
南通市崇川区 下辖有 任港街道,学田街道,中兴街道,城东街道,小海街道,新开街道,南通市富民港种畜场,文峰街道,江海镇区,竹行街道,虹桥街道,钟秀街道,和平桥街道,新城桥街道,狼山镇街道,观音山街道,南通苏通科技产业园,南通市富民港良种场
南通市崇川区下辖区域坐标
{"任港街道":[120.8277374871611,32.00249177136532],"学田街道":[120.88678188832799,32.00973480616803],"中兴街道":[120.9223526991989,31.87159183525247],"城东街道":[120.87625125732558,32.02494027587738],"小海街道":[120.9720708487568,31.92713743758754],"新开街道":[120.93700193226599,31.93506200408113],"南通市富民港种畜场":[120.9691232639958,31.87356205828935],"文峰街道":[120.87594868731045,31.99231501563964],"江海镇区":[121.00458197899795,31.83687763320462],"竹行街道":[121.01610239643058,31.87856147158914],"虹桥街道":[120.84839023635679,32.00453705912232],"钟秀街道":[120.8761775988124,32.03649145148074],"和平桥街道":[120.85424006119153,32.02395059962242],"新城桥街道":[120.86798040817945,32.00504585211094],"狼山镇街道":[120.86999081147121,31.93580939747079],"观音山街道":[120.93066722714593,32.00861966380175],"南通苏通科技产业园":[120.99350904508455,31.8248911507624],"南通市富民港良种场":[120.94497456115235,31.88451364980916]}
南通市崇川区行政划分代码
[{"name":"任港街道","code":"320613003000"},{"name":"学田街道","code":"320613006000"},{"name":"中兴街道","code":""},{"name":"城东街道","code":"320613001000"},{"name":"小海街道","code":""},{"name":"新开街道","code":""},{"name":"南通市富民港种畜场","code":""},{"name":"文峰街道","code":"320613008000"},{"name":"江海镇区","code":""},{"name":"竹行街道","code":""},{"name":"虹桥街道","code":"320613005000"},{"name":"钟秀街道","code":"320613007000"},{"name":"和平桥街道","code":"320613002000"},{"name":"新城桥街道","code":"320613004000"},{"name":"狼山镇街道","code":"320613010000"},{"name":"观音山街道","code":"320613009000"},{"name":"南通苏通科技产业园","code":""},{"name":"南通市富民港良种场","code":""}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规，本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据，属性齐全，各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。
4、当前除了包含有关键地区的geoJson地图信息外还包含有28个echarts地图效果,以及13个threejs地图实例效果,限于篇幅不一一展示,可以通过更多echarts和threejs地图效果实例查看
