BezierCurve
构造函数
- #new BezierCurve(
points: Point[],
controlPoints: Point[][],
opts?: BezierCurveOptions,
): BezierCurve创建三次贝塞尔曲线覆盖物
参数 类型 说明 pointsPoint[]曲线路径点数组,至少包含两个点 controlPointsPoint[][]控制点数组,每两个路径点之间对应一组1或2个控制点,组数应为 points.length - 1,格式如[[cp1, cp2], [cp3]]opts可选BezierCurveOptions可选参数 属性 类型 说明 dashArraynumber[]虚线样式配置,如 [8, 4] 表示实线部分长8像素、间隙部分长4像素。 默认虚线中实线和空隙的长度均为线宽的2倍 enableClickingboolean是否响应点击事件 enableMassClearboolean是否在调用 map.clearOverlays() 时清除此覆盖物 strokeColorstring曲线颜色,格式为 '#xxxxxx' strokeOpacitynumber曲线透明度,取值范围0 - 1 strokeStyle"solid" | "dashed" | "dotted"曲线样式 strokeWeightnumber曲线宽度,以像素为单位 zIndexnumber覆盖物的初始层叠顺序,也可通过 setZIndex() 方法修改 返回值 BezierCurve
示例代码1
const bezierCurve = new BMap.BezierCurve(
[new BMap.Point(116.399, 39.910), new BMap.Point(116.415, 39.930)],
[[new BMap.Point(116.405, 39.940)]],
{ strokeColor: '#0055ff', strokeWeight: 3 }
);
map.addOverlay(bezierCurve);
方法
- #addEventListener<
K extends
| "click"
| "dblclick"
| "rightclick"
| "rightdblclick"
| "mousemove"
| "mousedown"
| "mouseup"
| "mouseover"
| "mouseout"
| "remove"
| "lineupdate",
>(
event: K,
handler: (e: BezierCurveEventMap[K]) => void,
): void添加事件监听函数
参数 类型 说明 eventK事件名称 handler(e: BezierCurveEventMap[K]) => void事件处理函数 返回值 void
示例代码1
bezierCurve.addEventListener('click', (e) => {
console.log('bezierCurve clicked', e);
});
禁止覆盖物在 map.clearOverlays() 方法中被清除
返回值 void
draw
- draw(): void
抽象生命周期方法,当地图状态发生变化时调用,对覆盖物进行绘制。
仅在自定义覆盖物时需要实现此方法。内置覆盖物已在内部实现,用户无需调用也无需重写。
返回值 void
允许覆盖物在 map.clearOverlays() 方法中被清除
返回值 void
返回覆盖物的地理区域范围
参数 类型 说明 normalize可选boolean跨越世界边界时,是否将经度范围扩展为完整世界;默认为 false,保留跨 180° 经线的紧凑范围,传 true 时返回 [-180°, 180°] 的整世界范围。 返回值 Bounds
返回曲线的控制点数组
返回值 Point[][]
返回覆盖物所在的地图实例
返回值 Map
返回曲线的路径点数组
返回值 Point[]
返回曲线颜色
返回值 string
返回曲线透明度
返回值 number
返回曲线样式
返回值 "solid" | "dashed" | "dotted"
返回曲线线宽
返回值 number
hide
- hide(): void
隐藏覆盖物。对于自定义覆盖物,此方法会自动将initialize方法返回的HTML元素样式的display属性设置为none
返回值 void
initialize
抽象生命周期方法,用于初始化覆盖物,当调用map.addOverlay时,API内部将调用此方法。
仅在自定义覆盖物时需要实现此方法,并返回覆盖物对应的HTML元素。 内置覆盖物(
Marker、Polyline、Polygon等)已在内部实现,用户无需调用也无需重写。参数 类型 说明 mapMap返回值 HTMLElement
示例代码2
class MyOverlay extends BMap.Overlay {
initialize(map: BMap.Map) {
const div = document.createElement('div');
div.textContent = '自定义覆盖物';
map.getPanes().markerPane.appendChild(div);
return div;
}
draw() {}
}
is Visible
- isVisible(): boolean
判断覆盖物是否可见
返回值 boolean
- #removeEventListener<
K extends
| "click"
| "dblclick"
| "rightclick"
| "rightdblclick"
| "mousemove"
| "mousedown"
| "mouseup"
| "mouseover"
| "mouseout"
| "remove"
| "lineupdate",
>(
event: K,
handler: (e: BezierCurveEventMap[K]) => void,
): void移除事件监听函数
参数 类型 说明 eventK事件名称 handler(e: BezierCurveEventMap[K]) => void事件处理函数 返回值 void
示例代码3
const handler = (e: any) => { console.log(e); };
bezierCurve.addEventListener('click', handler);
bezierCurve.removeEventListener('click', handler);
设置曲线的控制点数组,每两个路径点之间可有1或2个控制点
参数 类型 说明 controlPointsPoint[][]控制点数组,组数应为当前路径点数量减1 返回值 void
示例代码1
bezierCurve.setControlPoints([[new BMap.Point(116.410, 39.940)]]);
设置曲线的路径点数组
参数 类型 说明 pathPoint[]路径点数组 返回值 void
示例代码1
bezierCurve.setPath([
new BMap.Point(116.399, 39.910),
new BMap.Point(116.420, 39.935),
]);
设置曲线颜色
参数 类型 说明 colorstring颜色值,格式为 '#xxxxxx' 返回值 void
示例代码1
bezierCurve.setStrokeColor('#ff0000');
设置曲线透明度
参数 类型 说明 opacitynumber透明度,取值范围0 - 1 返回值 void
示例代码1
bezierCurve.setStrokeOpacity(0.7);
设置曲线样式
参数 类型 说明 style"solid" | "dashed" | "dotted"线样式 返回值 void
示例代码1
bezierCurve.setStrokeStyle('dashed');
设置曲线线宽
参数 类型 说明 weightnumber线宽,单位像素,须为大于等于1的整数 返回值 void
示例代码1
bezierCurve.setStrokeWeight(4);
设置覆盖物的 zIndex
参数 类型 说明 zIndexnumber层叠顺序值 返回值 void
show
- show(): void
显示覆盖物。对于自定义覆盖物,此方法会自动将initialize方法返回的HTML元素样式的display属性设置为空
返回值 void
此类表示一个三次贝塞尔曲线覆盖物。