@operato/scene-openlayers 7.0.0-rc.1 → 7.0.0-rc.3
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.md +9 -0
- package/dist/ol-marker.js +3 -2
- package/dist/ol-marker.js.map +1 -1
- package/dist/openlayers.js +2 -1
- package/dist/openlayers.js.map +1 -1
- package/package.json +3 -3
- package/tsconfig.tsbuildinfo +1 -1
package/CHANGELOG.md
CHANGED
@@ -3,6 +3,15 @@
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
5
5
|
|
6
|
+
## [7.0.0-rc.3](https://github.com/things-scene/operato-scene/compare/v7.0.0-rc.2...v7.0.0-rc.3) (2024-06-28)
|
7
|
+
|
8
|
+
|
9
|
+
### :bug: Bug Fix
|
10
|
+
|
11
|
+
* update dependencies version ([8629d93](https://github.com/things-scene/operato-scene/commit/8629d9375c84bc7b44c8a3604106345d87c21db5))
|
12
|
+
|
13
|
+
|
14
|
+
|
6
15
|
## [7.0.0-rc.1](https://github.com/things-scene/operato-scene/compare/v7.0.0-rc.0...v7.0.0-rc.1) (2024-06-21)
|
7
16
|
|
8
17
|
|
package/dist/ol-marker.js
CHANGED
@@ -54,7 +54,7 @@ const NATURE = {
|
|
54
54
|
help: 'scene/component/ol-marker'
|
55
55
|
};
|
56
56
|
const MARKER_PATH = 'M10 0 C14.42 0 18 3.58 18 8 C18 12.42 14.42 16 10 16 C5.58 16 2 12.42 2 8 C2 3.58 5.58 0 10 0 Z';
|
57
|
-
|
57
|
+
class OpenLayersMarker extends RectPath(Shape) {
|
58
58
|
constructor() {
|
59
59
|
super(...arguments);
|
60
60
|
this._map = null;
|
@@ -225,10 +225,11 @@ export default class OpenLayersMarker extends RectPath(Shape) {
|
|
225
225
|
}
|
226
226
|
OpenLayersMarker.markerStyle = new Style({
|
227
227
|
image: new Icon({
|
228
|
-
anchor: [0.5, 1],
|
228
|
+
anchor: [0.5, 1], // 이미지 중심 아래쪽을 지도 위치에 맞춤
|
229
229
|
src: 'data:image/svg+xml;charset=utf-8,' +
|
230
230
|
encodeURIComponent('<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">' + MARKER_PATH + '</svg>')
|
231
231
|
})
|
232
232
|
});
|
233
|
+
export default OpenLayersMarker;
|
233
234
|
Component.register('ol-marker', OpenLayersMarker);
|
234
235
|
//# sourceMappingURL=ol-marker.js.map
|
package/dist/ol-marker.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"ol-marker.js","sourceRoot":"","sources":["../src/ol-marker.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport {\n Component,\n InfoWindow as SceneInfoWindow,\n Properties,\n RectPath,\n Shape,\n ComponentNature\n} from '@hatiolab/things-scene'\nimport Openlayers from './openlayers'\n\nimport 'ol/ol.css'\nimport { Map, MapBrowserEvent, Overlay, View } from 'ol'\nimport { fromLonLat } from 'ol/proj'\nimport { Tile as TileLayer, Vector as VectorLayer } from 'ol/layer'\nimport { OSM, Vector as VectorSource } from 'ol/source'\nimport { Icon, Style } from 'ol/style'\nimport { Feature } from 'ol'\nimport { Geometry, Point } from 'ol/geom'\n\nconst NATURE: ComponentNature = {\n mutable: false,\n resizable: true,\n rotatable: true,\n properties: [\n {\n type: 'id-input',\n label: 'target-map',\n name: 'targetMap',\n property: {\n component: 'openlayers'\n }\n },\n {\n type: 'number',\n label: 'latitude',\n name: 'lat',\n property: {\n step: 0.000001,\n max: 90,\n min: -90\n }\n },\n {\n type: 'number',\n label: 'longitude',\n name: 'lng',\n property: {\n step: 0.000001,\n max: 180,\n min: -180\n }\n },\n {\n type: 'select',\n label: 'style',\n name: 'style',\n property: {\n options: ['circle', 'marker']\n }\n }\n ],\n 'value-property': 'latlng',\n help: 'scene/component/ol-marker'\n}\n\nconst MARKER_PATH = 'M10 0 C14.42 0 18 3.58 18 8 C18 12.42 14.42 16 10 16 C5.58 16 2 12.42 2 8 C2 3.58 5.58 0 10 0 Z'\n\nexport default class OpenLayersMarker extends RectPath(Shape) {\n _infoWindow: any\n _marker: any\n _map: Map | null = null\n\n static markerStyle: Style = new Style({\n image: new Icon({\n anchor: [0.5, 1], // 이미지 중심 아래쪽을 지도 위치에 맞춤\n src:\n 'data:image/svg+xml;charset=utf-8,' +\n encodeURIComponent('<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\">' + MARKER_PATH + '</svg>')\n })\n })\n\n dispose() {\n this.detachFromOldOpenlayers(this.targetMap)\n\n this.marker = null\n delete this._infoWindow\n\n super.dispose()\n }\n\n ready() {\n super.ready()\n\n if (this.isTemplate()) {\n return\n }\n\n this.attachToNewOpenlayers(this.targetMap)\n }\n\n get map() {\n return this._map\n }\n\n get infoWindow() {\n if (!this._infoWindow) {\n this._infoWindow = new Overlay({\n element: document.getElementById('info')!,\n positioning: 'bottom-center',\n stopEvent: false\n })\n }\n\n return this._infoWindow\n }\n\n findInfoWindow(type: string) {\n var eventSetting = (this.state.event && this.state.event[type]) || {}\n\n var infoWindow =\n /* event spec v1.0 */ eventSetting.infoWindow ||\n /* event spec v1.1 */ (eventSetting.action == 'infoWindow' && eventSetting.target)\n\n if (infoWindow) {\n return this.root.findById(infoWindow)\n }\n }\n\n setInfoContent(sceneInfoWindow: SceneInfoWindow) {\n var tpl = Component.template(sceneInfoWindow.model.frontSideTemplate)\n var content = `<style>${sceneInfoWindow.model.style}</style>` + tpl(this)\n\n this.infoWindow.setContent(content)\n }\n\n openInfoWindow(iw: SceneInfoWindow) {\n this.setInfoContent(iw)\n\n if (!this.map) return\n\n this.infoWindow.open(this.map, this.marker)\n }\n\n onmarkerclick(e: MapBrowserEvent<UIEvent>) {\n var iw = this.findInfoWindow('tap')\n iw && this.openInfoWindow(iw)\n\n // this.trigger('click', e.ya) ??????\n }\n\n onmarkermouseover(e: MapBrowserEvent<UIEvent>) {\n var iw = this.findInfoWindow('hover')\n iw && this.openInfoWindow(iw)\n }\n\n onmarkermouseout(e: MapBrowserEvent<UIEvent>) {\n var iw = this.findInfoWindow('hover')\n iw && this.infoWindow.close()\n }\n\n set marker(marker) {\n this._marker = marker\n }\n\n get marker() {\n return this._marker\n }\n\n render(context: CanvasRenderingContext2D) {\n var { top, left, width, height } = this.state\n\n context.translate(left, top)\n\n // 마커 모양 그리기\n context.beginPath()\n\n context.moveTo(width / 2, height * 0.9)\n context.bezierCurveTo(width / 2.3, height * 0.6, 0, height / 2, 0, height / 4)\n\n context.ellipse(width / 2, height / 4, width / 2, height / 4, 0, Math.PI * 1, Math.PI * 0)\n\n context.bezierCurveTo(width, height / 2, width / 1.7, height * 0.6, width / 2, height * 0.9)\n context.closePath()\n\n context.translate(-left, -top)\n }\n\n detachFromOldOpenlayers(map: Openlayers) {\n if (this._marker && map) {\n map.vectorSource?.removeFeature(this._marker)\n this._marker = null\n }\n }\n\n attachToNewOpenlayers(map: Openlayers) {\n if (!this._marker && map) {\n let {\n lat,\n lng,\n style = 'circle',\n fillStyle: fillColor,\n alpha: fillOpacity = 1,\n strokeStyle: strokeColor,\n lineWidth: strokeWeight\n } = this.state\n\n const marker = new Feature<Geometry>({\n type: style,\n geometry: new Point(fromLonLat([lng || 0, lat || 0]))\n })\n\n map.vectorSource?.addFeatures([marker])\n\n if (marker) {\n //@ts-ignore\n marker.on('click', this.onmarkerclick.bind(this))\n //@ts-ignore\n marker.on('mouseover', this.onmarkermouseover.bind(this))\n //@ts-ignore\n marker.on('mouseout', this.onmarkermouseout.bind(this))\n }\n\n this._marker = marker\n }\n }\n\n onchangeTargetMap(after: string, before: string) {\n const oldMap = this.root.findById(before) as Openlayers\n const newMap = this.root.findById(after) as Openlayers\n\n this.detachFromOldOpenlayers(oldMap)\n this.attachToNewOpenlayers(newMap)\n }\n\n get targetMap() {\n const { targetMap } = this.state\n return this.root.findById(targetMap) as Openlayers\n }\n\n onchange(after: Properties, before: Properties) {\n if ('targetMap' in after) {\n this.onchangeTargetMap(after.targetMap, before.targetMap)\n }\n\n if ('lat' in after || 'lng' in after) {\n var { lat, lng } = this.state\n this.latlng = {\n lat,\n lng\n }\n }\n\n if (('fillStyle' in after || 'strokeStyle' in after || 'lineWidth' in after) && this.marker) {\n let {\n fillStyle: fillColor,\n alpha: fillOpacity = 1,\n strokeStyle: strokeColor,\n lineWidth: strokeWeight\n } = this.state\n\n this.marker.setIcon({\n path: MARKER_PATH,\n fillColor,\n fillOpacity,\n strokeColor,\n strokeWeight\n })\n }\n\n if ('style' in after) {\n const { targetMap } = this.state\n this.onchangeTargetMap(targetMap, targetMap)\n }\n\n super.onchange && super.onchange(after, before)\n }\n\n get latlng() {\n return {\n lat: this.getState('lat'),\n lng: this.getState('lng')\n }\n }\n\n set latlng(latlng) {\n var { lat, lng } = latlng\n\n if (this.marker) {\n const geometry = this.marker.getGeometry()\n if (geometry instanceof Point) {\n geometry.setCoordinates(fromLonLat([lng, lat]))\n }\n }\n\n this.setState({\n lat,\n lng\n })\n }\n\n get nature() {\n return NATURE\n }\n}\n\nComponent.register('ol-marker', OpenLayersMarker)\n"]}
|
1
|
+
{"version":3,"file":"ol-marker.js","sourceRoot":"","sources":["../src/ol-marker.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport {\n Component,\n InfoWindow as SceneInfoWindow,\n Properties,\n RectPath,\n Shape,\n ComponentNature\n} from '@hatiolab/things-scene'\nimport Openlayers from './openlayers'\n\nimport 'ol/ol.css'\nimport { Map, MapBrowserEvent, Overlay, View } from 'ol'\nimport { fromLonLat } from 'ol/proj'\nimport { Tile as TileLayer, Vector as VectorLayer } from 'ol/layer'\nimport { OSM, Vector as VectorSource } from 'ol/source'\nimport { Icon, Style } from 'ol/style'\nimport { Feature } from 'ol'\nimport { Geometry, Point } from 'ol/geom'\n\nconst NATURE: ComponentNature = {\n mutable: false,\n resizable: true,\n rotatable: true,\n properties: [\n {\n type: 'id-input',\n label: 'target-map',\n name: 'targetMap',\n property: {\n component: 'openlayers'\n }\n },\n {\n type: 'number',\n label: 'latitude',\n name: 'lat',\n property: {\n step: 0.000001,\n max: 90,\n min: -90\n }\n },\n {\n type: 'number',\n label: 'longitude',\n name: 'lng',\n property: {\n step: 0.000001,\n max: 180,\n min: -180\n }\n },\n {\n type: 'select',\n label: 'style',\n name: 'style',\n property: {\n options: ['circle', 'marker']\n }\n }\n ],\n 'value-property': 'latlng',\n help: 'scene/component/ol-marker'\n}\n\nconst MARKER_PATH = 'M10 0 C14.42 0 18 3.58 18 8 C18 12.42 14.42 16 10 16 C5.58 16 2 12.42 2 8 C2 3.58 5.58 0 10 0 Z'\n\nexport default class OpenLayersMarker extends RectPath(Shape) {\n _infoWindow: any\n _marker: any\n _map: Map | null = null\n\n static markerStyle: Style = new Style({\n image: new Icon({\n anchor: [0.5, 1], // 이미지 중심 아래쪽을 지도 위치에 맞춤\n src:\n 'data:image/svg+xml;charset=utf-8,' +\n encodeURIComponent('<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\">' + MARKER_PATH + '</svg>')\n })\n })\n\n dispose() {\n this.detachFromOldOpenlayers(this.targetMap)\n\n this.marker = null\n delete this._infoWindow\n\n super.dispose()\n }\n\n ready() {\n super.ready()\n\n if (this.isTemplate()) {\n return\n }\n\n this.attachToNewOpenlayers(this.targetMap)\n }\n\n get map() {\n return this._map\n }\n\n get infoWindow() {\n if (!this._infoWindow) {\n this._infoWindow = new Overlay({\n element: document.getElementById('info')!,\n positioning: 'bottom-center',\n stopEvent: false\n })\n }\n\n return this._infoWindow\n }\n\n findInfoWindow(type: string) {\n var eventSetting = (this.state.event && this.state.event[type]) || {}\n\n var infoWindow =\n /* event spec v1.0 */ eventSetting.infoWindow ||\n /* event spec v1.1 */ (eventSetting.action == 'infoWindow' && eventSetting.target)\n\n if (infoWindow) {\n return this.root.findById(infoWindow)\n }\n }\n\n setInfoContent(sceneInfoWindow: SceneInfoWindow) {\n var tpl = Component.template(sceneInfoWindow.model.frontSideTemplate)\n var content = `<style>${sceneInfoWindow.model.style}</style>` + tpl(this)\n\n this.infoWindow.setContent(content)\n }\n\n openInfoWindow(iw: SceneInfoWindow) {\n this.setInfoContent(iw)\n\n if (!this.map) return\n\n this.infoWindow.open(this.map, this.marker)\n }\n\n onmarkerclick(e: MapBrowserEvent<UIEvent>) {\n var iw = this.findInfoWindow('tap')\n iw && this.openInfoWindow(iw)\n\n // this.trigger('click', e.ya) ??????\n }\n\n onmarkermouseover(e: MapBrowserEvent<UIEvent>) {\n var iw = this.findInfoWindow('hover')\n iw && this.openInfoWindow(iw)\n }\n\n onmarkermouseout(e: MapBrowserEvent<UIEvent>) {\n var iw = this.findInfoWindow('hover')\n iw && this.infoWindow.close()\n }\n\n set marker(marker) {\n this._marker = marker\n }\n\n get marker() {\n return this._marker\n }\n\n render(context: CanvasRenderingContext2D) {\n var { top, left, width, height } = this.state\n\n context.translate(left, top)\n\n // 마커 모양 그리기\n context.beginPath()\n\n context.moveTo(width / 2, height * 0.9)\n context.bezierCurveTo(width / 2.3, height * 0.6, 0, height / 2, 0, height / 4)\n\n context.ellipse(width / 2, height / 4, width / 2, height / 4, 0, Math.PI * 1, Math.PI * 0)\n\n context.bezierCurveTo(width, height / 2, width / 1.7, height * 0.6, width / 2, height * 0.9)\n context.closePath()\n\n context.translate(-left, -top)\n }\n\n detachFromOldOpenlayers(map: Openlayers) {\n if (this._marker && map) {\n map.vectorSource?.removeFeature(this._marker)\n this._marker = null\n }\n }\n\n attachToNewOpenlayers(map: Openlayers) {\n if (!this._marker && map) {\n let {\n lat,\n lng,\n style = 'circle',\n fillStyle: fillColor,\n alpha: fillOpacity = 1,\n strokeStyle: strokeColor,\n lineWidth: strokeWeight\n } = this.state\n\n const marker = new Feature<Geometry>({\n type: style,\n geometry: new Point(fromLonLat([lng || 0, lat || 0]))\n })\n\n map.vectorSource?.addFeatures([marker])\n\n if (marker) {\n //@ts-ignore\n marker.on('click', this.onmarkerclick.bind(this))\n //@ts-ignore\n marker.on('mouseover', this.onmarkermouseover.bind(this))\n //@ts-ignore\n marker.on('mouseout', this.onmarkermouseout.bind(this))\n }\n\n this._marker = marker\n }\n }\n\n onchangeTargetMap(after: string, before: string) {\n const oldMap = this.root.findById(before) as Openlayers\n const newMap = this.root.findById(after) as Openlayers\n\n this.detachFromOldOpenlayers(oldMap)\n this.attachToNewOpenlayers(newMap)\n }\n\n get targetMap() {\n const { targetMap } = this.state\n return this.root.findById(targetMap) as Openlayers\n }\n\n onchange(after: Properties, before: Properties) {\n if ('targetMap' in after) {\n this.onchangeTargetMap(after.targetMap, before.targetMap)\n }\n\n if ('lat' in after || 'lng' in after) {\n var { lat, lng } = this.state\n this.latlng = {\n lat,\n lng\n }\n }\n\n if (('fillStyle' in after || 'strokeStyle' in after || 'lineWidth' in after) && this.marker) {\n let {\n fillStyle: fillColor,\n alpha: fillOpacity = 1,\n strokeStyle: strokeColor,\n lineWidth: strokeWeight\n } = this.state\n\n this.marker.setIcon({\n path: MARKER_PATH,\n fillColor,\n fillOpacity,\n strokeColor,\n strokeWeight\n })\n }\n\n if ('style' in after) {\n const { targetMap } = this.state\n this.onchangeTargetMap(targetMap, targetMap)\n }\n\n super.onchange && super.onchange(after, before)\n }\n\n get latlng() {\n return {\n lat: this.getState('lat'),\n lng: this.getState('lng')\n }\n }\n\n set latlng(latlng) {\n var { lat, lng } = latlng\n\n if (this.marker) {\n const geometry = this.marker.getGeometry()\n if (geometry instanceof Point) {\n geometry.setCoordinates(fromLonLat([lng, lat]))\n }\n }\n\n this.setState({\n lat,\n lng\n })\n }\n\n get nature() {\n return NATURE\n }\n}\n\nComponent.register('ol-marker', OpenLayersMarker)\n"]}
|
package/dist/openlayers.js
CHANGED
@@ -61,7 +61,7 @@ function getGlobalScale(component) {
|
|
61
61
|
}
|
62
62
|
return scale;
|
63
63
|
}
|
64
|
-
|
64
|
+
class Openlayers extends HTMLOverlayContainer {
|
65
65
|
constructor() {
|
66
66
|
super(...arguments);
|
67
67
|
this._map = null;
|
@@ -228,5 +228,6 @@ Openlayers.markerStyle = new Style({
|
|
228
228
|
anchor: [0.5, 1]
|
229
229
|
})
|
230
230
|
});
|
231
|
+
export default Openlayers;
|
231
232
|
Component.register('openlayers', Openlayers);
|
232
233
|
//# sourceMappingURL=openlayers.js.map
|
package/dist/openlayers.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"openlayers.js","sourceRoot":"","sources":["../src/openlayers.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\n// @ts-ignore\nimport OpenLayersStyle from '!!text-loader!ol/ol.css'\n\nimport { Feature, Map, View } from 'ol'\nimport { Circle as CircleStyle, Fill, Icon, Stroke, Style } from 'ol/style.js'\nimport { Tile as TileLayer, Vector as VectorLayer } from 'ol/layer'\nimport { Vector as VectorSource, OSM } from 'ol/source'\nimport { fromLonLat } from 'ol/proj'\nimport { Geometry, Point } from 'ol/geom'\n\nimport { Component, HTMLOverlayContainer, Properties, ComponentNature, error } from '@hatiolab/things-scene'\n\nconst MARKER_PATH =\n 'M 0,0 C -2,-20 -10,-22 -10,-30 A 10,10 0 1,1 10,-30 C 10,-22 2,-20 0,0 z M -2,-30 a 2,2 0 1,1 4,0 2,2 0 1,1 -4,0'\n\nconst NATURE: ComponentNature = {\n mutable: false,\n resizable: true,\n rotatable: true,\n properties: [\n {\n type: 'number',\n label: 'latitude',\n name: 'lat',\n property: {\n step: 0.000001,\n max: 90,\n min: -90\n }\n },\n {\n type: 'number',\n label: 'longitude',\n name: 'lng',\n property: {\n step: 0.000001,\n min: -180,\n max: 180\n }\n },\n {\n type: 'number',\n label: 'zoom',\n name: 'zoom'\n },\n {\n type: 'boolean',\n label: 'show-marker',\n name: 'showMarker'\n }\n ],\n 'value-property': 'latlng',\n help: 'scene/component/openlayers'\n}\n\nfunction getGlobalScale(component: Component) {\n var scale = { x: 1, y: 1 }\n var parent = component\n\n while (parent) {\n let { x, y } = parent.get('scale') || { x: 1, y: 1 }\n scale.x *= x || 1\n scale.y *= y || 1\n\n parent = parent.parent\n }\n return scale\n}\n\nexport default class Openlayers extends HTMLOverlayContainer {\n static markerStyle: Style = new Style({\n image: new Icon({\n src:\n 'data:image/svg+xml;charset=utf-8,' +\n encodeURIComponent('<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\">' + MARKER_PATH + '</svg>'),\n anchor: [0.5, 1]\n })\n })\n\n _anchor?: HTMLDivElement\n _map: Map | null = null\n _listenTo?: Component\n _listener?: Function\n _vectorSource?: VectorSource<Feature>\n _marker: Feature | null = null\n\n get eventMap() {\n return {\n 'model-layer': {\n '(self)': {\n change: (after: any) => {\n after.scale && this.rescale()\n }\n }\n }\n }\n }\n\n /*\n * 부모의 스케일의 역으로 transform해서, scale을 1로 맞추어준다.\n */\n rescale() {\n var anchor = this._anchor\n if (!anchor) {\n return\n }\n\n var scale = getGlobalScale(this)\n\n var sx = 1 / scale.x\n var sy = 1 / scale.y\n\n var transform = `scale(${sx}, ${sy})`\n\n anchor!.style.transform = transform\n anchor!.style.transformOrigin = '0px 0px'\n\n var { width, height } = this.state\n anchor.style.width = width * scale.x + 'px'\n anchor.style.height = height * scale.y + 'px'\n }\n\n createElement() {\n super.createElement()\n this._anchor = document.createElement('div')\n\n const style = document.createElement('style')\n style.textContent = `\n ${OpenLayersStyle}\n `\n\n this.element.appendChild(style)\n this.element.appendChild(this._anchor)\n\n const { lat, lng, zoom, showMarker } = this.state\n\n // 지도의 중심 좌표\n const center = fromLonLat([lng || 126.9783882, lat || 37.5666103])\n\n // 타일 레이어 생성 (배경 지도)\n const tileLayer = new TileLayer({\n source: new OSM({\n attributions: ''\n })\n })\n\n // 벡터 레이어 생성\n const styles: { [name: string]: Style } = {\n route: new Style({\n stroke: new Stroke({\n width: 6,\n color: [237, 212, 0, 0.8]\n })\n }),\n marker: Openlayers.markerStyle,\n circle: new Style({\n image: new CircleStyle({\n radius: 7,\n stroke: new Stroke({\n color: 'black',\n width: 2\n })\n })\n })\n }\n\n const vectorSource = new VectorSource()\n const vectorLayer = new VectorLayer({\n source: vectorSource,\n style: function (feature) {\n return styles[feature.get('type')]\n }\n })\n\n // 지도 생성\n const map = new Map({\n target: this._anchor,\n layers: [tileLayer, vectorLayer],\n view: new View({\n center,\n zoom\n })\n })\n\n this._map = map\n this._vectorSource = vectorSource\n\n showMarker && this.refreshMarker()\n\n this.rescale()\n }\n\n get tagName() {\n return 'div'\n }\n\n get map() {\n return this._map\n }\n\n dispose() {\n super.dispose()\n\n delete this._anchor\n }\n\n setElementProperties(div: HTMLDivElement) {\n this.rescale()\n }\n\n refreshMarker() {\n const { showMarker, lat, lng } = this.state\n\n if (this._marker) {\n this.vectorSource?.removeFeature(this._marker)\n this._marker = null\n }\n\n if (showMarker) {\n // 지도의 중심 좌표\n const center = fromLonLat([lng || 126.9783882, lat || 37.5666103])\n\n this._marker = new Feature({\n type: 'circle',\n geometry: new Point(center)\n })\n\n this.vectorSource?.addFeatures([this._marker])\n }\n }\n\n onchange(after: Properties, before: Properties) {\n if ('zoom' in after) {\n const view = this.map?.getView()\n view?.setZoom(after.zoom)\n }\n\n if ('lat' in after || 'lng' in after) {\n let { lat, lng } = this.state\n const view = this.map?.getView()\n view?.setCenter(fromLonLat([lng, lat]))\n\n if (this._marker) {\n const geometry = this._marker.getGeometry()\n if (geometry instanceof Point) {\n geometry.setCoordinates(fromLonLat([lng, lat]))\n }\n }\n }\n\n if ('showMarker' in after) {\n this.refreshMarker()\n }\n\n super.onchange(after, before)\n\n this.rescale()\n }\n\n get latlng() {\n const { lat, lng } = this.state\n return { lat, lng }\n }\n\n set latlng(latlng) {\n this.setState(latlng)\n }\n\n get vectorSource() {\n return this._vectorSource\n }\n\n get nature() {\n return NATURE\n }\n}\n\nComponent.register('openlayers', Openlayers)\n"]}
|
1
|
+
{"version":3,"file":"openlayers.js","sourceRoot":"","sources":["../src/openlayers.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,aAAa;AACb,OAAO,eAAe,MAAM,yBAAyB,CAAA;AAErD,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,IAAI,CAAA;AACvC,OAAO,EAAE,MAAM,IAAI,WAAW,EAAQ,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,aAAa,CAAA;AAC9E,OAAO,EAAE,IAAI,IAAI,SAAS,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,UAAU,CAAA;AACnE,OAAO,EAAE,MAAM,IAAI,YAAY,EAAE,GAAG,EAAE,MAAM,WAAW,CAAA;AACvD,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AACpC,OAAO,EAAY,KAAK,EAAE,MAAM,SAAS,CAAA;AAEzC,OAAO,EAAE,SAAS,EAAE,oBAAoB,EAAsC,MAAM,wBAAwB,CAAA;AAE5G,MAAM,WAAW,GACf,kHAAkH,CAAA;AAEpH,MAAM,MAAM,GAAoB;IAC9B,OAAO,EAAE,KAAK;IACd,SAAS,EAAE,IAAI;IACf,SAAS,EAAE,IAAI;IACf,UAAU,EAAE;QACV;YACE,IAAI,EAAE,QAAQ;YACd,KAAK,EAAE,UAAU;YACjB,IAAI,EAAE,KAAK;YACX,QAAQ,EAAE;gBACR,IAAI,EAAE,QAAQ;gBACd,GAAG,EAAE,EAAE;gBACP,GAAG,EAAE,CAAC,EAAE;aACT;SACF;QACD;YACE,IAAI,EAAE,QAAQ;YACd,KAAK,EAAE,WAAW;YAClB,IAAI,EAAE,KAAK;YACX,QAAQ,EAAE;gBACR,IAAI,EAAE,QAAQ;gBACd,GAAG,EAAE,CAAC,GAAG;gBACT,GAAG,EAAE,GAAG;aACT;SACF;QACD;YACE,IAAI,EAAE,QAAQ;YACd,KAAK,EAAE,MAAM;YACb,IAAI,EAAE,MAAM;SACb;QACD;YACE,IAAI,EAAE,SAAS;YACf,KAAK,EAAE,aAAa;YACpB,IAAI,EAAE,YAAY;SACnB;KACF;IACD,gBAAgB,EAAE,QAAQ;IAC1B,IAAI,EAAE,4BAA4B;CACnC,CAAA;AAED,SAAS,cAAc,CAAC,SAAoB;IAC1C,IAAI,KAAK,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAA;IAC1B,IAAI,MAAM,GAAG,SAAS,CAAA;IAEtB,OAAO,MAAM,EAAE,CAAC;QACd,IAAI,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,MAAM,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAA;QACpD,KAAK,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;QACjB,KAAK,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;QAEjB,MAAM,GAAG,MAAM,CAAC,MAAM,CAAA;IACxB,CAAC;IACD,OAAO,KAAK,CAAA;AACd,CAAC;AAED,MAAqB,UAAW,SAAQ,oBAAoB;IAA5D;;QAWE,SAAI,GAAe,IAAI,CAAA;QAIvB,YAAO,GAAmB,IAAI,CAAA;IA+LhC,CAAC;IA7LC,IAAI,QAAQ;QACV,OAAO;YACL,aAAa,EAAE;gBACb,QAAQ,EAAE;oBACR,MAAM,EAAE,CAAC,KAAU,EAAE,EAAE;wBACrB,KAAK,CAAC,KAAK,IAAI,IAAI,CAAC,OAAO,EAAE,CAAA;oBAC/B,CAAC;iBACF;aACF;SACF,CAAA;IACH,CAAC;IAED;;OAEG;IACH,OAAO;QACL,IAAI,MAAM,GAAG,IAAI,CAAC,OAAO,CAAA;QACzB,IAAI,CAAC,MAAM,EAAE,CAAC;YACZ,OAAM;QACR,CAAC;QAED,IAAI,KAAK,GAAG,cAAc,CAAC,IAAI,CAAC,CAAA;QAEhC,IAAI,EAAE,GAAG,CAAC,GAAG,KAAK,CAAC,CAAC,CAAA;QACpB,IAAI,EAAE,GAAG,CAAC,GAAG,KAAK,CAAC,CAAC,CAAA;QAEpB,IAAI,SAAS,GAAG,SAAS,EAAE,KAAK,EAAE,GAAG,CAAA;QAErC,MAAO,CAAC,KAAK,CAAC,SAAS,GAAG,SAAS,CAAA;QACnC,MAAO,CAAC,KAAK,CAAC,eAAe,GAAG,SAAS,CAAA;QAEzC,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA;QAClC,MAAM,CAAC,KAAK,CAAC,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC,CAAC,GAAG,IAAI,CAAA;QAC3C,MAAM,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM,GAAG,KAAK,CAAC,CAAC,GAAG,IAAI,CAAA;IAC/C,CAAC;IAED,aAAa;QACX,KAAK,CAAC,aAAa,EAAE,CAAA;QACrB,IAAI,CAAC,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAA;QAE5C,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAA;QAC7C,KAAK,CAAC,WAAW,GAAG;QAChB,eAAe;KAClB,CAAA;QAED,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,KAAK,CAAC,CAAA;QAC/B,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;QAEtC,MAAM,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA;QAEjD,YAAY;QACZ,MAAM,MAAM,GAAG,UAAU,CAAC,CAAC,GAAG,IAAI,WAAW,EAAE,GAAG,IAAI,UAAU,CAAC,CAAC,CAAA;QAElE,oBAAoB;QACpB,MAAM,SAAS,GAAG,IAAI,SAAS,CAAC;YAC9B,MAAM,EAAE,IAAI,GAAG,CAAC;gBACd,YAAY,EAAE,EAAE;aACjB,CAAC;SACH,CAAC,CAAA;QAEF,YAAY;QACZ,MAAM,MAAM,GAA8B;YACxC,KAAK,EAAE,IAAI,KAAK,CAAC;gBACf,MAAM,EAAE,IAAI,MAAM,CAAC;oBACjB,KAAK,EAAE,CAAC;oBACR,KAAK,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,CAAC;iBAC1B,CAAC;aACH,CAAC;YACF,MAAM,EAAE,UAAU,CAAC,WAAW;YAC9B,MAAM,EAAE,IAAI,KAAK,CAAC;gBAChB,KAAK,EAAE,IAAI,WAAW,CAAC;oBACrB,MAAM,EAAE,CAAC;oBACT,MAAM,EAAE,IAAI,MAAM,CAAC;wBACjB,KAAK,EAAE,OAAO;wBACd,KAAK,EAAE,CAAC;qBACT,CAAC;iBACH,CAAC;aACH,CAAC;SACH,CAAA;QAED,MAAM,YAAY,GAAG,IAAI,YAAY,EAAE,CAAA;QACvC,MAAM,WAAW,GAAG,IAAI,WAAW,CAAC;YAClC,MAAM,EAAE,YAAY;YACpB,KAAK,EAAE,UAAU,OAAO;gBACtB,OAAO,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,CAAA;YACpC,CAAC;SACF,CAAC,CAAA;QAEF,QAAQ;QACR,MAAM,GAAG,GAAG,IAAI,GAAG,CAAC;YAClB,MAAM,EAAE,IAAI,CAAC,OAAO;YACpB,MAAM,EAAE,CAAC,SAAS,EAAE,WAAW,CAAC;YAChC,IAAI,EAAE,IAAI,IAAI,CAAC;gBACb,MAAM;gBACN,IAAI;aACL,CAAC;SACH,CAAC,CAAA;QAEF,IAAI,CAAC,IAAI,GAAG,GAAG,CAAA;QACf,IAAI,CAAC,aAAa,GAAG,YAAY,CAAA;QAEjC,UAAU,IAAI,IAAI,CAAC,aAAa,EAAE,CAAA;QAElC,IAAI,CAAC,OAAO,EAAE,CAAA;IAChB,CAAC;IAED,IAAI,OAAO;QACT,OAAO,KAAK,CAAA;IACd,CAAC;IAED,IAAI,GAAG;QACL,OAAO,IAAI,CAAC,IAAI,CAAA;IAClB,CAAC;IAED,OAAO;QACL,KAAK,CAAC,OAAO,EAAE,CAAA;QAEf,OAAO,IAAI,CAAC,OAAO,CAAA;IACrB,CAAC;IAED,oBAAoB,CAAC,GAAmB;QACtC,IAAI,CAAC,OAAO,EAAE,CAAA;IAChB,CAAC;IAED,aAAa;;QACX,MAAM,EAAE,UAAU,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA;QAE3C,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;YACjB,MAAA,IAAI,CAAC,YAAY,0CAAE,aAAa,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;YAC9C,IAAI,CAAC,OAAO,GAAG,IAAI,CAAA;QACrB,CAAC;QAED,IAAI,UAAU,EAAE,CAAC;YACf,YAAY;YACZ,MAAM,MAAM,GAAG,UAAU,CAAC,CAAC,GAAG,IAAI,WAAW,EAAE,GAAG,IAAI,UAAU,CAAC,CAAC,CAAA;YAElE,IAAI,CAAC,OAAO,GAAG,IAAI,OAAO,CAAC;gBACzB,IAAI,EAAE,QAAQ;gBACd,QAAQ,EAAE,IAAI,KAAK,CAAC,MAAM,CAAC;aAC5B,CAAC,CAAA;YAEF,MAAA,IAAI,CAAC,YAAY,0CAAE,WAAW,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAA;QAChD,CAAC;IACH,CAAC;IAED,QAAQ,CAAC,KAAiB,EAAE,MAAkB;;QAC5C,IAAI,MAAM,IAAI,KAAK,EAAE,CAAC;YACpB,MAAM,IAAI,GAAG,MAAA,IAAI,CAAC,GAAG,0CAAE,OAAO,EAAE,CAAA;YAChC,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,CAAA;QAC3B,CAAC;QAED,IAAI,KAAK,IAAI,KAAK,IAAI,KAAK,IAAI,KAAK,EAAE,CAAC;YACrC,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA;YAC7B,MAAM,IAAI,GAAG,MAAA,IAAI,CAAC,GAAG,0CAAE,OAAO,EAAE,CAAA;YAChC,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,SAAS,CAAC,UAAU,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC,CAAA;YAEvC,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;gBACjB,MAAM,QAAQ,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,CAAA;gBAC3C,IAAI,QAAQ,YAAY,KAAK,EAAE,CAAC;oBAC9B,QAAQ,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC,CAAA;gBACjD,CAAC;YACH,CAAC;QACH,CAAC;QAED,IAAI,YAAY,IAAI,KAAK,EAAE,CAAC;YAC1B,IAAI,CAAC,aAAa,EAAE,CAAA;QACtB,CAAC;QAED,KAAK,CAAC,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC,CAAA;QAE7B,IAAI,CAAC,OAAO,EAAE,CAAA;IAChB,CAAC;IAED,IAAI,MAAM;QACR,MAAM,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA;QAC/B,OAAO,EAAE,GAAG,EAAE,GAAG,EAAE,CAAA;IACrB,CAAC;IAED,IAAI,MAAM,CAAC,MAAM;QACf,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAA;IACvB,CAAC;IAED,IAAI,YAAY;QACd,OAAO,IAAI,CAAC,aAAa,CAAA;IAC3B,CAAC;IAED,IAAI,MAAM;QACR,OAAO,MAAM,CAAA;IACf,CAAC;;AA5MM,sBAAW,GAAU,IAAI,KAAK,CAAC;IACpC,KAAK,EAAE,IAAI,IAAI,CAAC;QACd,GAAG,EACD,mCAAmC;YACnC,kBAAkB,CAAC,8DAA8D,GAAG,WAAW,GAAG,QAAQ,CAAC;QAC7G,MAAM,EAAE,CAAC,GAAG,EAAE,CAAC,CAAC;KACjB,CAAC;CACH,CAAC,AAPgB,CAOhB;eARiB,UAAU;AAgN/B,SAAS,CAAC,QAAQ,CAAC,YAAY,EAAE,UAAU,CAAC,CAAA","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\n// @ts-ignore\nimport OpenLayersStyle from '!!text-loader!ol/ol.css'\n\nimport { Feature, Map, View } from 'ol'\nimport { Circle as CircleStyle, Fill, Icon, Stroke, Style } from 'ol/style.js'\nimport { Tile as TileLayer, Vector as VectorLayer } from 'ol/layer'\nimport { Vector as VectorSource, OSM } from 'ol/source'\nimport { fromLonLat } from 'ol/proj'\nimport { Geometry, Point } from 'ol/geom'\n\nimport { Component, HTMLOverlayContainer, Properties, ComponentNature, error } from '@hatiolab/things-scene'\n\nconst MARKER_PATH =\n 'M 0,0 C -2,-20 -10,-22 -10,-30 A 10,10 0 1,1 10,-30 C 10,-22 2,-20 0,0 z M -2,-30 a 2,2 0 1,1 4,0 2,2 0 1,1 -4,0'\n\nconst NATURE: ComponentNature = {\n mutable: false,\n resizable: true,\n rotatable: true,\n properties: [\n {\n type: 'number',\n label: 'latitude',\n name: 'lat',\n property: {\n step: 0.000001,\n max: 90,\n min: -90\n }\n },\n {\n type: 'number',\n label: 'longitude',\n name: 'lng',\n property: {\n step: 0.000001,\n min: -180,\n max: 180\n }\n },\n {\n type: 'number',\n label: 'zoom',\n name: 'zoom'\n },\n {\n type: 'boolean',\n label: 'show-marker',\n name: 'showMarker'\n }\n ],\n 'value-property': 'latlng',\n help: 'scene/component/openlayers'\n}\n\nfunction getGlobalScale(component: Component) {\n var scale = { x: 1, y: 1 }\n var parent = component\n\n while (parent) {\n let { x, y } = parent.get('scale') || { x: 1, y: 1 }\n scale.x *= x || 1\n scale.y *= y || 1\n\n parent = parent.parent\n }\n return scale\n}\n\nexport default class Openlayers extends HTMLOverlayContainer {\n static markerStyle: Style = new Style({\n image: new Icon({\n src:\n 'data:image/svg+xml;charset=utf-8,' +\n encodeURIComponent('<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\">' + MARKER_PATH + '</svg>'),\n anchor: [0.5, 1]\n })\n })\n\n _anchor?: HTMLDivElement\n _map: Map | null = null\n _listenTo?: Component\n _listener?: Function\n _vectorSource?: VectorSource<Feature>\n _marker: Feature | null = null\n\n get eventMap() {\n return {\n 'model-layer': {\n '(self)': {\n change: (after: any) => {\n after.scale && this.rescale()\n }\n }\n }\n }\n }\n\n /*\n * 부모의 스케일의 역으로 transform해서, scale을 1로 맞추어준다.\n */\n rescale() {\n var anchor = this._anchor\n if (!anchor) {\n return\n }\n\n var scale = getGlobalScale(this)\n\n var sx = 1 / scale.x\n var sy = 1 / scale.y\n\n var transform = `scale(${sx}, ${sy})`\n\n anchor!.style.transform = transform\n anchor!.style.transformOrigin = '0px 0px'\n\n var { width, height } = this.state\n anchor.style.width = width * scale.x + 'px'\n anchor.style.height = height * scale.y + 'px'\n }\n\n createElement() {\n super.createElement()\n this._anchor = document.createElement('div')\n\n const style = document.createElement('style')\n style.textContent = `\n ${OpenLayersStyle}\n `\n\n this.element.appendChild(style)\n this.element.appendChild(this._anchor)\n\n const { lat, lng, zoom, showMarker } = this.state\n\n // 지도의 중심 좌표\n const center = fromLonLat([lng || 126.9783882, lat || 37.5666103])\n\n // 타일 레이어 생성 (배경 지도)\n const tileLayer = new TileLayer({\n source: new OSM({\n attributions: ''\n })\n })\n\n // 벡터 레이어 생성\n const styles: { [name: string]: Style } = {\n route: new Style({\n stroke: new Stroke({\n width: 6,\n color: [237, 212, 0, 0.8]\n })\n }),\n marker: Openlayers.markerStyle,\n circle: new Style({\n image: new CircleStyle({\n radius: 7,\n stroke: new Stroke({\n color: 'black',\n width: 2\n })\n })\n })\n }\n\n const vectorSource = new VectorSource()\n const vectorLayer = new VectorLayer({\n source: vectorSource,\n style: function (feature) {\n return styles[feature.get('type')]\n }\n })\n\n // 지도 생성\n const map = new Map({\n target: this._anchor,\n layers: [tileLayer, vectorLayer],\n view: new View({\n center,\n zoom\n })\n })\n\n this._map = map\n this._vectorSource = vectorSource\n\n showMarker && this.refreshMarker()\n\n this.rescale()\n }\n\n get tagName() {\n return 'div'\n }\n\n get map() {\n return this._map\n }\n\n dispose() {\n super.dispose()\n\n delete this._anchor\n }\n\n setElementProperties(div: HTMLDivElement) {\n this.rescale()\n }\n\n refreshMarker() {\n const { showMarker, lat, lng } = this.state\n\n if (this._marker) {\n this.vectorSource?.removeFeature(this._marker)\n this._marker = null\n }\n\n if (showMarker) {\n // 지도의 중심 좌표\n const center = fromLonLat([lng || 126.9783882, lat || 37.5666103])\n\n this._marker = new Feature({\n type: 'circle',\n geometry: new Point(center)\n })\n\n this.vectorSource?.addFeatures([this._marker])\n }\n }\n\n onchange(after: Properties, before: Properties) {\n if ('zoom' in after) {\n const view = this.map?.getView()\n view?.setZoom(after.zoom)\n }\n\n if ('lat' in after || 'lng' in after) {\n let { lat, lng } = this.state\n const view = this.map?.getView()\n view?.setCenter(fromLonLat([lng, lat]))\n\n if (this._marker) {\n const geometry = this._marker.getGeometry()\n if (geometry instanceof Point) {\n geometry.setCoordinates(fromLonLat([lng, lat]))\n }\n }\n }\n\n if ('showMarker' in after) {\n this.refreshMarker()\n }\n\n super.onchange(after, before)\n\n this.rescale()\n }\n\n get latlng() {\n const { lat, lng } = this.state\n return { lat, lng }\n }\n\n set latlng(latlng) {\n this.setState(latlng)\n }\n\n get vectorSource() {\n return this._vectorSource\n }\n\n get nature() {\n return NATURE\n }\n}\n\nComponent.register('openlayers', Openlayers)\n"]}
|
package/package.json
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
{
|
2
2
|
"name": "@operato/scene-openlayers",
|
3
3
|
"description": "OpenLayers component for things-scene",
|
4
|
-
"version": "7.0.0-rc.
|
4
|
+
"version": "7.0.0-rc.3",
|
5
5
|
"license": "MIT",
|
6
6
|
"things-scene": true,
|
7
7
|
"author": "heartyoh",
|
@@ -44,7 +44,7 @@
|
|
44
44
|
"lint-staged": "^13.2.2",
|
45
45
|
"prettier": "^2.4.1",
|
46
46
|
"tslib": "^2.3.1",
|
47
|
-
"typescript": "^
|
47
|
+
"typescript": "^5.0.4"
|
48
48
|
},
|
49
49
|
"prettier": "@hatiolab/prettier-config",
|
50
50
|
"husky": {
|
@@ -58,5 +58,5 @@
|
|
58
58
|
"prettier --write"
|
59
59
|
]
|
60
60
|
},
|
61
|
-
"gitHead": "
|
61
|
+
"gitHead": "1ff0d9a4c10ff41b2e97be5d28b3275604484fa9"
|
62
62
|
}
|