mirror of https://gitee.com/antv-l7/antv-l7
feat(text): text add textAllowOverlap propertry
新增文本避让开关方法 style({ textAllowOverlap: true })
This commit is contained in:
parent
caca3eaca0
commit
1ffc84e5d7
|
@ -108,6 +108,9 @@
|
|||
right: 0;
|
||||
top: 0;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
font-size: 25px;
|
||||
line-height: 20px;
|
||||
border-radius: 0 3px 0 0;
|
||||
cursor: pointer;
|
||||
background-color: transparent;
|
||||
|
|
|
@ -43,7 +43,8 @@ function drawGlyph(
|
|||
spacing = 2,
|
||||
textAnchor = 'center',
|
||||
textOffset = [ 0, 0 ],
|
||||
padding = [ 4, 4 ]
|
||||
padding = [ 4, 4 ],
|
||||
textAllowOverlap
|
||||
},
|
||||
fontAtlasManager,
|
||||
collisionIndex,
|
||||
|
@ -87,7 +88,7 @@ function drawGlyph(
|
|||
}, mvpMatrix);
|
||||
|
||||
// 无碰撞则加入空间索引
|
||||
if (box && box.length) {
|
||||
if (textAllowOverlap || box && box.length) {
|
||||
// TODO:featureIndex
|
||||
collisionIndex.insertCollisionBox(box, 0);
|
||||
|
||||
|
|
|
@ -10,7 +10,8 @@ const defaultTextStyle = {
|
|||
padding: [ 4, 4 ],
|
||||
stroke: 'white',
|
||||
strokeWidth: 2,
|
||||
strokeOpacity: 1.0
|
||||
strokeOpacity: 1.0,
|
||||
textAllowOverlap: false
|
||||
};
|
||||
export default function DrawText(layerData, layer) {
|
||||
const style = {
|
||||
|
@ -19,16 +20,19 @@ export default function DrawText(layerData, layer) {
|
|||
};
|
||||
layer.set('styleOptions', style);
|
||||
const activeOption = layer.get('activedOptions');
|
||||
const { strokeWidth, stroke, opacity } = style;
|
||||
const { strokeWidth, stroke, opacity, textAllowOverlap } = style;
|
||||
const { width, height } = layer.scene.getSize();
|
||||
const { geometry, texture, fontAtlas } = _updateGeometry(layerData, layer);
|
||||
layer.scene.on('camerachange', () => {
|
||||
const updateGeometryHander = () => {
|
||||
const { geometry } = _updateGeometry(layerData, layer);
|
||||
layer.layerMesh.geometry = geometry;
|
||||
layer.layerMesh.geometry.needsUpdate = true;
|
||||
});
|
||||
|
||||
|
||||
};
|
||||
if (!textAllowOverlap) {
|
||||
layer.scene.on('camerachange', updateGeometryHander);
|
||||
} else {
|
||||
layer.scene.off('camerachange', updateGeometryHander);
|
||||
}
|
||||
const material = new TextMaterial({
|
||||
name: layer.layerId,
|
||||
u_sdf_map: texture,
|
||||
|
@ -56,7 +60,7 @@ export default function DrawText(layerData, layer) {
|
|||
function _updateGeometry(layerData, layer) {
|
||||
const style = layer.get('styleOptions');
|
||||
const {
|
||||
fontFamily, fontWeight, spacing, textAnchor, textOffset, padding } = style;
|
||||
fontFamily, fontWeight, spacing, textAnchor, textOffset, padding, textAllowOverlap } = style;
|
||||
const { width, height } = layer.scene.getSize();
|
||||
const collisionIndex = new CollisionIndex(width, height);
|
||||
const { _camera: { projectionMatrix, matrixWorldInverse } } = layer.scene._engine;
|
||||
|
@ -85,7 +89,8 @@ function _updateGeometry(layerData, layer) {
|
|||
spacing,
|
||||
textAnchor,
|
||||
textOffset,
|
||||
padding
|
||||
padding,
|
||||
textAllowOverlap
|
||||
},
|
||||
layer.scene.fontAtlasManager,
|
||||
collisionIndex,
|
||||
|
|
|
@ -107,7 +107,7 @@ export default class GaodeMap extends Base {
|
|||
this.amapContainer = this.map.getContainer().getElementsByClassName('amap-maps')[0];
|
||||
this.renderDom = document.createElement('div');
|
||||
this.renderDom.style.cssText +=
|
||||
'position: absolute;top: 0;height: 100%;width: 100%;pointer-events: none;background: white;';
|
||||
'position: absolute;top: 0;height: 100%;width: 100%;pointer-events: none;';
|
||||
this.renderDom.id = 'l7_canvaslayer';
|
||||
|
||||
this.amapContainer.appendChild(this.renderDom);
|
||||
|
@ -130,7 +130,6 @@ export default class GaodeMap extends Base {
|
|||
default:
|
||||
this.set('mapStyle', style);
|
||||
}
|
||||
|
||||
map.setMapStyle(this.get('mapStyle'));
|
||||
if (style === 'blank') {
|
||||
map.setLayers([]);
|
||||
|
|
Loading…
Reference in New Issue