@operato/scene-openlayers 1.2.90 → 1.3.7

package/CHANGELOG.md

@@ -3,6 +3,24 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.3.7](https://github.com/things-scene/operato-scene/compare/v1.3.6...v1.3.7) (2024-01-01)
+
+
+### :bug: Bug Fix
+
+* mpi module moved from things-factory ([47b743f](https://github.com/things-scene/operato-scene/commit/47b743fd19001f195db85e50b8f6e457a1573aa5))
+
+
+
+## [1.2.91](https://github.com/things-scene/operato-scene/compare/v1.2.90...v1.2.91) (2023-11-26)
+
+
+### :bug: Bug Fix
+
+* type errors in open-layers ([2cd497c](https://github.com/things-scene/operato-scene/commit/2cd497c51c3b7fcdfa32f72b172c816bcba87ba8))
+
+
+
 ## [1.2.90](https://github.com/things-scene/operato-scene/compare/v1.2.89...v1.2.90) (2023-11-22)
 
 **Note:** Version bump only for package @operato/scene-openlayers

package/dist/ol-marker.d.ts

@@ -1,4 +1,4 @@
-import { Component, InfoWindow as SceneInfoWindow, Properties, Shape } from '@hatiolab/things-scene';
+import { Component, InfoWindow as SceneInfoWindow, Properties, Shape, ComponentNature } from '@hatiolab/things-scene';
 import Openlayers from './openlayers';
 import 'ol/ol.css';
 import { Map, MapBrowserEvent } from 'ol';
@@ -35,46 +35,6 @@ export default class OpenLayersMarker extends OpenLayersMarker_base {
         lat: any;
         lng: any;
     });
-    get nature(): {
-        mutable: boolean;
-        resizable: boolean;
-        rotatable: boolean;
-        properties: ({
-            type: string;
-            label: string;
-            name: string;
-            property: {
-                component: string;
-                step?: undefined;
-                max?: undefined;
-                min?: undefined;
-                options?: undefined;
-            };
-        } | {
-            type: string;
-            label: string;
-            name: string;
-            property: {
-                step: number;
-                max: number;
-                min: number;
-                component?: undefined;
-                options?: undefined;
-            };
-        } | {
-            type: string;
-            label: string;
-            name: string;
-            property: {
-                options: string[];
-                component?: undefined;
-                step?: undefined;
-                max?: undefined;
-                min?: undefined;
-            };
-        })[];
-        'value-property': string;
-        help: string;
-    };
+    get nature(): ComponentNature;
 }
 export {};

package/dist/ol-marker.js

@@ -7,7 +7,7 @@ import { Overlay } from 'ol';
 import { fromLonLat } from 'ol/proj';
 import { Icon, Style } from 'ol/style';
 import { Feature } from 'ol';
-import Point from 'ol/geom/Point';
+import { Point } from 'ol/geom';
 const NATURE = {
     mutable: false,
     resizable: true,

package/dist/ol-marker.js.map

@@ -1 +1 @@
-{"version":3,"file":"ol-marker.js","sourceRoot":"","sources":["../src/ol-marker.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,SAAS,EAA6C,QAAQ,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAA;AAG9G,OAAO,WAAW,CAAA;AAClB,OAAO,EAAwB,OAAO,EAAQ,MAAM,IAAI,CAAA;AACxD,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAGpC,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AACtC,OAAO,EAAE,OAAO,EAAE,MAAM,IAAI,CAAA;AAC5B,OAAO,KAAK,MAAM,eAAe,CAAA;AAEjC,MAAM,MAAM,GAAG;IACb,OAAO,EAAE,KAAK;IACd,SAAS,EAAE,IAAI;IACf,SAAS,EAAE,IAAI;IACf,UAAU,EAAE;QACV;YACE,IAAI,EAAE,UAAU;YAChB,KAAK,EAAE,YAAY;YACnB,IAAI,EAAE,WAAW;YACjB,QAAQ,EAAE;gBACR,SAAS,EAAE,YAAY;aACxB;SACF;QACD;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,GAAG;gBACR,GAAG,EAAE,CAAC,GAAG;aACV;SACF;QACD;YACE,IAAI,EAAE,QAAQ;YACd,KAAK,EAAE,OAAO;YACd,IAAI,EAAE,OAAO;YACb,QAAQ,EAAE;gBACR,OAAO,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;aAC9B;SACF;KACF;IACD,gBAAgB,EAAE,QAAQ;IAC1B,IAAI,EAAE,2BAA2B;CAClC,CAAA;AAED,MAAM,WAAW,GAAG,iGAAiG,CAAA;AAErH,MAAM,CAAC,OAAO,OAAO,gBAAiB,SAAQ,QAAQ,CAAC,KAAK,CAAC;IAA7D;;QAGE,SAAI,GAAe,IAAI,CAAA;IAyOzB,CAAC;IA9NC,OAAO;QACL,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;QAE5C,IAAI,CAAC,MAAM,GAAG,IAAI,CAAA;QAClB,OAAO,IAAI,CAAC,WAAW,CAAA;QAEvB,KAAK,CAAC,OAAO,EAAE,CAAA;IACjB,CAAC;IAED,KAAK;QACH,KAAK,CAAC,KAAK,EAAE,CAAA;QAEb,IAAI,IAAI,CAAC,UAAU,EAAE,EAAE;YACrB,OAAM;SACP;QAED,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;IAC5C,CAAC;IAED,IAAI,GAAG;QACL,OAAO,IAAI,CAAC,IAAI,CAAA;IAClB,CAAC;IAED,IAAI,UAAU;QACZ,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE;YACrB,IAAI,CAAC,WAAW,GAAG,IAAI,OAAO,CAAC;gBAC7B,OAAO,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAE;gBACzC,WAAW,EAAE,eAAe;gBAC5B,SAAS,EAAE,KAAK;aACjB,CAAC,CAAA;SACH;QAED,OAAO,IAAI,CAAC,WAAW,CAAA;IACzB,CAAC;IAED,cAAc,CAAC,IAAY;QACzB,IAAI,YAAY,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,EAAE,CAAA;QAErE,IAAI,UAAU;QACZ,qBAAqB,CAAC,YAAY,CAAC,UAAU;YAC7C,qBAAqB,CAAC,CAAC,YAAY,CAAC,MAAM,IAAI,YAAY,IAAI,YAAY,CAAC,MAAM,CAAC,CAAA;QAEpF,IAAI,UAAU,EAAE;YACd,OAAO,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAA;SACtC;IACH,CAAC;IAED,cAAc,CAAC,eAAgC;QAC7C,IAAI,GAAG,GAAG,SAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,KAAK,CAAC,iBAAiB,CAAC,CAAA;QACrE,IAAI,OAAO,GAAG,UAAU,eAAe,CAAC,KAAK,CAAC,KAAK,UAAU,GAAG,GAAG,CAAC,IAAI,CAAC,CAAA;QAEzE,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,OAAO,CAAC,CAAA;IACrC,CAAC;IAED,cAAc,CAAC,EAAmB;QAChC,IAAI,CAAC,cAAc,CAAC,EAAE,CAAC,CAAA;QAEvB,IAAI,CAAC,IAAI,CAAC,GAAG;YAAE,OAAM;QAErB,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,EAAE,IAAI,CAAC,MAAM,CAAC,CAAA;IAC7C,CAAC;IAED,aAAa,CAAC,CAA2B;QACvC,IAAI,EAAE,GAAG,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAA;QACnC,EAAE,IAAI,IAAI,CAAC,cAAc,CAAC,EAAE,CAAC,CAAA;QAE7B,qCAAqC;IACvC,CAAC;IAED,iBAAiB,CAAC,CAA2B;QAC3C,IAAI,EAAE,GAAG,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,CAAA;QACrC,EAAE,IAAI,IAAI,CAAC,cAAc,CAAC,EAAE,CAAC,CAAA;IAC/B,CAAC;IAED,gBAAgB,CAAC,CAA2B;QAC1C,IAAI,EAAE,GAAG,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,CAAA;QACrC,EAAE,IAAI,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,CAAA;IAC/B,CAAC;IAED,IAAI,MAAM,CAAC,MAAM;QACf,IAAI,CAAC,OAAO,GAAG,MAAM,CAAA;IACvB,CAAC;IAED,IAAI,MAAM;QACR,OAAO,IAAI,CAAC,OAAO,CAAA;IACrB,CAAC;IAED,MAAM,CAAC,OAAiC;QACtC,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA;QAE7C,OAAO,CAAC,SAAS,CAAC,IAAI,EAAE,GAAG,CAAC,CAAA;QAE5B,YAAY;QACZ,OAAO,CAAC,SAAS,EAAE,CAAA;QAEnB,OAAO,CAAC,MAAM,CAAC,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,CAAA;QACvC,OAAO,CAAC,aAAa,CAAC,KAAK,GAAG,GAAG,EAAE,MAAM,GAAG,GAAG,EAAE,CAAC,EAAE,MAAM,GAAG,CAAC,EAAE,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,CAAA;QAE9E,OAAO,CAAC,OAAO,CAAC,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,EAAE,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,EAAE,GAAG,CAAC,EAAE,IAAI,CAAC,EAAE,GAAG,CAAC,CAAC,CAAA;QAE1F,OAAO,CAAC,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,CAAC,EAAE,KAAK,GAAG,GAAG,EAAE,MAAM,GAAG,GAAG,EAAE,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,CAAA;QAC5F,OAAO,CAAC,SAAS,EAAE,CAAA;QAEnB,OAAO,CAAC,SAAS,CAAC,CAAC,IAAI,EAAE,CAAC,GAAG,CAAC,CAAA;IAChC,CAAC;IAED,uBAAuB,CAAC,GAAe;;QACrC,IAAI,IAAI,CAAC,OAAO,IAAI,GAAG,EAAE;YACvB,MAAA,GAAG,CAAC,YAAY,0CAAE,aAAa,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;YAC7C,IAAI,CAAC,OAAO,GAAG,IAAI,CAAA;SACpB;IACH,CAAC;IAED,qBAAqB,CAAC,GAAe;;QACnC,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,GAAG,EAAE;YACxB,IAAI,EACF,GAAG,EACH,GAAG,EACH,KAAK,GAAG,QAAQ,EAChB,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,WAAW,GAAG,CAAC,EACtB,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,YAAY,EACxB,GAAG,IAAI,CAAC,KAAK,CAAA;YAEd,MAAM,MAAM,GAAG,IAAI,OAAO,CAAC;gBACzB,IAAI,EAAE,KAAK;gBACX,QAAQ,EAAE,IAAI,KAAK,CAAC,UAAU,CAAC,CAAC,GAAG,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC;aACtD,CAAC,CAAA;YAEF,MAAA,GAAG,CAAC,YAAY,0CAAE,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC,CAAA;YAEvC,IAAI,MAAM,EAAE;gBACV,YAAY;gBACZ,MAAM,CAAC,EAAE,CAAC,OAAO,EAAE,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;gBACjD,YAAY;gBACZ,MAAM,CAAC,EAAE,CAAC,WAAW,EAAE,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;gBACzD,YAAY;gBACZ,MAAM,CAAC,EAAE,CAAC,UAAU,EAAE,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;aACxD;YAED,IAAI,CAAC,OAAO,GAAG,MAAM,CAAA;SACtB;IACH,CAAC;IAED,iBAAiB,CAAC,KAAa,EAAE,MAAc;QAC7C,MAAM,MAAM,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAe,CAAA;QACvD,MAAM,MAAM,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAe,CAAA;QAEtD,IAAI,CAAC,uBAAuB,CAAC,MAAM,CAAC,CAAA;QACpC,IAAI,CAAC,qBAAqB,CAAC,MAAM,CAAC,CAAA;IACpC,CAAC;IAED,IAAI,SAAS;QACX,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA;QAChC,OAAO,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAe,CAAA;IACpD,CAAC;IAED,QAAQ,CAAC,KAAiB,EAAE,MAAkB;QAC5C,IAAI,WAAW,IAAI,KAAK,EAAE;YACxB,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC,SAAS,EAAE,MAAM,CAAC,SAAS,CAAC,CAAA;SAC1D;QAED,IAAI,KAAK,IAAI,KAAK,IAAI,KAAK,IAAI,KAAK,EAAE;YACpC,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA;YAC7B,IAAI,CAAC,MAAM,GAAG;gBACZ,GAAG;gBACH,GAAG;aACJ,CAAA;SACF;QAED,IAAI,CAAC,WAAW,IAAI,KAAK,IAAI,aAAa,IAAI,KAAK,IAAI,WAAW,IAAI,KAAK,CAAC,IAAI,IAAI,CAAC,MAAM,EAAE;YAC3F,IAAI,EACF,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,WAAW,GAAG,CAAC,EACtB,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,YAAY,EACxB,GAAG,IAAI,CAAC,KAAK,CAAA;YAEd,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC;gBAClB,IAAI,EAAE,WAAW;gBACjB,SAAS;gBACT,WAAW;gBACX,WAAW;gBACX,YAAY;aACb,CAAC,CAAA;SACH;QAED,IAAI,OAAO,IAAI,KAAK,EAAE;YACpB,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA;YAChC,IAAI,CAAC,iBAAiB,CAAC,SAAS,EAAE,SAAS,CAAC,CAAA;SAC7C;QAED,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC,CAAA;IACjD,CAAC;IAED,IAAI,MAAM;QACR,OAAO;YACL,GAAG,EAAE,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC;YACzB,GAAG,EAAE,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC;SAC1B,CAAA;IACH,CAAC;IAED,IAAI,MAAM,CAAC,MAAM;QACf,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,MAAM,CAAA;QAEzB,IAAI,IAAI,CAAC,MAAM,EAAE;YACf,MAAM,QAAQ,GAAG,IAAI,CAAC,MAAM,CAAC,WAAW,EAAE,CAAA;YAC1C,IAAI,QAAQ,YAAY,KAAK,EAAE;gBAC7B,QAAQ,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC,CAAA;aAChD;SACF;QAED,IAAI,CAAC,QAAQ,CAAC;YACZ,GAAG;YACH,GAAG;SACJ,CAAC,CAAA;IACJ,CAAC;IAED,IAAI,MAAM;QACR,OAAO,MAAM,CAAA;IACf,CAAC;;AAtOM,4BAAW,GAAU,IAAI,KAAK,CAAC;IACpC,KAAK,EAAE,IAAI,IAAI,CAAC;QACd,MAAM,EAAE,CAAC,GAAG,EAAE,CAAC,CAAC;QAChB,GAAG,EACD,mCAAmC;YACnC,kBAAkB,CAAC,8DAA8D,GAAG,WAAW,GAAG,QAAQ,CAAC;KAC9G,CAAC;CACH,CAAC,CAAA;AAkOJ,SAAS,CAAC,QAAQ,CAAC,WAAW,EAAE,gBAAgB,CAAC,CAAA","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport { Component, InfoWindow as SceneInfoWindow, Properties, RectPath, Shape } 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 Point from 'ol/geom/Point'\n\nconst NATURE = {\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({\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"]}
+{"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.d.ts

@@ -9,7 +9,7 @@ export default class Openlayers extends HTMLOverlayContainer {
     _map: Map | null;
     _listenTo?: Component;
     _listener?: Function;
-    _vectorSource?: VectorSource<Geometry>;
+    _vectorSource?: VectorSource<Feature>;
     _marker: Feature | null;
     get eventMap(): {
         'model-layer': {
@@ -34,6 +34,6 @@ export default class Openlayers extends HTMLOverlayContainer {
         lat: any;
         lng: any;
     });
-    get vectorSource(): VectorSource<Geometry> | undefined;
+    get vectorSource(): VectorSource<Feature<Geometry>> | undefined;
     get nature(): ComponentNature;
 }

package/dist/openlayers.js.map

@@ -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<Geometry>\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"]}
+{"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;QACb,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;KACvB;IACD,OAAO,KAAK,CAAA;AACd,CAAC;AAED,MAAM,CAAC,OAAO,OAAO,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;YACX,OAAM;SACP;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;YAChB,MAAA,IAAI,CAAC,YAAY,0CAAE,aAAa,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;YAC9C,IAAI,CAAC,OAAO,GAAG,IAAI,CAAA;SACpB;QAED,IAAI,UAAU,EAAE;YACd,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;SAC/C;IACH,CAAC;IAED,QAAQ,CAAC,KAAiB,EAAE,MAAkB;;QAC5C,IAAI,MAAM,IAAI,KAAK,EAAE;YACnB,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;SAC1B;QAED,IAAI,KAAK,IAAI,KAAK,IAAI,KAAK,IAAI,KAAK,EAAE;YACpC,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;gBAChB,MAAM,QAAQ,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,CAAA;gBAC3C,IAAI,QAAQ,YAAY,KAAK,EAAE;oBAC7B,QAAQ,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC,CAAA;iBAChD;aACF;SACF;QAED,IAAI,YAAY,IAAI,KAAK,EAAE;YACzB,IAAI,CAAC,aAAa,EAAE,CAAA;SACrB;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,CAAA;AAwMJ,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

@@ -1,7 +1,7 @@
 {
   "name": "@operato/scene-openlayers",
   "description": "OpenLayers component for things-scene",
-  "version": "1.2.90",
+  "version": "1.3.7",
   "license": "MIT",
   "things-scene": true,
   "author": "heartyoh",
@@ -58,5 +58,5 @@
       "prettier --write"
     ]
   },
-  "gitHead": "93fdb854cd60011a20786ed3dc693088dbb751bc"
+  "gitHead": "1a9537c359f06a220491b213794c9747ab6e5a24"
 }

package/src/ol-marker.ts

@@ -2,7 +2,14 @@
  * Copyright © HatioLab Inc. All rights reserved.
  */
 
-import { Component, InfoWindow as SceneInfoWindow, Properties, RectPath, Shape } from '@hatiolab/things-scene'
+import {
+  Component,
+  InfoWindow as SceneInfoWindow,
+  Properties,
+  RectPath,
+  Shape,
+  ComponentNature
+} from '@hatiolab/things-scene'
 import Openlayers from './openlayers'
 
 import 'ol/ol.css'
@@ -12,9 +19,9 @@ import { Tile as TileLayer, Vector as VectorLayer } from 'ol/layer'
 import { OSM, Vector as VectorSource } from 'ol/source'
 import { Icon, Style } from 'ol/style'
 import { Feature } from 'ol'
-import Point from 'ol/geom/Point'
+import { Geometry, Point } from 'ol/geom'
 
-const NATURE = {
+const NATURE: ComponentNature = {
   mutable: false,
   resizable: true,
   rotatable: true,
@@ -201,7 +208,7 @@ export default class OpenLayersMarker extends RectPath(Shape) {
         lineWidth: strokeWeight
       } = this.state
 
-      const marker = new Feature({
+      const marker = new Feature<Geometry>({
         type: style,
         geometry: new Point(fromLonLat([lng || 0, lat || 0]))
       })

package/src/openlayers.ts

@@ -85,7 +85,7 @@ export default class Openlayers extends HTMLOverlayContainer {
   _map: Map | null = null
   _listenTo?: Component
   _listener?: Function
-  _vectorSource?: VectorSource<Geometry>
+  _vectorSource?: VectorSource<Feature>
   _marker: Feature | null = null
 
   get eventMap() {