my-openlayer 3.1.0 → 3.1.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +11 -0
- package/core/geojson/GeoJSONRenderer.js +18 -17
- package/core/polygon/Polygon.js +4 -7
- package/core/polygon/PolygonStyleFactory.d.ts +6 -1
- package/core/polygon/PolygonStyleFactory.js +54 -18
- package/docs/Polygon.md +5 -0
- package/package.json +1 -1
- package/types/base.d.ts +5 -0
- package/types/common.d.ts +1 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,16 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## [3.1.1] - 2026-06-09
|
|
4
|
+
|
|
5
|
+
### Bug Fixes
|
|
6
|
+
|
|
7
|
+
- **GeoJSON:** 修复 `addGeoJSON` 传入字符串 `layerName` 时被追加 `groupKey` 和 `geometryType` 的问题;字符串现在作为最终图层名原样使用。
|
|
8
|
+
- **GeoJSON:** 调整混合点线面渲染顺序,避免字符串 `layerName` 同名时面图层清理逻辑误删本次创建的点/线图层。
|
|
9
|
+
|
|
10
|
+
### Tests
|
|
11
|
+
|
|
12
|
+
- 更新 `addGeoJSON` 图层命名回归测试,覆盖字符串 `layerName` 原样使用且混合图层完整保留。
|
|
13
|
+
|
|
3
14
|
## [3.1.0] - 2026-06-09
|
|
4
15
|
|
|
5
16
|
### Features
|
|
@@ -18,12 +18,12 @@ function resolveGeoJSONLayerName(layerName, groupKey, geometryType, datasetKey,
|
|
|
18
18
|
if (typeof layerName === 'function') {
|
|
19
19
|
return layerName({ datasetKey, groupKey, geometryType, index });
|
|
20
20
|
}
|
|
21
|
-
// 确定 base 名称
|
|
22
|
-
let base;
|
|
23
21
|
if (typeof layerName === 'string') {
|
|
24
|
-
|
|
22
|
+
return layerName;
|
|
25
23
|
}
|
|
26
|
-
|
|
24
|
+
// 确定 base 名称
|
|
25
|
+
let base;
|
|
26
|
+
if (Array.isArray(layerName)) {
|
|
27
27
|
base = layerName[Number(datasetKey)] ?? `${layerName[0] ?? 'geojson'}_${datasetKey}`;
|
|
28
28
|
}
|
|
29
29
|
else {
|
|
@@ -200,13 +200,13 @@ export function renderGeoJSON(data, options, deps) {
|
|
|
200
200
|
const pointDatasetKey = pointFeatures[0]?._datasetKey ?? 'default';
|
|
201
201
|
const lineDatasetKey = lineFeatures[0]?._datasetKey ?? 'default';
|
|
202
202
|
const polygonDatasetKey = polygonFeatures[0]?._datasetKey ?? 'default';
|
|
203
|
-
//
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
if (
|
|
208
|
-
groupAllHandles.push(
|
|
209
|
-
allHandles.push(
|
|
203
|
+
// 面图层会清理同名旧图层;当 layerName 是字符串时点线面同名,
|
|
204
|
+
// 因此先创建面图层,避免它误删本次刚创建的点/线图层。
|
|
205
|
+
if (polygonFeatures.length > 0) {
|
|
206
|
+
polygonHandle = createPolygonHandle(polygonFeatures, options, groupKey, polygonDatasetKey, singleGroup, deps.getPolygon());
|
|
207
|
+
if (polygonHandle) {
|
|
208
|
+
groupAllHandles.push(polygonHandle);
|
|
209
|
+
allHandles.push(polygonHandle);
|
|
210
210
|
}
|
|
211
211
|
}
|
|
212
212
|
// 线图层
|
|
@@ -217,12 +217,13 @@ export function renderGeoJSON(data, options, deps) {
|
|
|
217
217
|
allHandles.push(lineHandle);
|
|
218
218
|
}
|
|
219
219
|
}
|
|
220
|
-
//
|
|
221
|
-
if (
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
220
|
+
// 点图层
|
|
221
|
+
if (pointFeatures.length > 0) {
|
|
222
|
+
const result = createPointLayerHandle(pointFeatures, options, groupKey, pointDatasetKey, singleGroup, deps.getPoint());
|
|
223
|
+
pointHandle = result.handle;
|
|
224
|
+
if (pointHandle) {
|
|
225
|
+
groupAllHandles.push(pointHandle);
|
|
226
|
+
allHandles.push(pointHandle);
|
|
226
227
|
}
|
|
227
228
|
}
|
|
228
229
|
/** *********************组装分组句柄*********************/
|
package/core/polygon/Polygon.js
CHANGED
|
@@ -193,19 +193,16 @@ export default class Polygon {
|
|
|
193
193
|
if (!(layer instanceof VectorLayer)) {
|
|
194
194
|
throw ErrorHandler.getInstance().createAndHandleError(`Layer '${layerName}' is not a vector layer`, ErrorType.LAYER_ERROR);
|
|
195
195
|
}
|
|
196
|
-
const mergedOptions = {
|
|
197
|
-
textFont: '14px Calibri,sans-serif',
|
|
198
|
-
textFillColor: '#FFF',
|
|
199
|
-
textStrokeWidth: 2,
|
|
200
|
-
...options
|
|
201
|
-
};
|
|
202
196
|
const features = layer.getSource()?.getFeatures();
|
|
203
197
|
if (!features) {
|
|
204
198
|
ErrorHandler.getInstance().warn(`No features found in layer '${layerName}'`);
|
|
205
199
|
return;
|
|
206
200
|
}
|
|
201
|
+
const resolution = this.map.getView().getResolution() ?? 1;
|
|
207
202
|
features.forEach((feature) => {
|
|
208
|
-
|
|
203
|
+
const currentStyle = feature.getStyle() ?? layer.getStyle();
|
|
204
|
+
const previousStyles = PolygonStyleFactory.resolveFeatureStyles(currentStyle, feature, resolution);
|
|
205
|
+
PolygonStyleFactory.updateSingleFeatureColor(feature, colorObj, options, previousStyles);
|
|
209
206
|
});
|
|
210
207
|
}
|
|
211
208
|
/**
|
|
@@ -6,8 +6,13 @@ import type { FeatureColorUpdateOptions, PolygonOptions } from "../../types";
|
|
|
6
6
|
*/
|
|
7
7
|
export default class PolygonStyleFactory {
|
|
8
8
|
static getFeatureText(feature: FeatureLike, options: PolygonOptions | FeatureColorUpdateOptions): string;
|
|
9
|
+
private static normalizeStyles;
|
|
10
|
+
static resolveFeatureStyles(styleLike: unknown, feature: FeatureLike, resolution?: number): Style[];
|
|
11
|
+
private static getPreviousStroke;
|
|
12
|
+
private static getPreviousFill;
|
|
13
|
+
private static getPreviousText;
|
|
9
14
|
static createStyle(options: PolygonOptions): Style | Style[] | ((feature: FeatureLike) => Style | Style[]);
|
|
10
15
|
static updateSingleFeatureColor(feature: Feature, colorObj?: {
|
|
11
16
|
[propName: string]: string;
|
|
12
|
-
}, options?: FeatureColorUpdateOptions): void;
|
|
17
|
+
}, options?: FeatureColorUpdateOptions, previousStyles?: Style[]): void;
|
|
13
18
|
}
|
|
@@ -12,6 +12,28 @@ export default class PolygonStyleFactory {
|
|
|
12
12
|
}
|
|
13
13
|
return '';
|
|
14
14
|
}
|
|
15
|
+
static normalizeStyles(styles) {
|
|
16
|
+
if (!styles)
|
|
17
|
+
return [];
|
|
18
|
+
return Array.isArray(styles) ? styles : [styles];
|
|
19
|
+
}
|
|
20
|
+
static resolveFeatureStyles(styleLike, feature, resolution = 1) {
|
|
21
|
+
if (!styleLike)
|
|
22
|
+
return [];
|
|
23
|
+
if (typeof styleLike === 'function') {
|
|
24
|
+
return PolygonStyleFactory.normalizeStyles(styleLike(feature, resolution));
|
|
25
|
+
}
|
|
26
|
+
return PolygonStyleFactory.normalizeStyles(styleLike);
|
|
27
|
+
}
|
|
28
|
+
static getPreviousStroke(styles) {
|
|
29
|
+
return styles.map(style => style.getStroke()).find((stroke) => !!stroke);
|
|
30
|
+
}
|
|
31
|
+
static getPreviousFill(styles) {
|
|
32
|
+
return styles.map(style => style.getFill()).find((fill) => !!fill);
|
|
33
|
+
}
|
|
34
|
+
static getPreviousText(styles) {
|
|
35
|
+
return styles.map(style => style.getText()).find((text) => !!text);
|
|
36
|
+
}
|
|
15
37
|
static createStyle(options) {
|
|
16
38
|
if (options.style) {
|
|
17
39
|
return options.style;
|
|
@@ -56,6 +78,7 @@ export default class PolygonStyleFactory {
|
|
|
56
78
|
text: new Text({
|
|
57
79
|
text,
|
|
58
80
|
font: options.textFont,
|
|
81
|
+
overflow: options.textOverflow,
|
|
59
82
|
fill: new Fill({ color: options.textFillColor }),
|
|
60
83
|
stroke: new Stroke({
|
|
61
84
|
color: options.textStrokeColor,
|
|
@@ -68,30 +91,43 @@ export default class PolygonStyleFactory {
|
|
|
68
91
|
return styles;
|
|
69
92
|
};
|
|
70
93
|
}
|
|
71
|
-
static updateSingleFeatureColor(feature, colorObj, options) {
|
|
72
|
-
const name = options?.textKey ? feature.get(options.textKey) : '';
|
|
73
|
-
const
|
|
74
|
-
const
|
|
75
|
-
const
|
|
76
|
-
const
|
|
77
|
-
const
|
|
78
|
-
const
|
|
79
|
-
const
|
|
94
|
+
static updateSingleFeatureColor(feature, colorObj, options, previousStyles = []) {
|
|
95
|
+
const name = options?.textKey ? String(feature.get(options.textKey) ?? '') : '';
|
|
96
|
+
const hasMappedColor = !!colorObj && Object.prototype.hasOwnProperty.call(colorObj, name);
|
|
97
|
+
const previousStroke = PolygonStyleFactory.getPreviousStroke(previousStyles);
|
|
98
|
+
const previousFill = PolygonStyleFactory.getPreviousFill(previousStyles);
|
|
99
|
+
const previousText = PolygonStyleFactory.getPreviousText(previousStyles);
|
|
100
|
+
const withDefaultStroke = options?.withDefaultStroke !== false;
|
|
101
|
+
const withDefaultFill = options?.withDefaultFill !== false;
|
|
102
|
+
const strokeColor = withDefaultStroke ? options?.strokeColor ?? previousStroke?.getColor() : undefined;
|
|
103
|
+
const strokeWidth = withDefaultStroke ? options?.strokeWidth ?? previousStroke?.getWidth() : undefined;
|
|
104
|
+
const lineDash = withDefaultStroke ? options?.lineDash ?? previousStroke?.getLineDash() ?? undefined : undefined;
|
|
105
|
+
const lineDashOffset = withDefaultStroke ? options?.lineDashOffset ?? previousStroke?.getLineDashOffset() : undefined;
|
|
106
|
+
const newColor = hasMappedColor
|
|
107
|
+
? colorObj[name]
|
|
108
|
+
: options?.fillColor ?? (withDefaultFill ? previousFill?.getColor() : undefined);
|
|
80
109
|
const featureStyle = new Style({
|
|
81
|
-
stroke: strokeColor
|
|
110
|
+
stroke: strokeColor !== undefined || strokeWidth !== undefined || lineDash !== undefined || lineDashOffset !== undefined
|
|
111
|
+
? new Stroke({ color: strokeColor, width: strokeWidth, lineDash, lineDashOffset })
|
|
112
|
+
: undefined,
|
|
82
113
|
fill: newColor ? new Fill({ color: newColor }) : undefined
|
|
83
114
|
});
|
|
84
|
-
|
|
85
|
-
|
|
115
|
+
const textVisible = options?.textVisible ?? !!previousText;
|
|
116
|
+
if (textVisible) {
|
|
117
|
+
const text = options ? PolygonStyleFactory.getFeatureText(feature, options) || previousText?.getText() : previousText?.getText();
|
|
86
118
|
if (text) {
|
|
119
|
+
const textFillColor = options?.textFillColor ?? previousText?.getFill()?.getColor();
|
|
120
|
+
const textStrokeColor = options?.textStrokeColor ?? previousText?.getStroke()?.getColor();
|
|
121
|
+
const textStrokeWidth = options?.textStrokeWidth ?? previousText?.getStroke()?.getWidth();
|
|
87
122
|
featureStyle.setText(new Text({
|
|
88
123
|
text,
|
|
89
|
-
font: options
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
124
|
+
font: options?.textFont ?? previousText?.getFont(),
|
|
125
|
+
overflow: options?.textOverflow ?? previousText?.getOverflow(),
|
|
126
|
+
offsetY: options?.textOffsetY ?? previousText?.getOffsetY(),
|
|
127
|
+
fill: textFillColor !== undefined ? new Fill({ color: textFillColor }) : undefined,
|
|
128
|
+
stroke: textStrokeColor !== undefined || textStrokeWidth !== undefined
|
|
129
|
+
? new Stroke({ color: textStrokeColor, width: textStrokeWidth })
|
|
130
|
+
: undefined
|
|
95
131
|
}));
|
|
96
132
|
}
|
|
97
133
|
}
|
package/docs/Polygon.md
CHANGED
|
@@ -37,6 +37,8 @@ const polygon = new Polygon(map: Map);
|
|
|
37
37
|
| `textFont` | `string` | 字体样式 |
|
|
38
38
|
| `textFillColor` | `string` | 文本颜色 |
|
|
39
39
|
| `textStrokeColor` | `string` | 文本描边颜色 |
|
|
40
|
+
| `textStrokeWidth` | `number` | 文本描边宽度 |
|
|
41
|
+
| `textOverflow` | `boolean` | 是否允许文字溢出面范围。设为 `true` 时,文字不会因为当前缩放下放不进面内而被 OpenLayers 隐藏 |
|
|
40
42
|
| **其他** | | |
|
|
41
43
|
| `mask` | `boolean` | 是否作为蒙版(配合 `setOutLayer` 使用) |
|
|
42
44
|
|
|
@@ -112,6 +114,8 @@ updateFeatureColor(
|
|
|
112
114
|
| `colorObj` | `Object` | 颜色映射对象 `{ '区域名': '颜色值' }` |
|
|
113
115
|
| `options` | `FeatureColorUpdateOptions` | 包含 textKey 等配置以匹配要素 |
|
|
114
116
|
|
|
117
|
+
未在 `options` 中指定的样式会沿用要素当前样式,例如 `strokeColor`、`strokeWidth`、`textFont`、`textFillColor`、`textStrokeColor`、`textStrokeWidth`、`textOverflow` 等。只传颜色映射时不会重置原有文字样式。
|
|
118
|
+
|
|
115
119
|
### addImageLayer
|
|
116
120
|
|
|
117
121
|
添加静态图片图层(如叠加平面图、卫星图)。
|
|
@@ -183,6 +187,7 @@ polygonModule.addPolygon(polygonData, {
|
|
|
183
187
|
textFillColor: '#fff',
|
|
184
188
|
textStrokeColor: 'blue',
|
|
185
189
|
textStrokeWidth: 2,
|
|
190
|
+
textOverflow: true, // 允许文字溢出面范围,避免随缩放尺寸不足被隐藏
|
|
186
191
|
fitView: true
|
|
187
192
|
});
|
|
188
193
|
```
|
package/package.json
CHANGED
package/types/base.d.ts
CHANGED