Skip to content

Commit a37079b

Browse files
committed
提供测量初始化参数
1 parent 5c3b508 commit a37079b

File tree

3 files changed

+89
-55
lines changed

3 files changed

+89
-55
lines changed

geojson-editor/src/components/features/Measurer.vue

Lines changed: 15 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -14,10 +14,12 @@
1414
<div class="measure-properties-controls visible" v-show="currentTab === 'visible'">
1515
<div>面线段方向</div>
1616
<input type="checkbox" v-model="direction">
17+
<div>面线距离</div>
18+
<input type="checkbox" v-model="polygonLine">
1719
<div>面线段距离</div>
18-
<input type="checkbox" v-model="distance">
20+
<input type="checkbox" v-model="polygonLineSegment">
1921
<div>线段距离</div>
20-
<input type="checkbox" v-model="centerDistance">
22+
<input type="checkbox" v-model="lineSegment">
2123
</div>
2224

2325
<div class="measure-properties-controls" v-show="currentTab === 'units'">
@@ -87,14 +89,19 @@ watch(direction, a => {
8789
props.measureManager.showPolygonDirection(a);
8890
});
8991
90-
const distance = ref(true);
91-
watch(distance, a => {
92-
props.measureManager.showPolygonDistance(a);
92+
const polygonLine = ref(true);
93+
watch(polygonLine, a => {
94+
props.measureManager.showPolygonLine(a);
9395
});
9496
95-
const centerDistance = ref(true);
96-
watch(centerDistance, a => {
97-
props.measureManager.showSegment(a);
97+
const polygonLineSegment = ref(true);
98+
watch(polygonLineSegment, a => {
99+
props.measureManager.showPolygonLineSegment(a);
100+
});
101+
102+
const lineSegment = ref(true);
103+
watch(lineSegment, a => {
104+
props.measureManager.showLineSegment(a);
98105
});
99106
100107
const areaUnit = ref<Units.TUnitsArea | 'M2KM2'>("M2KM2");

packages/maplugin-core/managers/measure-manager.ts

Lines changed: 50 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,12 @@ type TMeasureUnits = {
1010
}
1111

1212
interface MeasureOptions {
13+
formats: {
14+
point: (coord: GeoJSON.Position) => string,
15+
line: (length: number, units: Units.TUnitsLength, index: number, end: boolean, segment: boolean) => string,
16+
polygon: (area: number, units: Units.TUnitsArea) => string,
17+
'polygon-line': (length: number, units: Units.TUnitsLength, index: number, end: boolean, segment: boolean) => string,
18+
}
1319
}
1420

1521
export class MeasureManager {
@@ -28,11 +34,6 @@ export class MeasureManager {
2834
*/
2935
private precisions: Map<Units.TUnitsLength | Units.TUnitsArea, number>;
3036

31-
/**
32-
* 是否进行面边界线的测量
33-
*/
34-
private polygonDistance: boolean = true;
35-
3637

3738
readonly id_source_measure_symbol = Tools.uuid();
3839

@@ -65,7 +66,25 @@ export class MeasureManager {
6566
return this.units.area;
6667
}
6768

68-
constructor(dataSource: DrawManager | GeoJSONLayerManagerBase, options: MeasureOptions = {}) {
69+
constructor(dataSource: DrawManager | GeoJSONLayerManagerBase, private options: MeasureOptions = {
70+
formats: {
71+
point: p => {
72+
return `${p[0].toFixed(6)},${p[1].toFixed(6)}`;
73+
},
74+
line: (len, units) => {
75+
const val = len.toFixed(this.precisions.get(units)) + ` ${Units.unitsLengthDescriptions.find(x => x.value === units)?.label}`;
76+
return val;
77+
},
78+
polygon: (area, units) => {
79+
const val = area.toFixed(this.precisions.get(units)) + ` ${Units.unitsAreaDescriptions.find(x => x.value === units)?.label}`;
80+
return val;
81+
},
82+
"polygon-line": (len, units, _, end) => {
83+
const val = len.toFixed(this.precisions.get(units)) + ` ${Units.unitsLengthDescriptions.find(x => x.value === units)?.label}`;
84+
return end ? `终点: ${val}` : val;
85+
}
86+
}
87+
}) {
6988
this.glManager = dataSource instanceof DrawManager ? dataSource.glManager : dataSource;
7089

7190
// 清空自定义数据
@@ -336,26 +355,32 @@ export class MeasureManager {
336355
}
337356

338357
/**
339-
* 是否显示面的长度数据(边界线的测量)
358+
* 显示面线数据
340359
* @param val
341360
*/
342-
showPolygonDistance(val: boolean) {
343-
this.polygonDistance = val;
344-
this.renderMeasure();
361+
showPolygonLine(val: boolean) {
362+
this.glManager.map.setFilter(this.id_layer_measrue_polygon_line,
363+
val ? ['==', ['get', 'type'], 'polygon-line'] : ['==', '1', '0']);
345364
}
346365

347366
/**
348-
* 显示段数据
367+
* 显示面线段数据
349368
* @param val
350369
*/
351-
showSegment(val: boolean) {
352-
this.glManager.map.setFilter(this.id_layer_measrue_line_segment,
353-
val ? ['==', ['get', 'type'], 'line-segment'] : ['==', '1', '0']);
354-
370+
showPolygonLineSegment(val: boolean) {
355371
this.glManager.map.setFilter(this.id_layer_measure_polygon_line_segment,
356372
val ? ['==', ['get', 'type'], 'polygon-line-segment'] : ['==', '1', '0']);
357373
}
358374

375+
/**
376+
* 显示线线段数据
377+
* @param val
378+
*/
379+
showLineSegment(val: boolean) {
380+
this.glManager.map.setFilter(this.id_layer_measrue_line_segment,
381+
val ? ['==', ['get', 'type'], 'line-segment'] : ['==', '1', '0']);
382+
}
383+
359384
/**
360385
* 重绘
361386
*/
@@ -369,19 +394,19 @@ export class MeasureManager {
369394
polygon: {
370395
measureLineStringOptions: {
371396
withStart: false,
372-
format: (len, i, end, center) => {
397+
format: (len, i, end, segment) => {
373398
let units = this.units.length;
374399

375400
if (units === 'MKM')
376401
if (len > 1000) units = 'KM';
377402
else units = 'M';
378403

379404
len = Units.convertLength(len, 'M', units);
380-
const val = len.toFixed(this.precisions.get(units)) + ` ${Units.unitsLengthDescriptions.find(x => x.value === units)?.label}`;
381-
return end ? `终点: ${val}` : val;
405+
406+
return this.options.formats['polygon-line'](len, units, i, end, segment);
382407
}
383408
},
384-
withLineString: this.polygonDistance,
409+
withLineString: true,
385410
format: area => {
386411
let units = this.units.area;
387412

@@ -391,8 +416,7 @@ export class MeasureManager {
391416

392417
area = Units.convertArea(area, 'M2', units);
393418

394-
const val = area.toFixed(this.precisions.get(units)) + ` ${Units.unitsAreaDescriptions.find(x => x.value === units)?.label}`;
395-
return val;
419+
return this.options.formats.polygon(area, units);
396420
}
397421
},
398422
lineString: {
@@ -405,11 +429,14 @@ export class MeasureManager {
405429
else units = 'M';
406430

407431
len = Units.convertLength(len, 'M', units);
408-
const val = len.toFixed(this.precisions.get(units)) + ` ${Units.unitsLengthDescriptions.find(x => x.value === units)?.label}`;
409-
return val;
432+
433+
return this.options.formats.line(len, units, i, end, center);
410434
}
411435
},
412436
point: {
437+
format: p => {
438+
return this.options.formats.point(p);
439+
}
413440
}
414441
})
415442
});

packages/maplugin-core/utils/measurement.ts

Lines changed: 24 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -133,7 +133,7 @@ export namespace Measurement {
133133
* 经纬度格式化
134134
* @param position 经纬度 lng=position[0] lat=position[1]
135135
*/
136-
format?(position: GeoJSON.Position): string
136+
format(position: GeoJSON.Position): string
137137
}
138138

139139
/**
@@ -147,7 +147,7 @@ export namespace Measurement {
147147
* @param end 是否为最后一个
148148
* @param segment 是否为中间数值
149149
*/
150-
format?(length: number, index: number, end: boolean, segment: boolean): string,
150+
format(length: number, index: number, end: boolean, segment: boolean): string,
151151

152152
/**
153153
* 是否包含第一个数值
@@ -158,22 +158,22 @@ export namespace Measurement {
158158
}
159159

160160
type TMeasureCalPolygonOptions = {
161-
format?(area: number): string,
161+
format(area: number): string,
162162
withLineString?: boolean,
163-
measureLineStringOptions?: TMeasureCalLineStringOptions,
163+
measureLineStringOptions: TMeasureCalLineStringOptions,
164164
}
165165

166166
/**
167167
* 测量计算参数
168168
*/
169-
type TMeasureCalOptions = {
170-
point?: TMeasureCalPointOptions,
171-
lineString?: TMeasureCalLineStringOptions,
172-
polygon?: TMeasureCalPolygonOptions
169+
export type TMeasureCalOptions = {
170+
point: TMeasureCalPointOptions,
171+
lineString: TMeasureCalLineStringOptions,
172+
polygon: TMeasureCalPolygonOptions
173173
}
174174

175-
function calPoint(g: GeoJSON.Position, options?: TMeasureCalPointOptions): TMeasureMarkerFeature[] {
176-
const value = options?.format?.(g) || g[0].toFixed(6) + ',' + g[1].toFixed(6);
175+
function calPoint(g: GeoJSON.Position, options: TMeasureCalPointOptions): TMeasureMarkerFeature[] {
176+
const value = options.format(g);
177177
return [{
178178
type: "Feature",
179179
geometry: {
@@ -187,7 +187,7 @@ export namespace Measurement {
187187
}]
188188
}
189189

190-
function calLineString(g: GeoJSON.Position[], options?: TMeasureCalLineStringOptions, isPolygon: boolean = false): TMeasureMarkerFeature[] {
190+
function calLineString(g: GeoJSON.Position[], options: TMeasureCalLineStringOptions, isPolygon: boolean = false): TMeasureMarkerFeature[] {
191191
const ret = new Array<TMeasureMarkerFeature>();
192192
let sumLength = 0;
193193

@@ -213,7 +213,7 @@ export namespace Measurement {
213213
coordinates: c.geometry.coordinates
214214
},
215215
properties: {
216-
value: options?.format?.(l, i, false, true) || `${l.toFixed(2)} m`,
216+
value: options.format(l, i, false, true),
217217
type: isPolygon ? 'polygon-line-segment' : 'line-segment'
218218
}
219219
});
@@ -229,7 +229,7 @@ export namespace Measurement {
229229
coordinates: current
230230
},
231231
properties: {
232-
value: options?.format?.(sumLength, i, i === g.length - 1, false) || `${sumLength.toFixed(2)} m`,
232+
value: options.format(sumLength, i, i === g.length - 1, false),
233233
type: isPolygon ? 'polygon-line' : 'line'
234234
}
235235
});
@@ -238,12 +238,12 @@ export namespace Measurement {
238238
return ret;
239239
}
240240

241-
function calPolygon(g: GeoJSON.Position[][], options?: TMeasureCalPolygonOptions): TMeasureMarkerFeature[] {
241+
function calPolygon(g: GeoJSON.Position[][], options: TMeasureCalPolygonOptions): TMeasureMarkerFeature[] {
242242
const ret = new Array<TMeasureMarkerFeature>();
243243

244244
if (options?.withLineString !== false) {
245245
g.forEach(x => {
246-
ret.push(...calLineString(x, options?.measureLineStringOptions));
246+
ret.push(...calLineString(x, options.measureLineStringOptions, true));
247247
});
248248
}
249249

@@ -259,7 +259,7 @@ export namespace Measurement {
259259
coordinates: center.geometry.coordinates
260260
},
261261
properties: {
262-
value: options?.format?.(a) || `${a.toFixed(2)} m²`,
262+
value: options.format(a),
263263
type: 'polygon'
264264
}
265265
})
@@ -268,20 +268,20 @@ export namespace Measurement {
268268
return ret;
269269
}
270270

271-
function calGeometry(g: GeoJSON.Geometry, options?: TMeasureCalOptions): TMeasureMarkerFeature[] {
272-
if (g.type === 'Point') return calPoint(g.coordinates, options?.point);
273-
if (g.type === 'LineString') return calLineString(g.coordinates, options?.lineString);
274-
if (g.type === 'Polygon') return calPolygon(g.coordinates, options?.polygon);
271+
function calGeometry(g: GeoJSON.Geometry, options: TMeasureCalOptions): TMeasureMarkerFeature[] {
272+
if (g.type === 'Point') return calPoint(g.coordinates, options.point);
273+
if (g.type === 'LineString') return calLineString(g.coordinates, options.lineString);
274+
if (g.type === 'Polygon') return calPolygon(g.coordinates, options.polygon);
275275

276276
function calMulGeometry<T>(data: Array<T>, cal: (d: T, options?: any) => TMeasureMarkerFeature[], options: any): TMeasureMarkerFeature[] {
277277
return data.reduce((p, c) => {
278278
return p.concat(cal(c, options));
279279
}, new Array<TMeasureMarkerFeature>());
280280
}
281281

282-
if (g.type === 'MultiPoint') return calMulGeometry(g.coordinates, calPoint, options?.point);
283-
if (g.type === 'MultiLineString') return calMulGeometry(g.coordinates, calLineString, options?.lineString);
284-
if (g.type === 'MultiPolygon') return calMulGeometry(g.coordinates, calPolygon, options?.polygon);
282+
if (g.type === 'MultiPoint') return calMulGeometry(g.coordinates, calPoint, options.point);
283+
if (g.type === 'MultiLineString') return calMulGeometry(g.coordinates, calLineString, options.lineString);
284+
if (g.type === 'MultiPolygon') return calMulGeometry(g.coordinates, calPolygon, options.polygon);
285285

286286
throw new Error(`not suppose geometry type: ${g.type} to measure`);
287287
}
@@ -292,7 +292,7 @@ export namespace Measurement {
292292
* @param options 计算参数
293293
* @returns
294294
*/
295-
export function cal(data: GeoJSON.Feature | GeoJSON.Feature[] | GeoJSON.Geometry, options?: TMeasureCalOptions) {
295+
export function cal(data: GeoJSON.Feature | GeoJSON.Feature[] | GeoJSON.Geometry, options: TMeasureCalOptions) {
296296
if (data instanceof Array) {
297297
return data.reduce((p, c) => {
298298
const features = calGeometry(c.geometry, options);

0 commit comments

Comments
 (0)