可视化数据大屏 项目中经常需要渲染echarts地图,为了不同城市快速实现,将不同城市的echarts地图效果整理出来,今天为大家整理固原市西吉县echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
西吉县,隶属宁夏回族自治区固原市,位于宁夏南部,六盘山西麓。介于东经105°20'—106°04'、北纬35°35'—36°14'之间。东西长67公里,南北宽74公里,东距固原市63公里,北距宁夏银川市391公里,总面积3130平方公里。截至2020年11月,西吉县辖4镇15乡,根据第七次全国人口普查结果常住人口为315827人,县政府驻地吉强镇。
echarts固原市西吉县geoJson地图 visualMap控制地图颜色
echarts地图使用visualMap通过一组颜色及一组数据来实现地图不同区域根据不同数据进行颜色变化
echarts固原市西吉县geoJson地图指定区域高亮
echarts让指定区域变为选中高亮状态
echarts固原市西吉县geoJson地图根据经纬度显示自定义html弹窗
echarts地图我们可以通过像素坐标来将我们自定义的html弹窗定位到echarts地图指定位置,如果是固定的宽高的话,这没什么问题直接定位就可以了,如果是自适应宽高的地图我们可能没办法控制精度,我们可以使用经纬度来控制,当echarts地图渲染完成以后,我们可以通过convertToPixel将经纬度转为像素坐标,然后再渲染自定义弹窗,这样精度就比较准确了,而且也不会因为窗体宽高变化而导致弹窗出现偏移.
threejs固原市西吉县geoJson地图3d地图
通过threejs绘制的3d地图实例 vue3 threejs 在vue3项目中绘制3d地图效果实例,如果想系统的学习threejs的话,可以观看threejs视频教程 WebGL 3D可视化教程
threejs固原市西吉县geoJson地图3d地图自定义贴图加CSS2D标签
通过threejs绘制3d地图并添加CSS2D标签和自定义贴图
threejs固原市西吉县geoJson地图3d地图鼠标移入显示标签并高亮
通过threejs绘制的3d地图鼠标移入显示标签并高亮
固原市西吉县 下辖有 兴隆镇,吉强镇,将台乡,马建乡,马莲乡,火石寨乡,西滩乡,震湖乡,王民乡,田坪乡,白崖乡,硝河乡,红耀乡,什字乡,偏城乡,兴平乡,平峰镇,新营乡,沙沟乡
固原市西吉县下辖区域坐标
{"兴隆镇":[105.82140387051578,35.65426313861322],"吉强镇":[105.72037781966932,35.98349214118505],"将台乡":[105.82655173824418,35.79178539552574],"马建乡":[105.51201149936915,35.95847750007745],"马莲乡":[105.94942669984997,35.82842403162489],"火石寨乡":[105.72847992936144,36.09905363911231],"西滩乡":[105.7416312746618,35.87615932173738],"震湖乡":[105.47375003541075,35.84939491684581],"王民乡":[105.72721236892721,35.78017848682165],"田坪乡":[105.38568476447867,35.97556502554957],"白崖乡":[105.87490654247233,36.08686346837728],"硝河乡":[105.8654126714171,35.9022106963981],"红耀乡":[105.48784702448958,36.04349488050838],"什字乡":[105.96108752319147,35.74506614762458],"偏城乡":[105.95019099107073,35.95613682754026],"兴平乡":[105.64086798668635,35.85856266375855],"平峰镇":[105.56121947873967,35.76763381521259],"新营乡":[105.58823589777728,36.10866062456985],"沙沟乡":[105.94642991021732,36.12447531045399]}
固原市西吉县行政划分代码
[{"name":"兴隆镇","code":"640422101000"},{"name":"吉强镇","code":"640422100000"},{"name":"将台乡","code":""},{"name":"马建乡","code":"640422203000"},{"name":"马莲乡","code":"640422209000"},{"name":"火石寨乡","code":"640422215000"},{"name":"西滩乡","code":"640422206000"},{"name":"震湖乡","code":"640422204000"},{"name":"王民乡","code":"640422207000"},{"name":"田坪乡","code":"640422202000"},{"name":"白崖乡","code":"640422214000"},{"name":"硝河乡","code":"640422211000"},{"name":"红耀乡","code":"640422201000"},{"name":"什字乡","code":"640422208000"},{"name":"偏城乡","code":"640422212000"},{"name":"兴平乡","code":"640422205000"},{"name":"平峰镇","code":"640422102000"},{"name":"新营乡","code":"640422200000"},{"name":"沙沟乡","code":"640422213000"}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规,本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据,属性齐全,各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。
4、当前除了包含有关键地区的geoJson地图信息外还包含有28个echarts地图效果,以及13个threejs地图实例效果,限于篇幅不一一展示,可以通过更多echarts和threejs地图效果实例查看