可视化数据大屏 项目中经常需要渲染echarts地图,为了不同城市快速实现,将不同城市的echarts地图效果整理出来,今天为大家整理洛阳市孟津区echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
孟津区,隶属于河南省洛阳市,地处河南省中西部,洛阳市北部,东与偃师区相连,西与新安县、济源市相接,北与济源市、河南省孟州市接壤,东与河南省孟州市相邻。孟津区素有河图之源、六朝帝京、邙山福地、黄河明珠之美誉,是历史悠久的文化名地、令人向往的黄河明珠、充满活力的发展热土。 辖区总面积838.7平方千米。截至2020年11月1日,孟津区常住人口485987人。
echarts洛阳市孟津区地图根据经纬度显示自定义html弹窗
echarts地图我们可以通过像素坐标来将我们自定义的html弹窗定位到echarts地图指定位置,如果是固定的宽高的话,这没什么问题直接定位就可以了,如果是自适应宽高的地图我们可能没办法控制精度,我们可以使用经纬度来控制,当echarts地图渲染完成以后,我们可以通过convertToPixel将经纬度转为像素坐标,然后再渲染自定义弹窗,这样精度就比较准确了,而且也不会因为窗体宽高变化而导致弹窗出现偏移.
threejs洛阳市孟津区地图3d地图css2d标签
通过threejs绘制的3d地图css2d标签实例,CSS2D面向摄像机,不随场景缩放而缩放,如果想系统的学习threejs的话,可以观看threejs视频课程 WebGL/Three.js前端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地图指定区域闪烁演示实例
9.threejs洛阳市孟津区地图3d地图CSS2D外加旋转棱锥效果
洛阳市孟津区下辖有大庆路街道,吉利乡
洛阳市孟津区下辖区域坐标
{"大庆路街道":[112.58999068422244,34.90924583246166],"吉利乡":[112.5648504391342,34.90349032499942]}