百度地图多段线绘制插件
npm install bmap-multipolyline> 百度地图多段线绘制插件
``bash`
npm install bmap-multipolylineOR
yarn add bmap-multipolyline
`js
import bMapMultiPolyline from 'bmap-multipolyline';
// 百度地图加载完成后调用
bMapMultiPolyline();
// 绘制多段线
BMap.MultiPolyline(points, options);
// 或者
BMapGL.MultiPolyline(points, options);
`
`js
let multiPoints = [
[
'116.27961508447355,40.049453414029834',
'116.2801675423622,40.04985729053617',
'116.2798172032133,40.050264616535344',
'116.28072000025082,40.050461374825595',
'116.2815823735404,40.05003679043139',
'116.28114220384052,40.04954661651461',
],
['116.27966898280415,40.04863529781763', '116.28142067854861,40.04870778952721'],
];
multiPoints = multiPoints.map((points) => points.map((point) => new BMapGL.Point(...point.split(','))));
const multiPolyline = new BMapGL.MultiPolyline(multiPoints, { strokeColor: 'red' });
map.addOverlay(multiPolyline);
``
| 参数 | 类型 | 描述 |
| ------- | ------ | ----------------------- |
| points | Array | 多段线的 Point 二维数组 |
| options | Object | 多段线的配置 |
#### options
| 属性 | 类型 | 描述 |
| ------------- | ------ | ------------------------------ |
| strokeColor | String | 多段线颜色 |
| strokeWeight | Number | 多段线的宽度,以像素为单位 |
| strokeOpacity | Number | 多段线的透明度,取值范围 0 - 1 |