数据大屏 项目中经常会遇到需要渲染echarts地图的情况,为了方便不同城市快速实现效果,将不同城市的echarts地图效果整理出来,供大家参考,今天为大家整理的是西宁市湟中区echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
echarts西宁市湟中区geoJson地图阴影
echarts地图阴影效果实例,通过shadowColor控制阴影的颜色,通过shadowBlur控制范围,通过shadowOffsetX和shadowOffsetY控制偏移.
echarts西宁市湟中区geoJson地图添加柱状图
echarts地图渲染时,为了让地图上的数据有一个对比的效果,会在地图上标注柱状图,以便于更直观的看出各个区域的数值.
echarts西宁市湟中区geoJson地图3d地图
使用的是echarts-gl结合echarts实现的3d地图效果实例
threejs西宁市湟中区geoJson地图3d地图自定义贴图加CSS2D标签
通过threejs绘制3d地图并添加CSS2D标签和自定义贴图,如果想系统的学习threejs的话,可以观看threejs教程视频 Three.js视频教程3D可视化
threejs西宁市湟中区geoJson地图3d地图添加描边效果
通过threejs绘制3d地图使用outlinePass 实现发光描边效果
threejs西宁市湟中区geoJson地图3d地图添加金色效果
通过threejs绘制3d地图使用outlinePass实现金色描边效果,并通过edgeStrength增加强度,让描边更清晰
西宁市湟中区 下辖有 上新庄镇,土门关乡,拦隆口镇,甘河工业园,群加乡,康川街道,李家山镇,海子沟乡,甘河滩镇,田家寨镇,鲁沙尔镇,共和镇,多巴镇,大才乡,汉东乡,西堡镇,上五庄镇
西宁市湟中区下辖区域坐标
{"上新庄镇":[101.54640697220644,36.4138639015604],"土门关乡":[101.69702421826668,36.42510917834301],"拦隆口镇":[101.46253079366036,36.79367054714888],"甘河工业园":[101.50767706476736,36.57005005757338],"群加乡":[101.62813369331846,36.28662972454131],"康川街道":[101.51091915350523,36.65192528433536],"李家山镇":[101.54093301380203,36.80657149648592],"海子沟乡":[101.65594923691688,36.73671529099639],"甘河滩镇":[101.53700876266939,36.56247088616237],"田家寨镇":[101.77748260913873,36.41504848449545],"鲁沙尔镇":[101.48575208946065,36.45544584022311],"共和镇":[101.38408826305313,36.55018661176567],"多巴镇":[101.49173700615809,36.67256181430628],"大才乡":[101.44525527725403,36.50423585520365],"汉东乡":[101.48106471563273,36.57732653201299],"西堡镇":[101.61124012421666,36.57941854456614],"上五庄镇":[101.31973295185392,36.91392932553985]}
西宁市湟中区行政划分代码
[{"name":"上新庄镇","code":"630106101000"},{"name":"土门关乡","code":"630106201000"},{"name":"拦隆口镇","code":"630106106000"},{"name":"甘河工业园","code":"630106400000"},{"name":"群加乡","code":""},{"name":"康川街道","code":"630106001000"},{"name":"李家山镇","code":"630106108000"},{"name":"海子沟乡","code":"630106204000"},{"name":"甘河滩镇","code":"630106103000"},{"name":"田家寨镇","code":"630106100000"},{"name":"鲁沙尔镇","code":"630106102000"},{"name":"共和镇","code":"630106104000"},{"name":"多巴镇","code":"630106105000"},{"name":"大才乡","code":""},{"name":"汉东乡","code":""},{"name":"西堡镇","code":"630106109000"},{"name":"上五庄镇","code":"630106107000"}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规,本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据,属性齐全,各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。
4、当前除了包含有关键地区的geoJson地图信息外还包含有28个echarts地图效果,以及13个threejs地图实例效果,限于篇幅不一一展示,可以通过更多echarts和threejs地图效果实例查看