大屏数据可视化 项目中经常会遇到需要渲染echarts地图的情况,为了方便不同城市快速实现效果,将不同城市的echarts地图效果整理出来,供大家参考,今天为大家整理的是廊坊市香河县echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
香河县,隶属河北省廊坊市,地处燕山南麓平原,位居河北省中部偏东,廊坊市东北部。东与天津市宝坻区毗连,南隔青龙湾河与天津市武清区相望,西与北京市通州区为邻,北与三河市、大厂回族自治县接壤,总面积448平方千米。2020年,香河县户籍人口38.36万人。共有35个民族。截至2021年10月,香河县下辖9个镇。
echarts廊坊市香河县地图根据经纬度显示自定义html弹窗
echarts地图我们可以通过像素坐标来将我们自定义的html弹窗定位到echarts地图指定位置,如果是固定的宽高的话,这没什么问题直接定位就可以了,如果是自适应宽高的地图我们可能没办法控制精度,我们可以使用经纬度来控制,当echarts地图渲染完成以后,我们可以通过convertToPixel将经纬度转为像素坐标,然后再渲染自定义弹窗,这样精度就比较准确了,而且也不会因为窗体宽高变化而导致弹窗出现偏移.
threejs廊坊市香河县地图3d地图CSS3D标签
通过threejs绘制的3d地图CSS3D标签实例,CSS3D不面向摄像机,跟随场景缩放,可以通过rotateY调整角度,通过scale调整大小,如果想系统的学习threejs的话,可以观看threejs课程视频 WebGL 3D可视化教程
更多效果实例
echarts 廊坊市香河县地图效果实例
1.echarts廊坊市香河县地图定义颜色演示实例
2.echarts廊坊市香河县地图飞线图实例代码
3.echarts廊坊市香河县地图label样式自定义演示实例
4.echarts廊坊市香河县地图局部颜色渐变实例
5.echarts廊坊市香河县地图全局颜色渐变实例
6.echarts廊坊市香河县地图 visualMap控制地图颜色演示实例
7.echarts廊坊市香河县地图自定义引导线演示实例
8.echarts廊坊市香河县地图区域闪烁效果
9.echarts廊坊市香河县地图添加柱状图实例代码
10.echarts廊坊市香河县地图水滴状气泡图实例
11.echarts廊坊市香河县地图圆形波纹状气泡图代码演示
12.echarts廊坊市香河县地图点击地图插小旗代码演示
13.echarts廊坊市香河县地图 tooltip轮播演示实例
14.echarts廊坊市香河县地图阴影实例
15.echarts廊坊市香河县地图热力图演示实例
16.echarts廊坊市香河县地图指定区域高亮演示实例
17.echarts廊坊市香河县地图点击跳转到指定页面实例
18.echarts廊坊市香河县地图3d地图代码演示
19.echarts廊坊市香河县地图3d地图自定义图标演示实例
20.echarts廊坊市香河县地图3d地图实例旋转动画实例代码
21.echarts廊坊市香河县地图点击弹出自定义弹窗演示实例
22.echarts廊坊市香河县地图点击地图获取经纬度效果
23.echarts廊坊市香河县地图根据经纬度显示自定义html弹窗演示实例
24.echarts廊坊市香河县地图地图排行榜效果实例
25.echarts廊坊市香河县地图tooltip自定义html效果
threejs 廊坊市香河县地图效果实例
1.threejs廊坊市香河县地图3d地图实例代码
2.threejs廊坊市香河县地图3d地图css2d标签实例
3.threejs廊坊市香河县地图3d地图鼠标移入显示标签并高亮效果实例
4.threejs廊坊市香河县地图3d地图CSS3D标签效果实例
5.threejs廊坊市香河县地图3d地图添加旋转棱锥代码演示
6.threejs廊坊市香河县地图3d地图自定义贴图加CSS3D标签效果实例
7.threejs廊坊市香河县地图3d地图自定义贴图加CSS2D标签效果
8.threejs廊坊市香河县地图3d地图指定区域闪烁实例
廊坊市香河县下辖有淑阳镇,渠口镇,钱旺乡,钳屯乡,五百户镇,安头屯镇,蒋辛屯镇,香河开发区,香河现代产业园,安平镇,刘宋镇
廊坊市香河县下辖区域坐标
{"淑阳镇":[116.99836575460476,39.76441986492643],"渠口镇":[117.13700029267861,39.77853297125658],"钱旺乡":[117.0468215603419,39.77787854099907],"钳屯乡":[116.97735564520181,39.7115576377074],"五百户镇":[117.00983255707769,39.67811402129804],"安头屯镇":[117.09431744006649,39.71643047363786],"蒋辛屯镇":[116.96278147633109,39.82536234843694],"香河开发区":[116.90133328951177,39.70870627645718],"香河现代产业园":[117.0072635199551,39.80398760723548],"安平镇":[116.91767781678945,39.73369140623169],"刘宋镇":[117.11856732434764,39.66508898077605]}