Advertisement

ECharts 地图详述镇区划分

  • 5星
  •     浏览量: 0
  •     大小:None
  •      文件类型:None


简介:
简介:本文详细介绍了ECharts地图工具在展示中国城镇区域划分方面的功能和应用方法,帮助用户轻松实现复杂地理数据可视化。 function getGzMap(_data) { if (_chinaMap == undefined) { var dom = document.getElementById(container); _chinaMap = echarts.init(dom); _chinaMap.on(click, function(params) { console.log(params); var _type = params.seriesType; if (_type === map) { //window.parent.aaa(aa) //调用父页面方法 } else if (_type === effectScatter) { window.parent.showMap(); } }); } var option = { backgroundColor: rgba(0, 0, 0, 0), visualMap: { type: piecewise, show: false, min: 0, max: 300, splitNumber: 3, itemWidth: 10, itemHeight: 10, itemGap: 5, seriesIndex:[1], pieces:[ {min : 0, max : 100, label:优}, {min : 101, max : 200, label:良}, {min : 201, max : 300, label:高风险} ], color:[#F8DAE6, #FEF9B5, #B0D8B3], textStyle: { color:#9EA8B1, fontSize:10 } }, tooltip:{ formatter:{b} }, geo:{ map:guangdong, roam:true, aspectScale: 1, zoom: 1.5, layoutCenter:[55%, 40%], layoutSize:500, label:{ normal:{show:true}, emphasis:{show:true} }, itemStyle:{ normal:{ areaColor:#323c48, borderColor:#111, shadowColor:#25A3FC, shadowBlur: 10 }, emphasis:{areaColor:#ddb926} } }, series:[ { type:effectScatter, coordinateSystem:geo, data:unitData, symbolSize:10, symbol:image://../../../../Content/images/One/fire.png, rippleEffect:{ period:4, scale:5, brushType:fill }, label:{normal:{formatter:{b}, position:right, show:false}}, itemStyle:{normal:{color:#fff}} }, { name:, type:map, geoIndex:0, mapType:guangdong, label:{ normal:{show:true} }, itemStyle:{ normal:{ label:{show:true, fontSize:10, color:#111}, shadowColor:#ddb926,shadowBlur:5 },emphasis:{label:{show:true}, shadowColor:rgba(0, 0, 0, 0.5), shadowBlur:10} }, data:_data }, { type:effectScatter, coordinateSystem:geo, data:windData, symbolSize:10, symbol:image://../../../../Content/images/One/wind.png, rippleEffect:{ period:4, scale:5, brushType:fill }, label:{normal:{formatter:{b}, position:right, show:false}}, itemStyle:{normal:{color:#fff}} } ] }; $.getJSON(../../MapCN/guangdong.json, function(chinaJson) { echarts.registerMap(guangdong, chinaJson); _chinaMap.setOption(option, true); }); }

全部评论 (0)

还没有任何评论哟~
客服
客服
  • ECharts
    优质
    简介:本文详细介绍了ECharts地图工具在展示中国城镇区域划分方面的功能和应用方法,帮助用户轻松实现复杂地理数据可视化。 function getGzMap(_data) { if (_chinaMap == undefined) { var dom = document.getElementById(container); _chinaMap = echarts.init(dom); _chinaMap.on(click, function(params) { console.log(params); var _type = params.seriesType; if (_type === map) { //window.parent.aaa(aa) //调用父页面方法 } else if (_type === effectScatter) { window.parent.showMap(); } }); } var option = { backgroundColor: rgba(0, 0, 0, 0), visualMap: { type: piecewise, show: false, min: 0, max: 300, splitNumber: 3, itemWidth: 10, itemHeight: 10, itemGap: 5, seriesIndex:[1], pieces:[ {min : 0, max : 100, label:优}, {min : 101, max : 200, label:良}, {min : 201, max : 300, label:高风险} ], color:[#F8DAE6, #FEF9B5, #B0D8B3], textStyle: { color:#9EA8B1, fontSize:10 } }, tooltip:{ formatter:{b} }, geo:{ map:guangdong, roam:true, aspectScale: 1, zoom: 1.5, layoutCenter:[55%, 40%], layoutSize:500, label:{ normal:{show:true}, emphasis:{show:true} }, itemStyle:{ normal:{ areaColor:#323c48, borderColor:#111, shadowColor:#25A3FC, shadowBlur: 10 }, emphasis:{areaColor:#ddb926} } }, series:[ { type:effectScatter, coordinateSystem:geo, data:unitData, symbolSize:10, symbol:image://../../../../Content/images/One/fire.png, rippleEffect:{ period:4, scale:5, brushType:fill }, label:{normal:{formatter:{b}, position:right, show:false}}, itemStyle:{normal:{color:#fff}} }, { name:, type:map, geoIndex:0, mapType:guangdong, label:{ normal:{show:true} }, itemStyle:{ normal:{ label:{show:true, fontSize:10, color:#111}, shadowColor:#ddb926,shadowBlur:5 },emphasis:{label:{show:true}, shadowColor:rgba(0, 0, 0, 0.5), shadowBlur:10} }, data:_data }, { type:effectScatter, coordinateSystem:geo, data:windData, symbolSize:10, symbol:image://../../../../Content/images/One/wind.png, rippleEffect:{ period:4, scale:5, brushType:fill }, label:{normal:{formatter:{b}, position:right, show:false}}, itemStyle:{normal:{color:#fff}} } ] }; $.getJSON(../../MapCN/guangdong.json, function(chinaJson) { echarts.registerMap(guangdong, chinaJson); _chinaMap.setOption(option, true); }); }
  • ECharts 中的中山市
    优质
    本文详细介绍在ECharts地图插件中如何展示和操作中国广东省中山市各镇区的具体划分方法与实践技巧。 ECharts 地图提供了详细的中山市镇区划分数据。
  • 诸暨乡ECharts
    优质
    本项目展示了浙江省诸暨市各主要乡镇的地理位置信息,采用ECharts技术制作互动式地图,方便用户直观了解和分析各地分布情况。 echarts下的诸暨市乡镇地图采用手绘坐标绘制而成,准确实用,在同类地图中较为罕见。
  • 郑州ECharts(含新规县)
    优质
    本项目提供基于ECharts的郑州地图可视化方案,涵盖全市行政区划及最新规划区域。适合数据分析与展示需求。 郑州ECharts地图涵盖了航空港区、经济技术开发区、高新技术产业开发区以及郑东新区。
  • 江苏苏州吴江级行政(Geo)
    优质
    这是一份详细展示江苏省苏州市吴江区各镇级行政区划的地图资源。地图以地理信息数据为基础,清晰呈现了该区内的行政划分情况和地理位置分布,便于用户了解与查询相关区域信息。 江苏苏州吴江区镇级行政边界地图的Geo数据以JSON格式提供,适用于在JavaScript端展示吴江区各个镇级行政区划及其中心点位置。
  • 2020年中国乡行政矢量
    优质
    《2020年中国乡镇行政区划矢量地图》是一份详尽记录中国各乡镇地理位置、边界划分等信息的地图数据集,为地理研究与城乡规划提供精准支持。 2020年中国区域乡镇行政矢量地图,精确到乡镇级。
  • 山西EChartsJS
    优质
    本项目为基于JavaScript的ECharts库开发的山西地区地图插件,提供便捷的数据可视化解决方案,适用于各类数据分析和展示场景。 山西echarts地图js涉及使用百度的开源数据可视化库ECharts来展示山西省的地图数据和相关信息。通过利用该工具,可以创建动态、交互式的地图图表,以直观的方式呈现地理分布情况或统计数据。 如果需要在项目中实现类似功能,首先确保已经正确引入了ECharts的相关资源文件,并且熟悉基本的配置项与API使用方法。对于山西地图而言,则还需特别注意获取到准确的地图JSON数据源,以便能够展示出详细的区域划分和边界信息。 此外,在开发过程中可能还会遇到一些技术难题或需要参考官方文档进行深入学习。因此建议开发者密切关注ECharts社区及官方网站上的更新动态和技术分享文章,以获得更多的实践经验和解决方案。
  • 台湾县市、乡、村里三级行政(shp文件)
    优质
    本资源提供台湾地区完整的县市、乡镇及村里级行政区划矢量数据(shp格式),便于地理信息系统中的分析与展示。 台湾省县市、乡镇、村里三级行政区划边界矢量数据shp文件,更新时间为2021年3月,资源来自网络,比例尺为1:5000,坐标系采用TWD97。
  • ECharts全国乡级行政边界JSON数据
    优质
    本资源提供全国乡镇级行政区划边界JSON格式数据文件,适用于基于ECharts的地图可视化开发,支持详细地域分析与展示。 Echarts 提供了全国乡镇级界线的行政界线 JSON 数据,这些数据反映的是大约 2015 年左右的行政区域情况。