ol 7.0.0-dev.1659727231744 → 7.0.0-dev.1659909182469
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/control/ScaleLine.d.ts +6 -5
- package/control/ScaleLine.d.ts.map +1 -1
- package/control/ScaleLine.js +46 -86
- package/format/KML.js +5 -5
- package/ol.css +12 -8
- package/package.json +1 -1
package/control/ScaleLine.d.ts
CHANGED
|
@@ -9,7 +9,8 @@ export type Units = 'degrees' | 'imperial' | 'nautical' | 'metric' | 'us';
|
|
|
9
9
|
export type ScaleLineOnSignature<Return> = import("../Observable").OnSignature<import("../Observable").EventTypes, import("../events/Event.js").default, Return> & import("../Observable").OnSignature<import("../ObjectEventType").Types | 'change:units', import("../Object").ObjectEvent, Return> & import("../Observable").CombinedOnSignature<import("../Observable").EventTypes | import("../ObjectEventType").Types | 'change:units', Return>;
|
|
10
10
|
export type Options = {
|
|
11
11
|
/**
|
|
12
|
-
* CSS
|
|
12
|
+
* CSS class name. The default is `ol-scale-bar` when configured with
|
|
13
|
+
* `bar: true`. Otherwise the default is `ol-scale-line`.
|
|
13
14
|
*/
|
|
14
15
|
className?: string | undefined;
|
|
15
16
|
/**
|
|
@@ -66,7 +67,8 @@ export type Options = {
|
|
|
66
67
|
*/
|
|
67
68
|
/**
|
|
68
69
|
* @typedef {Object} Options
|
|
69
|
-
* @property {string} [className
|
|
70
|
+
* @property {string} [className] CSS class name. The default is `ol-scale-bar` when configured with
|
|
71
|
+
* `bar: true`. Otherwise the default is `ol-scale-line`.
|
|
70
72
|
* @property {number} [minWidth=64] Minimum width in pixels at the OGC default dpi. The width will be
|
|
71
73
|
* adjusted to match the dpi used.
|
|
72
74
|
* @property {number} [maxWidth] Maximum width in pixels at the OGC default dpi. The width will be
|
|
@@ -209,11 +211,10 @@ declare class ScaleLine extends Control {
|
|
|
209
211
|
private createScaleBar;
|
|
210
212
|
/**
|
|
211
213
|
* Creates a marker at given position
|
|
212
|
-
* @param {
|
|
213
|
-
* @param {number} i The iterator
|
|
214
|
+
* @param {'absolute'|'relative'} position The position, absolute or relative
|
|
214
215
|
* @return {string} The stringified div containing the marker
|
|
215
216
|
*/
|
|
216
|
-
createMarker(position:
|
|
217
|
+
createMarker(position: 'absolute' | 'relative'): string;
|
|
217
218
|
/**
|
|
218
219
|
* Creates the label for a marker marker at given position
|
|
219
220
|
* @param {number} i The iterator
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScaleLine.d.ts","sourceRoot":"","sources":["ScaleLine.js"],"names":[],"mappings":";;;;oBAca,SAAS,GAAG,UAAU,GAAG,UAAU,GAAG,QAAQ,GAAG,IAAI;;;;2CAkBrD,OAAO,eAAe,EAAE,WAAW,CAAC,OAAO,eAAe,EAAE,UAAU,EAAE,OAAO,oBAAoB,EAAE,OAAO,EAAE,MAAM,CAAC,GACjI,OAAW,eAAe,EAAE,WAAW,CAAC,OAAO,oBAAoB,EAAE,KAAK,GAC1E,cAAoB,EAAE,OAAO,WAAW,EAAE,WAAW,EAAE,MAAM,CAAC,GAC9D,OAAW,eAAe,EAAE,mBAAmB,CAAC,OAAO,eAAe,EAAE,UAAU,GAAC,OAAO,oBAAoB,EAAE,KAAK,GAC9G,cAAc,EAAE,MAAM,CAAC
|
|
1
|
+
{"version":3,"file":"ScaleLine.d.ts","sourceRoot":"","sources":["ScaleLine.js"],"names":[],"mappings":";;;;oBAca,SAAS,GAAG,UAAU,GAAG,UAAU,GAAG,QAAQ,GAAG,IAAI;;;;2CAkBrD,OAAO,eAAe,EAAE,WAAW,CAAC,OAAO,eAAe,EAAE,UAAU,EAAE,OAAO,oBAAoB,EAAE,OAAO,EAAE,MAAM,CAAC,GACjI,OAAW,eAAe,EAAE,WAAW,CAAC,OAAO,oBAAoB,EAAE,KAAK,GAC1E,cAAoB,EAAE,OAAO,WAAW,EAAE,WAAW,EAAE,MAAM,CAAC,GAC9D,OAAW,eAAe,EAAE,mBAAmB,CAAC,OAAO,eAAe,EAAE,UAAU,GAAC,OAAO,oBAAoB,EAAE,KAAK,GAC9G,cAAc,EAAE,MAAM,CAAC;;;;;;;;;;;;;;;;;;;;;qBAWR,OAAO,gBAAgB,EAAE,OAAO,KAAE,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;UAU/C,MAAM,GAAC,SAAS;;AA3B9B;;;;;;;GAOG;AAEH;;;;;;;;;;;;;;;;;;;;GAoBG;AAEH;;;;;;;;;;;;;GAaG;AACH;IACE;;OAEG;IACH,+CA2GC;IA/FC;;OAEG;IACH,IAFU,qBAAqB,OAAO,WAAW,EAAE,SAAS,CAAC,CAEtD;IAEP;;OAEG;IACH,MAFU,qBAAqB,OAAO,WAAW,EAAE,SAAS,CAAC,CAEpD;IAET;;OAEG;IACH,IAFU,qBAAqB,IAAI,CAAC,CAE7B;IASP;;;OAGG;IACH,sBAAkD;IAMlD;;;OAGG;IACH,mBAAsB;IAEtB;;;OAGG;IACH,kBAAuE;IAEvE;;;OAGG;IACH,kBAAiC;IAEjC;;;OAGG;IACH,yBAA6B;IAE7B;;;OAGG;IACH,uBAA+B;IAE/B;;;OAGG;IACH,sBAAuB;IAMvB;;;OAGG;IACH,kBAAqC;IAErC;;;OAGG;IACH,uBAAwC;IAExC;;;OAGG;IACH,sBAA0C;IAE1C;;;OAGG;IACH,aAAoC;IAGtC;;;;;;OAMG;IACH,YALY,KAAK,CAOhB;IAED;;OAEG;IACH,4BAEC;IAED;;;;;OAKG;IACH,gBAJW,KAAK,QAMf;IAED;;;;OAIG;IACH,YAHW,MAAM,GAAC,SAAS,QAK1B;IAED;;OAEG;IACH,uBAkIC;IAED;;;;;;OAMG;IACH,uBAoCC;IAED;;;;OAIG;IACH,uBAHW,UAAU,GAAC,UAAU,GACpB,MAAM,CAUjB;IAED;;;;;;;;OAQG;IACH,kBAPW,MAAM,SACN,MAAM,UACN,OAAO,SACP,MAAM,UACN,MAAM,GACL,MAAM,CAoBjB;IAED;;;OAGG;IACH,yBAFY,MAAM,CAYjB;CAgBF"}
|
package/control/ScaleLine.js
CHANGED
|
@@ -39,7 +39,8 @@ const DEFAULT_DPI = 25.4 / 0.28;
|
|
|
39
39
|
|
|
40
40
|
/**
|
|
41
41
|
* @typedef {Object} Options
|
|
42
|
-
* @property {string} [className
|
|
42
|
+
* @property {string} [className] CSS class name. The default is `ol-scale-bar` when configured with
|
|
43
|
+
* `bar: true`. Otherwise the default is `ol-scale-line`.
|
|
43
44
|
* @property {number} [minWidth=64] Minimum width in pixels at the OGC default dpi. The width will be
|
|
44
45
|
* adjusted to match the dpi used.
|
|
45
46
|
* @property {number} [maxWidth] Maximum width in pixels at the OGC default dpi. The width will be
|
|
@@ -79,15 +80,11 @@ class ScaleLine extends Control {
|
|
|
79
80
|
constructor(opt_options) {
|
|
80
81
|
const options = opt_options ? opt_options : {};
|
|
81
82
|
|
|
82
|
-
const
|
|
83
|
-
|
|
84
|
-
? options.className
|
|
85
|
-
: options.bar
|
|
86
|
-
? 'ol-scale-bar'
|
|
87
|
-
: 'ol-scale-line';
|
|
83
|
+
const element = document.createElement('div');
|
|
84
|
+
element.style.pointerEvents = 'none';
|
|
88
85
|
|
|
89
86
|
super({
|
|
90
|
-
element:
|
|
87
|
+
element: element,
|
|
91
88
|
render: options.render,
|
|
92
89
|
target: options.target,
|
|
93
90
|
});
|
|
@@ -107,6 +104,13 @@ class ScaleLine extends Control {
|
|
|
107
104
|
*/
|
|
108
105
|
this.un;
|
|
109
106
|
|
|
107
|
+
const className =
|
|
108
|
+
options.className !== undefined
|
|
109
|
+
? options.className
|
|
110
|
+
: options.bar
|
|
111
|
+
? 'ol-scale-bar'
|
|
112
|
+
: 'ol-scale-line';
|
|
113
|
+
|
|
110
114
|
/**
|
|
111
115
|
* @private
|
|
112
116
|
* @type {HTMLElement}
|
|
@@ -334,12 +338,9 @@ class ScaleLine extends Control {
|
|
|
334
338
|
previousDecimalCount = decimalCount;
|
|
335
339
|
++i;
|
|
336
340
|
}
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
} else {
|
|
341
|
-
html = count.toFixed(decimalCount < 0 ? -decimalCount : 0) + ' ' + suffix;
|
|
342
|
-
}
|
|
341
|
+
const html = this.scaleBar_
|
|
342
|
+
? this.createScaleBar(width, count, suffix)
|
|
343
|
+
: count.toFixed(decimalCount < 0 ? -decimalCount : 0) + ' ' + suffix;
|
|
343
344
|
|
|
344
345
|
if (this.renderedHTML_ != html) {
|
|
345
346
|
this.innerElement_.innerHTML = html;
|
|
@@ -365,87 +366,54 @@ class ScaleLine extends Control {
|
|
|
365
366
|
* @return {string} The stringified HTML of the scalebar.
|
|
366
367
|
*/
|
|
367
368
|
createScaleBar(width, scale, suffix) {
|
|
369
|
+
const resolutionScale = this.getScaleForResolution();
|
|
368
370
|
const mapScale =
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
371
|
+
resolutionScale < 1
|
|
372
|
+
? Math.round(1 / resolutionScale).toLocaleString() + ' : 1'
|
|
373
|
+
: '1 : ' + Math.round(resolutionScale).toLocaleString();
|
|
374
|
+
const steps = this.scaleBarSteps_;
|
|
375
|
+
const stepWidth = width / steps;
|
|
376
|
+
const scaleSteps = [this.createMarker('absolute')];
|
|
377
|
+
for (let i = 0; i < steps; ++i) {
|
|
378
|
+
const cls =
|
|
379
|
+
i % 2 === 0 ? 'ol-scale-singlebar-odd' : 'ol-scale-singlebar-even';
|
|
378
380
|
scaleSteps.push(
|
|
379
381
|
'<div>' +
|
|
380
382
|
'<div ' +
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
'" ' +
|
|
384
|
-
'style=' +
|
|
385
|
-
'"width: ' +
|
|
386
|
-
stepWidth +
|
|
387
|
-
'px;"' +
|
|
383
|
+
`class="ol-scale-singlebar ${cls}" ` +
|
|
384
|
+
`style="width: ${stepWidth}px;"` +
|
|
388
385
|
'>' +
|
|
389
386
|
'</div>' +
|
|
390
|
-
this.createMarker('relative'
|
|
391
|
-
|
|
392
|
-
(i % 2 === 0 ||
|
|
387
|
+
this.createMarker('relative') +
|
|
388
|
+
// render text every second step, except when only 2 steps
|
|
389
|
+
(i % 2 === 0 || steps === 2
|
|
393
390
|
? this.createStepText(i, width, false, scale, suffix)
|
|
394
391
|
: '') +
|
|
395
392
|
'</div>'
|
|
396
393
|
);
|
|
397
|
-
if (i === this.scaleBarSteps_ - 1) {
|
|
398
|
-
{
|
|
399
|
-
/*render text at the end */
|
|
400
|
-
}
|
|
401
|
-
scaleSteps.push(this.createStepText(i + 1, width, true, scale, suffix));
|
|
402
|
-
}
|
|
403
|
-
// switch style of steps
|
|
404
|
-
backgroundColor =
|
|
405
|
-
backgroundColor === 'ol-scale-singlebar-odd'
|
|
406
|
-
? 'ol-scale-singlebar-even'
|
|
407
|
-
: 'ol-scale-singlebar-odd';
|
|
408
394
|
}
|
|
395
|
+
// render text at the end
|
|
396
|
+
scaleSteps.push(this.createStepText(steps, width, true, scale, suffix));
|
|
409
397
|
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
scaleBarText =
|
|
413
|
-
'<div ' +
|
|
414
|
-
'class="ol-scale-text" ' +
|
|
415
|
-
'style="width: ' +
|
|
416
|
-
width +
|
|
417
|
-
'px;">' +
|
|
398
|
+
const scaleBarText = this.scaleBarText_
|
|
399
|
+
? `<div class="ol-scale-text" style="width: ${width}px;">` +
|
|
418
400
|
mapScale +
|
|
419
|
-
'</div>'
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
}
|
|
423
|
-
const container =
|
|
424
|
-
'<div ' +
|
|
425
|
-
'style="display: flex;">' +
|
|
426
|
-
scaleBarText +
|
|
427
|
-
scaleSteps.join('') +
|
|
428
|
-
'</div>';
|
|
429
|
-
return container;
|
|
401
|
+
'</div>'
|
|
402
|
+
: '';
|
|
403
|
+
return scaleBarText + scaleSteps.join('');
|
|
430
404
|
}
|
|
431
405
|
|
|
432
406
|
/**
|
|
433
407
|
* Creates a marker at given position
|
|
434
|
-
* @param {
|
|
435
|
-
* @param {number} i The iterator
|
|
408
|
+
* @param {'absolute'|'relative'} position The position, absolute or relative
|
|
436
409
|
* @return {string} The stringified div containing the marker
|
|
437
410
|
*/
|
|
438
|
-
createMarker(position
|
|
411
|
+
createMarker(position) {
|
|
439
412
|
const top = position === 'absolute' ? 3 : -10;
|
|
440
413
|
return (
|
|
441
414
|
'<div ' +
|
|
442
415
|
'class="ol-scale-step-marker" ' +
|
|
443
|
-
|
|
444
|
-
position +
|
|
445
|
-
';' +
|
|
446
|
-
'top: ' +
|
|
447
|
-
top +
|
|
448
|
-
'px;"' +
|
|
416
|
+
`style="position: ${position}; top: ${top}px;"` +
|
|
449
417
|
'></div>'
|
|
450
418
|
);
|
|
451
419
|
}
|
|
@@ -469,19 +437,11 @@ class ScaleLine extends Control {
|
|
|
469
437
|
'<div ' +
|
|
470
438
|
'class="ol-scale-step-text" ' +
|
|
471
439
|
'style="' +
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
'
|
|
476
|
-
|
|
477
|
-
'; ' +
|
|
478
|
-
'min-width: ' +
|
|
479
|
-
minWidth +
|
|
480
|
-
'px;' +
|
|
481
|
-
'left: ' +
|
|
482
|
-
(isLast ? width + 'px' : 'unset') +
|
|
483
|
-
';"' +
|
|
484
|
-
'>' +
|
|
440
|
+
`margin-left: ${margin}px;` +
|
|
441
|
+
`text-align: ${i === 0 ? 'left' : 'center'};` +
|
|
442
|
+
`min-width: ${minWidth}px;` +
|
|
443
|
+
`left: ${isLast ? width + 'px' : 'unset'};` +
|
|
444
|
+
'">' +
|
|
485
445
|
lengthString +
|
|
486
446
|
'</div>'
|
|
487
447
|
);
|
|
@@ -500,7 +460,7 @@ class ScaleLine extends Control {
|
|
|
500
460
|
);
|
|
501
461
|
const dpi = this.dpi_ || DEFAULT_DPI;
|
|
502
462
|
const inchesPerMeter = 1000 / 25.4;
|
|
503
|
-
return
|
|
463
|
+
return resolution * inchesPerMeter * dpi;
|
|
504
464
|
}
|
|
505
465
|
|
|
506
466
|
/**
|
package/format/KML.js
CHANGED
|
@@ -1023,7 +1023,7 @@ function createFeatureStyleFunction(
|
|
|
1023
1023
|
name = /** @type {string} */ (feature.get('name'));
|
|
1024
1024
|
drawName = drawName && !!name;
|
|
1025
1025
|
// convert any html character codes
|
|
1026
|
-
if (drawName &&
|
|
1026
|
+
if (drawName && /&[^&]+;/.test(name)) {
|
|
1027
1027
|
if (!TEXTAREA) {
|
|
1028
1028
|
TEXTAREA = document.createElement('textarea');
|
|
1029
1029
|
}
|
|
@@ -1274,17 +1274,17 @@ function iconStyleParser(node, objectStack) {
|
|
|
1274
1274
|
anchorXUnits = hotSpot.xunits;
|
|
1275
1275
|
anchorYUnits = hotSpot.yunits;
|
|
1276
1276
|
anchorOrigin = hotSpot.origin;
|
|
1277
|
-
} else if (/^
|
|
1277
|
+
} else if (/^https?:\/\/maps\.(?:google|gstatic)\.com\//.test(src)) {
|
|
1278
1278
|
// Google hotspots from https://kml4earth.appspot.com/icons.html#notes
|
|
1279
|
-
if (
|
|
1279
|
+
if (src.includes('pushpin')) {
|
|
1280
1280
|
anchor = DEFAULT_IMAGE_STYLE_ANCHOR;
|
|
1281
1281
|
anchorXUnits = DEFAULT_IMAGE_STYLE_ANCHOR_X_UNITS;
|
|
1282
1282
|
anchorYUnits = DEFAULT_IMAGE_STYLE_ANCHOR_Y_UNITS;
|
|
1283
|
-
} else if (
|
|
1283
|
+
} else if (src.includes('arrow-reverse')) {
|
|
1284
1284
|
anchor = [54, 42];
|
|
1285
1285
|
anchorXUnits = DEFAULT_IMAGE_STYLE_ANCHOR_X_UNITS;
|
|
1286
1286
|
anchorYUnits = DEFAULT_IMAGE_STYLE_ANCHOR_Y_UNITS;
|
|
1287
|
-
} else if (
|
|
1287
|
+
} else if (src.includes('paddle')) {
|
|
1288
1288
|
anchor = [32, 1];
|
|
1289
1289
|
anchorXUnits = DEFAULT_IMAGE_STYLE_ANCHOR_X_UNITS;
|
|
1290
1290
|
anchorYUnits = DEFAULT_IMAGE_STYLE_ANCHOR_Y_UNITS;
|
package/ol.css
CHANGED
|
@@ -41,20 +41,16 @@
|
|
|
41
41
|
transition: all 0.25s;
|
|
42
42
|
}
|
|
43
43
|
|
|
44
|
-
.ol-scale-singlebar-even {
|
|
45
|
-
background-color: var(--ol-subtle-foreground-color);
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
.ol-scale-singlebar-odd {
|
|
49
|
-
background-color: var(--ol-background-color);
|
|
50
|
-
}
|
|
51
|
-
|
|
52
44
|
.ol-scale-bar {
|
|
53
45
|
position: absolute;
|
|
54
46
|
bottom: 8px;
|
|
55
47
|
left: 8px;
|
|
56
48
|
}
|
|
57
49
|
|
|
50
|
+
.ol-scale-bar-inner {
|
|
51
|
+
display: flex;
|
|
52
|
+
}
|
|
53
|
+
|
|
58
54
|
.ol-scale-step-marker {
|
|
59
55
|
width: 1px;
|
|
60
56
|
height: 15px;
|
|
@@ -89,6 +85,14 @@
|
|
|
89
85
|
border: 1px solid var(--ol-foreground-color);
|
|
90
86
|
}
|
|
91
87
|
|
|
88
|
+
.ol-scale-singlebar-even {
|
|
89
|
+
background-color: var(--ol-subtle-foreground-color);
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
.ol-scale-singlebar-odd {
|
|
93
|
+
background-color: var(--ol-background-color);
|
|
94
|
+
}
|
|
95
|
+
|
|
92
96
|
.ol-unsupported {
|
|
93
97
|
display: none;
|
|
94
98
|
}
|