随着开发 可视化大屏 项目越来越多,对地图的需求也各不相同,除了百度地图和高德地图外还会遇到echarts和threejs的需要,对地图的效果以及城市也各不相同,今天为大家整理南京市栖霞区echarts地图和threejs地图效果实例供大家参考。地图基于geoJson数据绘制。
echarts南京市栖霞区geoJson地图点击跳转到指定页面
为图标添加点击事件,点击图标,跳转到指定页面
echarts南京市栖霞区geoJson地图地图下钻展示
地图下钻展示,点击地图后,只显示当前选中的区域,可点击返回显示全部地图.
echarts南京市栖霞区geoJson地图label自定义样式
echarts通过scatter实例可以配置自己想要的图标,以及label文字的样式效果
threejs南京市栖霞区geoJson地图3d地图添加金色效果
通过threejs绘制3d地图使用outlinePass实现金色描边效果,并通过edgeStrength增加强度,让描边更清晰,如果想系统的学习threejs的话,可以观看threejs教程视频 Three.js前端3D可视化教程
threejs南京市栖霞区geoJson地图3d地图指定区域闪烁
通过threejs绘制3d地图并让指定区域闪烁
threejs南京市栖霞区geoJson地图3d地图CSS2D外加旋转棱锥
通过threejs绘制3d地图CSS2D外加旋转棱锥效果
南京市栖霞区 下辖有 南京迈皋桥创业园,栖霞街道,南京龙潭物流园,栖霞经济开发区,江苏生命科技创新园,燕子矶街道,南京市靖安三江口工业园,南京市马群科技园,仙林街道,尧化街道,西岗街道,马群街道,龙潭监狱,龙潭街道,八卦洲街道,迈皋桥街道,南京经济技术开发区,南京紫东国际创意园,南京大学科学园,南京金港科技创业中心
南京市栖霞区下辖区域坐标
{"南京迈皋桥创业园":[118.85094232404944,32.10980927711397],"栖霞街道":[118.94975960379865,32.15297899864393],"南京龙潭物流园":[119.05314381867555,32.20453756400809],"栖霞经济开发区":[119.0218440151584,32.16367455309],"江苏生命科技创新园":[118.95244031614942,32.13303051046263],"燕子矶街道":[118.81954026142918,32.1397733182791],"南京市靖安三江口工业园":[119.0900242145192,32.23370859181913],"南京市马群科技园":[118.88584591842152,32.07439326139712],"仙林街道":[118.92970220129465,32.10764742964761],"尧化街道":[118.8813450789266,32.13686579340987],"西岗街道":[119.00516674920104,32.10818028280868],"马群街道":[118.8944094013228,32.05795395507084],"龙潭监狱":[119.0425705571974,32.16265852503845],"龙潭街道":[119.13534326805421,32.20407796323356],"八卦洲街道":[118.81518182993348,32.18210387314959],"迈皋桥街道":[118.82315243066171,32.11356225115787],"南京经济技术开发区":[118.93282560956746,32.15180045636125],"南京紫东国际创意园":[118.90678723826355,32.08170149919688],"南京大学科学园":[118.95288244656065,32.12831981394893],"南京金港科技创业中心":[118.90135773351827,32.1259680018638]}
南京市栖霞区行政划分代码
[{"name":"南京迈皋桥创业园","code":""},{"name":"栖霞街道","code":"320113005000"},{"name":"南京龙潭物流园","code":"320113402000"},{"name":"栖霞经济开发区","code":"320113401000"},{"name":"江苏生命科技创新园","code":"320113407000"},{"name":"燕子矶街道","code":"320113004000"},{"name":"南京市靖安三江口工业园","code":"320113403000"},{"name":"南京市马群科技园","code":"320113405000"},{"name":"仙林街道","code":"320113007000"},{"name":"尧化街道","code":"320113001000"},{"name":"西岗街道","code":"320113010000"},{"name":"马群街道","code":"320113002000"},{"name":"龙潭监狱","code":"320113400000"},{"name":"龙潭街道","code":"320113006000"},{"name":"八卦洲街道","code":"320113009000"},{"name":"迈皋桥街道","code":"320113003000"},{"name":"南京经济技术开发区","code":"320113450000"},{"name":"南京紫东国际创意园","code":"320113410000"},{"name":"南京大学科学园","code":""},{"name":"南京金港科技创业中心","code":"320113411000"}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规,本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据,属性齐全,各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。
4、当前除了包含有关键地区的geoJson地图信息外还包含有28个echarts地图效果,以及13个threejs地图实例效果,限于篇幅不一一展示,可以通过更多echarts和threejs地图效果实例查看