更改对象的样式而不进行交互

时间:2015-01-28 11:32:59

标签: javascript openlayers-3

当我点击地铁站时,当我在OpenLayers3中选择一个像这个网站的对象时,我想在地图上做一个笔划:

http://vis.oobrien.com/tube/#tongues

为此,我尝试了:

map.on('click', function(evt)
        {
            // Delete the overlay if it's not null

            if (overlay = 'undefined'){map.removeLayer(overlay)};

            // Remove popups
            $(popup).remove();
            popup = null;

            var coord = evt.coordinate;

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

            spawnPopup(coord,feature);
        }
    );

function spawnPopup(coord,feature)
{

    if (feature) {

            var props = feature.getProperties();
            console.log(props);

        }

    var test = null;

    popup = $("<div class='tad_popup'><div id='tad_close_popup' onclick='destroyPopup()'></div><div id='tad_text_popup'><p>Arr&ecirc;t "+  props.num + "</p><p>"+  props.nom + "</p></div></div>");

    var test = $(props.geometry);

    var overlay = new ol.Overlay({
        element:popup
    });

    var overlay_test = new ol.layer.Vector({source: test,
                                            style: new ol.style.Style
                                            ({
                                            image: new ol.style.Circle
                                                    ({
                                                    radius: 5,
                                                    fill: new ol.style.Fill({color: 'rgba(255,100,100,0.9)'}),
                                                    stroke: new ol.style.Stroke ({color: 'rgba(255, 255, 255, 1)',width: 2})
                                                    })})});

    overlay.setPosition(coord);
    map.addOverlay(overlay);
    map.addLayer(overlay_test);

但它不是解决方案。

我能为此做些什么?

非常感谢。

地理-X

1 个答案:

答案 0 :(得分:0)

您可以使用Select交互,然后在构造函数中设置style属性。或者手动将功能(您在点击事件处理程序中使用forEachFeatureAtPixel获得)添加到具有自定义样式的feature overlay,如下例所示:http://openlayers.org/en/master/examples/vector-layer.html