mapbox-draw-expand v1.4.5
mapbox-draw-expand
Expanded development based on mapbox-gl-draw.
CHANGE LOGS
1.3.5
FEAT: support removeLayer.
1.3.4 1.3.3
FIX: delete auxiliaryLine.
1.3.2
DOCS: update change logs.
1.3.1
FIX: Optimize the adsorption effect.
1.3.0
FEAT: support Angle Snapping.
Use this function to draw segment that is parallel, perpendicular or at precisely defined angles (30°, 45°, 60°, 90°) degrees to the base segment.
Basic usage
- Activate
Draw mode
as usual - To select base segment:
- click
Right mouse click
on segment you want to use as reference OR - move mouse that you can choose the direction of next segment to make specific angle between segments (0,30,45,90, degrees etc.).
- click
- Angle snapping mode will snap angle of the new segments to predefined list of angles - thus it's name
EXPAND FUNCTIONS
- In the simple_select or direct_mode, hold
Esc
to switch to simple_select mode and clear all selected features. - In the simple_select mode, hold down
shift + e
to select the feature that has an intersection with the selected feature. And hold downshift + r
to select all. - In the direct_select mode and the seleted feature's type is LineString, when you select the first or last vertex, press and hold
shift + q
to enter the draw_line_string mode. This allows you to continue drawing the current feature. - In the simple_select mode, if some features are selected, press
ctrl + v
to paste the features, and the new features will be rendered to the position centered on the mouse position.
NOTES
同层吸附说明
// 进入绘制 mode 时会触发 draw.drawingInit 事件,可在此设置绘制图形的属性
map.on('draw.drawingInit', function(e) {
Draw.setFeatureProperty(e.featureId, 'level', 1);
})
// mapbox-gl-draw 初始化时增加 adsorbFilterFunc 配置项
/**
* 可吸附 features 过滤
* @param {Object} nowFeature 当前绘制 feature
* @param {Array<Object>} allAdsorbFeatures 当前鼠标位置下可吸附的 features
* @return {Array<Object>} 返回所有可吸附的 features 集合 默认为 allAdsorbFeatures
*/
{
...
adsorbFilterFunc: (nowFeature, allAdsorbFeatures) => {
return allAdsorbFeatures.filter(v => Number(v.properties.level) === Number(nowFeature.properties.level));
}
}
2 years ago
3 years ago
3 years ago
3 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago