echart 广州3d_echarts绘制3D城市地图

使用echarts 绘制中国地图/各省地图/市级地图的3D地图

先上效果图javascript

中国

html

四川省

java

成都市

git

3D地图说明

经过使用 series-map3D 能够绘制3D地图apache

快速开始

1.须要先下载echarts.js,而后额外下载 echarts-gl.js,并在页面中引入json

这个两个js文件能够在echarts官网下载也能够在上面给的dome项目中拷贝

echarts资源下载

echarts扩展下载echarts

2.经过json导入地图数据dom

$.get('map/json/china.json', function (chinaJson) {

echarts.registerMap('china', chinaJson); // 注册地图

var chart = echarts.init(document.getElementById('main'));

chart.setOption({

series: [{

type: 'map3D', // map、map3D

map: 'china' // 注册的地图名称

}]

});

中国地图/各省地图/市级地图

使用方式相同惟一的区别是导入不一样的 json 文件编码

demo项目中附带china.json以及各级省市json文件

/map/目录下有中国地图以及各省市的地图 json文件 /map/geoCitys.js是省市关联文件

level表明行政级别

code表明城市编码

地图数据json文件可能不许确能够自行下载替换

DATAV

echart 广州3d_echarts绘制3D城市地图相关推荐

利用echart和echart-gl绘制江苏省的地图之一
文章目录利用echart和echart-gl绘制江苏省的地图之一 1. 初始化配置 1.1 引入echarts.echarts-gl.江苏省的地图数据 1.2 初始化echarts的参数配置 1.2 ...
绘制3D Echarts地图饼图堆叠柱状图
绘制3D Echarts 目前在项目中遇到过的3D echarts为: 1.3D饼图(圆环图) 2.3D区域地图 3.3D堆叠柱状图. 1.echarts + echarts-gl => 绘制3 ...
echart 广州3d_vue echarts 3D地图+省+弹窗
先看效果图 image.png image.png 首先下载echarts 插件,3d地图需要依赖echarts-gl npm install echarts --save npm install e ...
echart 广州3d_一个3D可视化项目背后的心酸：ECharts-X的坎坷路
一个3D可视化项目背后的心酸:ECharts-X的坎坷路 (2015-02-05 17:26:32) 标签: 大数据可视化项目 Raincent网络大数据(http://www.raincent.c ...
高德地图3D城市地图实现gps打点可视化数据显示
<template><div id="amapContainer"></div> </template><script> ...
Echartds-gl (3D) 城市地图，点击事件，实现下钻等操作
在可视化项目中,实现鼠标点击那一块就拿到那一块的数据 let areaData=''; // 定义一个变量用于存储鼠标经过的区域data emphasis: {disabled: true, // ...
【高德地图进阶】--- 3d城市版块之wall
在之前的文章描述了如何通过prism绘制3d城市版块,这篇文章将采用另外的方式来实现3d版块的制作 AMap.Object3D.Wall wall 见名知意,这个api就是绘制墙的, 也可以看做是有高 ...
【高德地图进阶】--- 3d城市版块之prism
在[高德地图入门]-通过geoJson绘制点,线,面一章中,我们学会了如何绘制城市版块的平面.但为了凸显某个城市,一般情况下都会将该城市的版块抬高实现3d效果.现在我们就来学学如何抬高地图版块整理 ...
echarts绘制3D地图
使用echarts和echarts-gl绘制3D地图,下面是一个demo演示,echarts版本4.6.0,echarts-gl版本1.1.2,demo启动前先自行安装,至于背景嘛,大家就自行放个背景 ...

echart 广州3d_echarts绘制3D城市地图

echart 广州3d_echarts绘制3D城市地图相关推荐

最新文章

热门文章