数据大屏 项目中经常需要渲染echarts地图,为了不同城市快速实现,将不同城市的echarts地图效果整理出来,今天为大家整理陇南市康县echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
康县隶属于 甘肃省 陇南市,位于甘肃省东南部、陇南市东南部,甘肃、四川、陕西三省交界地带。康县古称康州,北周置康州,后废并入武州(阶州),1929年置康县。康县下辖18镇、3乡,全县总面积2967.95平方公里。根据第七次人口普查数据,截至2020年11月1日零时,康县常住人口162418人。
echarts陇南市康县geoJson地图tooltip自定义html
echarts tooltip演示自定义,通过toolTip的formatter方法以html+css的方式实现自己想要的样式效果,鼠标移上去就可以看到我们想要的效果了,也可以通过css自定义为自己需要的样式.
echarts陇南市康县geoJson地图点击地图获取经纬度
echarts地图渲染后,有时候会需要点击后获取到经纬度信息,通过经纬度信息来查询一些内容,这里我们可以通过convertFromPixel来获取经纬度.
echarts陇南市康县geoJson地图根据经纬度显示自定义html弹窗
echarts地图我们可以通过像素坐标来将我们自定义的html弹窗定位到echarts地图指定位置,如果是固定的宽高的话,这没什么问题直接定位就可以了,如果是自适应宽高的地图我们可能没办法控制精度,我们可以使用经纬度来控制,当echarts地图渲染完成以后,我们可以通过convertToPixel将经纬度转为像素坐标,然后再渲染自定义弹窗,这样精度就比较准确了,而且也不会因为窗体宽高变化而导致弹窗出现偏移.
threejs陇南市康县geoJson地图3d地图鼠标移入显示标签并高亮
通过threejs绘制的3d地图鼠标移入显示标签并高亮,如果想系统的学习threejs的话,可以观看threejs视频 Three.js前端3D可视化
threejs陇南市康县geoJson地图3d地图添加描边效果
通过threejs绘制3d地图使用outlinePass 实现发光描边效果
threejs陇南市康县geoJson地图3d地图添加旋转棱锥
通过threejs绘制3d地图并在指定经纬度上添加带波纹效果不停旋转的棱锥效果实例
陇南市康县 下辖有 迷坝乡,两河镇,城关镇,大堡镇,太石乡,寺台乡,平洛镇,店子乡,望关乡,王坝乡,白杨乡,碾坝乡,豆坝乡,豆坪乡,铜钱乡,长坝镇,阳坝镇,三河坝乡,大南峪乡,岸门口镇,云台镇
陇南市康县下辖区域坐标
{"迷坝乡":[105.77668932892672,33.52294638378548],"两河镇":[105.88801495575893,33.14862973889836],"城关镇":[105.57506243356677,33.35250204343562],"大堡镇":[105.55643320789022,33.45674623470792],"太石乡":[105.46083820467149,33.61140799212951],"寺台乡":[105.61167307511123,33.51092115663987],"平洛镇":[105.38845531374065,33.55712656575877],"店子乡":[105.49623237158208,33.19951226197085],"望关乡":[105.34576982775933,33.47652504682625],"王坝乡":[105.68132276267761,33.35283324865586],"白杨乡":[105.76594287073527,33.18238554049218],"碾坝乡":[105.45970006666118,33.31858813978322],"豆坝乡":[105.44038290056338,33.23867072532389],"豆坪乡":[105.49896477470921,33.52985416193674],"铜钱乡":[105.76830841929834,33.08820707732934],"长坝镇":[105.44630490328007,33.41454454780646],"阳坝镇":[105.7127334841303,33.00407528955824],"三河坝乡":[105.58843069444322,33.16743763741472],"大南峪乡":[105.76166079994141,33.44081688167537],"岸门口镇":[105.63703121416705,33.27500672106912],"云台镇":[105.65812764633452,33.46665572020464]}
陇南市康县行政划分代码
[{"name":"迷坝乡","code":"621224204000"},{"name":"两河镇","code":"621224104000"},{"name":"城关镇","code":"621224100000"},{"name":"大堡镇","code":"621224102000"},{"name":"太石乡","code":"621224214000"},{"name":"寺台乡","code":""},{"name":"平洛镇","code":"621224101000"},{"name":"店子乡","code":"621224209000"},{"name":"望关乡","code":""},{"name":"王坝乡","code":""},{"name":"白杨乡","code":""},{"name":"碾坝乡","code":""},{"name":"豆坝乡","code":""},{"name":"豆坪乡","code":""},{"name":"铜钱乡","code":""},{"name":"长坝镇","code":"621224105000"},{"name":"阳坝镇","code":"621224107000"},{"name":"三河坝乡","code":""},{"name":"大南峪乡","code":""},{"name":"岸门口镇","code":"621224103000"},{"name":"云台镇","code":"621224106000"}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规,本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据,属性齐全,各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。