echarts乐东黎族自治县geoJson地图tooltip自定义html演示实例

geoJson2 yekong

可视化数据大屏 项目中会有渲染地图的需要,除了百度地图以及高德地图外,也会需要echarts或者threejs效果的地图,今天为大家整理乐东黎族自治县echarts地图和threejs地图效果实例供大家参考。地图基于geoJson数据绘制。

乐东黎族自治县,是海南省直辖自治县,位于海南岛西南部,介于北纬18°24′至18°58′,东经108°39′至109°24′之间。地势北高南低,背山面海。东和东北与五指山市、白沙黎族自治县接壤,东南与三亚市交界,北与东方市、昌江黎族自治县毗邻,西南临南海。根据第七次人口普查数据,截至2020年11月1日零时,乐东黎族自治县常住人口为464435人;辖有11个镇,共173个村委会、20个居委会、600个自然村;陆地面积2766.42平方公里,其中耕地面积561.21平方公里;海域面积1726.8平方公里,海岸线84.3公里。

echarts乐东黎族自治县geoJson地图tooltip自定义html

echarts tooltip演示自定义,通过toolTip的formatter方法以html+css的方式实现自己想要的样式效果,鼠标移上去就可以看到我们想要的效果了,也可以通过css自定义为自己需要的样式.

echarts乐东黎族自治县geoJson地图tooltip自定义html

echarts乐东黎族自治县geoJson地图 visualMap控制地图颜色

echarts地图使用visualMap通过一组颜色及一组数据来实现地图不同区域根据不同数据进行颜色变化

echarts乐东黎族自治县geoJson地图 visualMap控制地图颜色

echarts乐东黎族自治县geoJson地图label自定义样式

echarts通过scatter实例可以配置自己想要的图标,以及label文字的样式效果

echarts乐东黎族自治县geoJson地图label自定义样式

threejs乐东黎族自治县geoJson地图3d地图添加金色效果

通过threejs绘制3d地图使用outlinePass实现金色描边效果,并通过edgeStrength增加强度,让描边更清晰,如果想系统的学习threejs的话,可以观看threejs课程视频 WebGL/Three.js前端高薪3D可视化

threejs乐东黎族自治县geoJson地图3d地图添加金色效果

threejs乐东黎族自治县geoJson地图3d地图

通过threejs绘制的3d地图实例 vue3 threejs 在vue3项目中绘制3d地图效果实例

threejs乐东黎族自治县geoJson地图3d地图

乐东黎族自治县 下辖有 国营保国农场,莺歌海镇,国营莺歌海盐场,国营乐光农场,国营山荣农场,万冲镇,九所镇,佛罗镇,利国镇,千家镇,大安镇,尖峰镇,志仲镇,抱由镇,黄流镇,国营尖峰岭林业公司

乐东黎族自治县下辖区域坐标

{"国营保国农场":[],"莺歌海镇":[108.70067093251708,18.49302822168832],"国营莺歌海盐场":[108.73338213037687,18.53359373710256],"国营乐光农场":[],"国营山荣农场":[],"万冲镇":[],"九所镇":[108.96433429089669,18.43678935858449],"佛罗镇":[108.71312303731618,18.58645555522563],"利国镇":[108.91015703170495,18.54346701650292],"千家镇":[],"大安镇":[109.21170468989835,18.65001629131586],"尖峰镇":[108.76752349780273,18.66132935727604],"志仲镇":[],"抱由镇":[],"黄流镇":[108.81038099605533,18.53122459529055],"国营尖峰岭林业公司":[]}

乐东黎族自治县行政划分代码

[{"name":"国营保国农场","code":""},{"name":"莺歌海镇","code":"469027110000"},{"name":"国营莺歌海盐场","code":"469027501000"},{"name":"国营乐光农场","code":""},{"name":"国营山荣农场","code":""},{"name":"万冲镇","code":"469027101000"},{"name":"九所镇","code":"469027105000"},{"name":"佛罗镇","code":"469027108000"},{"name":"利国镇","code":"469027106000"},{"name":"千家镇","code":"469027104000"},{"name":"大安镇","code":"469027102000"},{"name":"尖峰镇","code":"469027109000"},{"name":"志仲镇","code":"469027103000"},{"name":"抱由镇","code":"469027100000"},{"name":"黄流镇","code":"469027107000"},{"name":"国营尖峰岭林业公司","code":"469027500000"}]

说明

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

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

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

4、当前除了包含有关键地区的geoJson地图信息外还包含有28个echarts地图效果,以及13个threejs地图实例效果,限于篇幅不一一展示,可以通过更多echarts和threejs地图效果实例查看

乐东黎族自治县echarts地图效果实例和threejs地图效果实例下载

相关文件下载地址
此资源需支付 ¥10 后下载
支付宝购买扫右侧红包码购买更优惠,如无法下载请联系微信:17331886870
喜欢
echarts乐东黎族自治县geoJson地图tooltip自定义html演示实例