本篇博客是在上篇博客的基础上增加了新功能：显示地图数据并且可以使用选择刷刷选地图上的散点。
以下如有误漏，敬请指正。
目录
存在问题：（“√”表示已解决）
- echarts事件（上篇博客填坑）（√）
- 选择刷被选择的重复数据项过多的问题（√）
- 地图缩放时选择块的区域无法跟随缩放，使用原始的geo坐标时只需在brush配置中指定geoIndex即可，而bmap似乎无法指定
- 在使用选择刷时地图不能开启拖拽，否则地图会被拖动，无法刷选所需的点
解决：
echarts事件
在使用echarts组件时向其添加vue的ref特性以绑定该子组件，这样即可以在当前组件中操作echarts组件，由于本人在写echarts单页组件时将创建成功的echarts实例绑定到组件，因此父组件中获得的echarts组件中包含了echarts实例，这样就能在父组件中肆无忌惮的使用echartsAPI了。主要代码如下：
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
//父组件 start <template> <div> <echarts :option="option" ref="map" /> </div> </template> <script> let map = this.$refs.map; //console.log(map.chart); ... </script> //父组件 end //子组件（echarts.vue） start <script> ... let chart = echarts.init(this.$el); this.chart = chart; </script> //子组件 end |
选择刷刷选的重复数据项过多
当前的思路是保存当前选择刷选中的数据项和上次选中的数据项，将两个数组比较，相同则丢弃当前数组，反之入栈保存，将该数组数据每个维度显示一个折线图或柱状图。
后两个问题需要调用百度地图api，暂时未解决。
未完待续…
