echarts绥化市肇东市geoJson地图自定义引导线实例代码

geoJson2 yekong

可视化数据大屏 项目中经常需要渲染echarts地图,为了不同城市快速实现,将不同城市的echarts地图效果整理出来,今天为大家整理绥化市肇东市echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。

肇东市,黑龙江省 辖县级市,由 绥化市 代管。位于黑龙江省西南部松嫩平原中部,位于东经125°22′至126°22′,北纬45°10′至46°20′之间,南距哈尔滨53千米,北距大庆74千米,属于哈尔滨都市经济圈城市,是哈尔滨—大庆—齐齐哈尔经济带上的一个重要节点城市,处于哈大齐工业走廊的中轴位置,是哈齐客运专线的重要一站,总面积4332平方千米。截至2023年,肇东市辖4个街道、13个镇、8个乡;另辖2个乡级单位。2021年,肇东市总人口840673人。

echarts绥化市肇东市geoJson地图自定义引导线

echarts地图渲染中,会遇到多个地名凑到一块导致名称重叠的情况,这时候我们可以通过一条线指向对应的位置并通过label来进行标注的效果.

echarts绥化市肇东市geoJson地图自定义引导线

echarts绥化市肇东市geoJson地图阴影

echarts地图阴影效果实例,通过shadowColor控制阴影的颜色,通过shadowBlur控制范围,通过shadowOffsetX和shadowOffsetY控制偏移.

echarts绥化市肇东市geoJson地图阴影

echarts绥化市肇东市geoJson地图局部颜色渐变

echarts地图渲染,通过echarts.graphic.LinearGradient线性渐变来实现地图区域颜色的渐变效果

echarts绥化市肇东市geoJson地图局部颜色渐变

threejs绥化市肇东市geoJson地图3d地图CSS3D标签

通过threejs绘制的3d地图CSS3D标签实例,CSS3D不面向摄像机,跟随场景缩放,可以通过rotateY调整角度,通过scale调整大小,如果对threejs感兴趣,可以观看threejs视频教程 WebGL/Three.js前端高薪3D可视化

threejs绥化市肇东市geoJson地图3d地图CSS3D标签

threejs绥化市肇东市geoJson地图3d地图红色描边闪烁警报

通过threejs绘制3d地图使用outlinePass 实现发光描边闪烁效果 以实现警报功能

threejs绥化市肇东市geoJson地图3d地图红色描边闪烁警报

threejs绥化市肇东市geoJson地图3d地图指定区域闪烁

通过threejs绘制3d地图并让指定区域闪烁

threejs绥化市肇东市geoJson地图3d地图指定区域闪烁

绥化市肇东市 下辖有 五站镇,东升区街道,涝洲鱼种场,肇东镇,涝洲镇,太平乡,明久乡,四站镇,姜家镇,洪河乡,五里明镇,昌五镇,向阳乡,安民乡,宋站镇,宣化乡,尚家镇,海城乡,德昌乡,跃进乡,四方山农场,黎明镇,朝阳区街道,西八里乡,里木店镇,正阳区街道,西园区街道

绥化市肇东市下辖区域坐标

{"五站镇":[126.27378660615437,45.82600649785174],"东升区街道":[125.99001695095674,46.08352638878392],"涝洲鱼种场":[126.0468503836016,45.71718294685824],"肇东镇":[125.92754711189457,46.02819307775977],"涝洲镇":[126.08754407268685,45.75838517661735],"太平乡":[125.91952872663919,45.93192902395694],"明久乡":[125.49125144249243,46.09946097392117],"四站镇":[125.89705279137044,45.68798764216771],"姜家镇":[126.07914606309467,46.00758881352206],"洪河乡":[125.4594214660825,45.98983513840959],"五里明镇":[125.92009268662201,45.81412901297266],"昌五镇":[125.61152114288936,46.0303343305365],"向阳乡":[125.73245090850577,46.04756127284394],"安民乡":[125.43866973984399,46.19655396950422],"宋站镇":[125.64837779763829,46.20086728386706],"宣化乡":[125.71789132661223,46.32723028079165],"尚家镇":[125.86068462875701,46.18892974277441],"海城乡":[126.0598639316875,46.13567630396275],"德昌乡":[125.7608515646401,45.84425456591018],"跃进乡":[125.55620699502416,45.9345334488025],"四方山农场":[125.99875012870098,45.72837036733333],"黎明镇":[126.08861949565537,45.87132935493507],"朝阳区街道":[125.99547297411775,46.06079962779219],"西八里乡":[125.81607985859884,45.62047891333536],"里木店镇":[126.20250918262953,45.96962608527407],"正阳区街道":[125.9698932244479,46.07667852381643],"西园区街道":[125.96194334158872,46.05791433761591]}

说明

1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规,本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。

2、本数据是目前市面上较齐全、精度较高的数据,属性齐全,各大高校科研均在用此数据。

3、本数据仅用于echarts threejs地图效果展示。

绥化市肇东市echarts地图效果实例和threejs地图效果实例下载

相关文件下载地址
此资源需支付 ¥10 后下载
支付宝购买扫右侧红包码购买更优惠,如无法下载请联系微信:17331886870
喜欢
echarts绥化市肇东市geoJson地图自定义引导线实例代码