openlayer相关。。。。

点击地图的时候添加标注

this.map.on('singleclick',function(e){
            that.clickPoint = e.coordinate
            if (that.vectorSource) {
                that.vectorSource.clear()
            }
            let startMarker = new Feature({
                type: 'icon',
                geometry: new Point(e.coordinate)
            });
            //设置点要素样式
            startMarker.setStyle(new olStyle({
                image: new olIcon({
                    src: that.api + '/tool/star2.png'
                })
            }));
            //矢量标注的数据源
            that.vectorSource = new SourceVector({
                features: [startMarker]
            });
            //矢量标注图层
            let vectorLayer = new layerVector({
                source: that.vectorSource,
                zIndex:9999
            });
            console.log(vectorLayer)
            that.map.addLayer(vectorLayer);
        })

贴的图鼠标滑动时不能超过该框，需要给ol/View也设置extent，这样鼠标滑动图片时不会划出。

在框内的地图不随着鼠标移动的时候而移动

this.extent = [0, 0, 1024, 968];
        this.projection=new Projection({
            code: 'xkcd-image',
            units: 'pixels',
            extent: this.extent
        })
        this.view=new olView({
            // center:[510,480],
            projection: this.projection,
            zoom:1,
            maxZoom: 1,
            minZoom:1,
            extent: this.extent
        })
        this.map=new olMap({
            target:'map',
            view:this.view
        })

        //以下代码是禁止拖动地图
        let that = this; 
        let pan = getPan();
        pan.setActive(false);//false：当前地图不可拖动。true：可拖动
        function getPan() {
            let pan;
            that.map.getInteractions().forEach(function(element, index, array) {
                if(element instanceof DragPan) {
                    pan = element;
                }
            })
            return pan;
        }