大屏数据可视化 项目中经常会遇到需要渲染echarts地图的情况,为了方便不同城市快速实现效果,将不同城市的echarts地图效果整理出来,供大家参考,今天为大家整理的是哈尔滨市尚志市echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
尚志市,黑龙江省 辖县级市,由 哈尔滨市 代管,地处黑龙江省中南部,哈尔滨市东南部,东经127°17′-129°12′、北纬44°29′-45°34′。东界海林市,西邻阿城区,南与五常市接壤,北与延寿县、方正县、宾县相连接。东西长约153千米,南北宽约90千米。总面积8910平方千米。辖10个镇、5个乡、2个民族乡。市政府驻尚志大街5号。根据第七次人口普查数据,截至2020年11月1日零时,尚志常住人口为463358人。
echarts哈尔滨市尚志市geoJson地图点击地图插小旗
echarts地图渲染点击地图显示自定义效果实例,效果类似点击插小旗的效果,通过scatter实现.
echarts哈尔滨市尚志市geoJson地图3d地图实例旋转动画
使用的是echarts-gl结合echarts实现的3d地图效果实例
echarts哈尔滨市尚志市geoJson地图tooltip自定义html
echarts tooltip演示自定义,通过toolTip的formatter方法以html+css的方式实现自己想要的样式效果,鼠标移上去就可以看到我们想要的效果了,也可以通过css自定义为自己需要的样式.
threejs哈尔滨市尚志市geoJson地图3d地图红色描边闪烁警报
通过threejs绘制3d地图使用outlinePass 实现发光描边闪烁效果 以实现警报功能,如果对threejs感兴趣,可以观看threejs教程视频 WebGL/Three.js前端高薪3D可视化
threejs哈尔滨市尚志市geoJson地图3d地图
通过threejs绘制的3d地图实例
threejs哈尔滨市尚志市geoJson地图3d地图添加金色效果
通过threejs绘制3d地图使用outlinePass实现金色描边效果,并通过edgeStrength增加强度,让描边更清晰
哈尔滨市尚志市 下辖有 石头河子镇,马延乡,一面坡镇,亚布力镇,河东乡,苇河镇,长寿乡,苇河林业局,亚布力林业局,亮河镇,元宝镇,尚志镇,庆阳镇,帽儿山镇,珍珠山乡,老街基乡,黑龙宫镇,鱼池乡,乌吉密乡
哈尔滨市尚志市下辖区域坐标
{"石头河子镇":[128.65663628940433,44.77854505111128],"马延乡":[128.02625155396365,45.11299673591214],"一面坡镇":[128.19456807183272,45.04940697862222],"亚布力镇":[128.57321996194042,44.87982065774158],"河东乡":[128.05520789896576,45.26438167276104],"苇河镇":[128.38562561972785,45.00779160686673],"长寿乡":[127.8419196795194,45.33262536770511],"苇河林业局":[128.0749350039433,44.63386259799265],"亚布力林业局":[128.5021865871292,44.76135892962594],"亮河镇":[128.8682256201777,45.15936884539381],"元宝镇":[128.31395583539592,45.21201718888417],"尚志镇":[127.93931046982883,45.19376217595459],"庆阳镇":[128.93066740447284,45.4121972453361],"帽儿山镇":[127.5454271520382,45.26741813801904],"珍珠山乡":[128.1973689821752,44.70218123883509],"老街基乡":[127.95307528841772,44.91599040561522],"黑龙宫镇":[127.83995772616936,45.47810890926385],"鱼池乡":[128.8425375755143,44.95650141172815],"乌吉密乡":[127.72641467338445,45.14913396420302]}
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规,本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据,属性齐全,各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。