46 lines
1.2 KiB
TypeScript
46 lines
1.2 KiB
TypeScript
import { Component, createSignal, onMount } from 'solid-js';
|
|
import OlMap from 'ol/Map';
|
|
import View from 'ol/View';
|
|
import TileLayer from 'ol/layer/Tile';
|
|
import VectorLayer from 'ol/layer/Vector';
|
|
import VectorSource from 'ol/source/Vector';
|
|
import Feature from 'ol/Feature';
|
|
import Attribution from 'ol/control/Attribution';
|
|
import Rotate from 'ol/control/Rotate';
|
|
import ScaleLine from 'ol/control/ScaleLine';
|
|
import Control from 'ol/control/Control';
|
|
import OSM from 'ol/source/OSM';
|
|
import { useGeographic as olUseGeographic } from 'ol/proj';
|
|
|
|
import 'ol/ol.css';
|
|
import './Map.css';
|
|
|
|
const Map: Component = () => {
|
|
const [getMap, setMap] = createSignal<OlMap | null>(null);
|
|
let target: HTMLDivElement;
|
|
|
|
onMount(() => {
|
|
const olMap = new OlMap({
|
|
view: new View({
|
|
center: [0, 0],
|
|
zoom: 1,
|
|
}),
|
|
layers: [
|
|
new TileLayer({
|
|
source: new OSM(),
|
|
}),
|
|
//new VectorLayer({ source: newSource }),
|
|
],
|
|
target: target,
|
|
// controls,
|
|
});
|
|
// olMap.on(['moveend'], changeListener);
|
|
setMap(olMap);
|
|
});
|
|
|
|
// @ts-ignore
|
|
return <div class='ol-map' ref={target} />;
|
|
};
|
|
|
|
export default Map;
|