1
1
## 百度地图扩展
2
2
3
- ECharts 百度地图扩展,可以在百度地图上展现 [ 点图] ( https://echarts.apache.org/zh/option.html#series-scatter ) ,[ 线图] ( https://echarts.apache.org/zh/option.html#series-line ) ,[ 热力图] ( https://echarts.apache.org/zh/option.html#series-heatmap ) 等可视化。
3
+ ECharts 百度地图扩展,可以在百度地图上展现 [ 点图] ( https://echarts.apache.org/zh/option.html#series-scatter ) ,[ 线图] ( https://echarts.apache.org/zh/option.html#series-lines ) ,[ 热力图] ( https://echarts.apache.org/zh/option.html#series-heatmap ) 等可视化。
4
4
5
5
6
6
### 示例
@@ -11,18 +11,19 @@ ECharts 百度地图扩展,可以在百度地图上展现 [点图](https://ech
11
11
12
12
[ 北京公交路线特效] ( https://echarts.apache.org/examples/zh/editor.html?c=lines-bmap-effect )
13
13
14
- [ 北京公交路线特效] ( https://echarts.apache.org/examples/zh/editor.html?c=lines-bmap-effect )
15
-
16
14
[ 杭州热门步行路线] ( https://echarts.apache.org/examples/zh/editor.html?c=heatmap-bmap )
17
15
16
+ [ 在地图上显示分箱图] ( https://echarts.apache.org/examples/zh/editor.html?c=map-bin )
17
+
18
18
19
19
### 引入
20
20
21
21
可以直接引入打包好的扩展文件和百度地图的 jssdk
22
22
23
23
``` html
24
- <!-- 引入百度地图的jssdk,这里需要使用你在百度地图开发者平台申请的 ak-->
25
- <script src =" http://api.map.baidu.com/api?v=2.0&ak=" ></script >
24
+ <!-- 引入百度地图的 JS SDK,这里需要使用你在百度地图开发者平台申请的 ak -->
25
+ <!-- 如需使用百度地图 2.0 版本,请将 `v=3.0` 改为 `v=2.0` -->
26
+ <script src =" https://api.map.baidu.com/api?v=3.0&ak=" ></script >
26
27
<!-- 引入 ECharts -->
27
28
<script src =" dist/echarts.min.js" ></script >
28
29
<!-- 引入百度地图扩展 -->
@@ -46,21 +47,32 @@ require('echarts/extension/bmap/bmap');
46
47
option = {
47
48
// 加载 bmap 组件
48
49
bmap: {
49
- // 百度地图中心经纬度
50
+ // 百度地图中心经纬度。默认为 [104.114129, 37.550339]。
50
51
center: [120.13066322374 , 30.240018034923 ],
51
- // 百度地图缩放
52
+ // 百度地图缩放级别。默认为 5。
52
53
zoom: 14 ,
53
- // 是否开启拖拽缩放,可以只设置 'scale' 或者 'move'
54
+ // 是否开启拖拽缩放,可以只设置 'scale' 或者 'move'。默认关闭。
54
55
roam: true ,
55
- // 百度地图的自定义样式,见 http://developer.baidu.com/map/jsdevelop-11.htm
56
- mapStyle: {}
56
+ // 百度地图的旧版自定义样式,见 https://lbsyun.baidu.com/custom/index.htm
57
+ mapStyle: {},
58
+ // 百度地图 3.0 之后的新版自定义样式,见 https://lbsyun.baidu.com/index.php?title=open/custom
59
+ mapStyleV2: {},
60
+ // 百度地图的初始化配置,见 https://lbsyun.baidu.com/cms/jsapi/reference/jsapi_reference.html#a0b1
61
+ mapOptions: {
62
+ // 禁用百度地图自带的底图可点功能
63
+ enableMapClick: false
64
+ }
57
65
},
58
66
series: [{
59
67
type: ' scatter' ,
60
68
// 使用百度地图坐标系
61
69
coordinateSystem: ' bmap' ,
62
70
// 数据格式跟在 geo 坐标系上一样,每一项都是 [经度,纬度,数值大小,其它维度...]
63
- data: [ [120 , 30 , 1 ] ]
71
+ data: [ [120 , 30 , 1 ] ],
72
+ // 编码数据项中第三个元素作为 value 维度
73
+ encode: {
74
+ value: 2
75
+ }
64
76
}]
65
77
}
66
78
0 commit comments