OpenLayers3:图标图像未呈现

时间:2016-01-29 15:00:34

标签: javascript icons maps openlayers-3

我正在尝试为我的OpenLayers图标功能设置一个png图像。这是我一直在尝试的代码:

// CREATE MAP

var vectorSource = new ol.source.Vector({
    features: (new ol.format.GeoJSON()).readFeatures(mapJSON)
});

var vectorLayer = new ol.layer.Vector({
    source: vectorSource
});

var projection = ol.proj.get('EPSG:29738');

var rotateControl = ol.control.defaults({rotate: false});

var map = new ol.Map({
    layers: [vectorLayer],
    target: 'floormap',
    logo : false,
    controls: rotateControl,
    interactions: ol.interaction.defaults({mouseWheelZoom: false}),
    view: new ol.View({
        center: [130, 80],
        zoom: 20.6,
        minZoom: 20,
        maxZoom: 29,
        projection: projection,
        rotation: 4.71239
    })
});


// CREATE ICON STYLE (icon is in same directory)

var iconStyle = new ol.style.Style({
    image: new ol.style.Icon(({
        anchor: [0.5, 46],
        anchorXUnits: 'fraction',
        anchorYUnits: 'pixels',
        opacity: 0.75,
        src: 'icon.png'
    }))
});


// CREATE ICON WHEN CLICKING ON MAP

map.on('click', function(evt) {

    var coord = evt.coordinate;

    var feature = map.forEachFeatureAtPixel(evt.pixel,
        function(feature, layer) {
        return feature;
    });

    var iconFeature = new ol.Feature({
        geometry: new ol.geom.Point(coord),
        type: 'icon',
    });

    var vectorSource = new ol.source.Vector({
        features: [iconFeature]
    });

    var icon = new ol.layer.Vector({
      source: vectorSource,
      style: iconStyle
    });

    map.addLayer(icon);

});

奇怪的是,这是我之前使用的代码完全像这样添加图标图像没有问题,但它现在不能正常工作!

我看不出代码有任何问题,可以吗?

0 个答案:

没有答案