前言

MapVGL，是一款基于WebGL的地理信息可视化库，可以用来展示大量基于3D的地理信息点线面数据。设计初衷主要是为了解决大数据量的三维地理数据展示问题及一些炫酷的三维效果。

官网地址：MapV开发文档

公司项目中针对地图上的数据展示效果，由于数据量过大，有些是路段展示，有些是点展示，用百度地图原本的地图画线、打点功能也能实现，但是交互效果不是很好，首次加载很慢且拖动地图会卡，用到mapV这个类似可以解决海量数据展示问题。

一、使用步骤

1、前期准备

首先vue项目下要在html页面引入几个官方js文件，马赛克的是百度ak 需要自己去申请。

js文件引入过后在页面就可以开始用mapv可视化实现想要的地图效果了 ↓↓↓↓

2、开始开发

首先初始化百度地图，然后定义mapView实例，我在全局定义了一个，方便后面能直接拿到，

画线功能↓↓

mapData是后端返回的要展示的数据，这个根据数据结构来筛选要的经纬度集合，因为是画线，coordinates这个对应的是每个线段的经纬度集合，new mapvgl.LineLayer后面对象里面就是对线条的一些样式大，data把所有要展示的线条赋值就行，onClick鼠标点击线条触发，可以做一些交互的效果也有右击onRightClick ，最后把创建的实例添加到全局mapView.addLayer(this.lineLayer)

点聚合功能↓↓

和画线功能类似，只不过coordinates对应是点的经纬度，因为点聚合最后的地图级别显示的是点，点的样式可以自行设置 icon，后面的属性都大差不差了。

最后给大家看看效果~~~

3、补充

官网有些文档写的还算详细的，有些图层类的操作也能用到

removeAllLayers：删除所有图层

hideLayer：隐藏对应图层

showLayer：显示对应图层

总结

加油呀！！！有问题可以多多沟通交流哈小白还请大家多多指教

百度地图MapV实现海量数据画线、点聚合等功能相关推荐

百度地图坐标点轨迹画线php,百度地图绘制轨迹点
没有后台获取事实信息都是伪数据- -轨迹信息做不到事实导航. 控件可以根据自己的需求添加位置通过offset:new BMAP.Size(x,y)进行微调事实路况信息需要通过引没有后台获取事实信 ...
百度地图坐标点轨迹画线php,百度map经纬度定位绘制路线图
物流配送大多涉及到派送轨迹路线(效果如下图) 首先开发百度地图的有一个自己的秘钥这个很简单,在官网上注册一个就ok了 http://lbsyun.baidu.com/apiconsole/key 我直 ...
百度地图结合echarts实现飞线
百度地图结合echarts实现飞线目前很流行的地图轨迹飞线图,咱也来实现一个,使用百度地图和echarts图表实现,示例如下,(其实百度地图api有一个位置数据可视化MapV GL也可实现,需要的小 ...
【百度地图API】暑假放假回老家——城市切换功能
原文:[百度地图API]暑假放假回老家--城市切换功能任务描述: 酸奶小妹放寒假啦,要从北京呼啦一下飞回重庆呢.现在百度地图API上不能直接切换城市,怎么办呢? 如何实现: 利用API先搜索到要去城 ...
android开发百度地图坐标偏差,利用百度地图Android sdk高仿微信发送位置功能及遇到的问题...
接触了百度地图开发平台半个月了,这2天试着模仿了微信给好友发送位置功能,对百度地图的操作能力又上了一个台阶我在实现这个功能的时候,遇到一些困难,可能也是别人将会遇到的困难,特在此列出 1.在微信发送 ...
百度地图可视化之实现飞线动画
此文章最终实现的效果如下图: 使用mapv和mapvgl两个框架来实现百度地图的可视化. Mapv 是一款地理信息可视化开源库,可以用来展示大量地理信息数据,点.线.面的数据,每种数据也有不 ...
百度地图API——多点路径连线问题
本文系作者 chaoCode原创,转载请私信并在文章开头附带作者和原文地址链接. 违者,作者保留追究权利. 前言本文是对于在项目应用有遇到的多点连线问题,我的一些解决方式,以及对于之前所学习的一些百 ...
百度地图基本使用及画线路轨迹播放问题
最近项目中用到了百度地图,以前用过的有点老了,最近百度地图改版了,所以这里记录一下遇到的问题. 百度地图一些基本的配置我就不说了,直接看百度地图开发者中心:http://lbsyun.baidu.co ...
百度地图mapv方法封装
项目中使用到了百度地图,把一些方法进行了封装,在此记录一下,方便自己和其他人以后使用 1. 代码环境因为项目需求,前端页面中引用vue.js进行开发,不过这部分和百度地图关系不大,可以忽略不记 2. ...

百度地图MapV实现海量数据画线、点聚合等功能

前言

removeAllLayers：删除所有图层

hideLayer：隐藏对应图层

showLayer：显示对应图层

总结

百度地图MapV实现海量数据画线、点聚合等功能相关推荐

最新文章

热门文章

百度地图MapV实现海量数据画线、点聚合等功能

前言

removeAllLayers： 删除所有图层

hideLayer：隐藏对应图层

showLayer：显示对应图层

总结

百度地图MapV实现海量数据画线、点聚合等功能相关推荐

最新文章

热门文章

removeAllLayers：删除所有图层