vue+openlayers绘制线

绘制线

<template>
    <div></div>
</template>
<script>
import VectorLayer from 'ol/layer/Vector.js';
import VectorSource from 'ol/source/Vector.js';
import Feature from 'ol/Feature';
import { Stroke, Style, Fill } from "ol/style";
import { LineString } from 'ol/geom';
export default {
    name: "linePage",
    data() {
        return {

        }
    },
    created() {
        this.drawLine()
    },
    methods: {
        drawLine() {
            const map = window._map
            const source = new VectorSource({});
            const vector = new VectorLayer({
                source: source,
                id: 'line',
                className: 'line'
            });
            map.addLayer(vector)
            const lineStyle = new Style({
                    stroke: new Stroke({
                        color: '#000',
                        width: 1,
                    }),
                    fill: new Fill({
                        color: '#000',
                        width: 0,
                    }),
                });
           
            const line = new LineString([[108.885436, 30.054604], [120.885436, 30.054604]])
            const lineFeature = new Feature({
                geometry: line
            })
            lineFeature.setStyle(lineStyle);
            source.addFeature(lineFeature);
        }
    }
}
</script>