Изменение значка маркера по умолчанию в OpenLayers

Question

Я пытаюсь отобразить позиции стран в OpenLayers, и у меня возникают проблемы при смене значка по умолчанию.

Мой основной код выглядит следующим образом:

    function addCountryMarker(ll, popupClass, popupContentHTML, closeBox, overflow) {
        var feature = new OpenLayers.Feature(alumniCountries, ll); 
        feature.closeBox = closeBox;
        feature.popupClass = popupClass;
        feature.data.popupContentHTML = popupContentHTML;
        feature.data.overflow = (overflow) ? "auto" : "hidden";

        var marker = feature.createMarker();

        var markerClick = function (evt) {
            if (this.popup == null) {
                this.popup = this.createPopup(this.closeBox);
                map.addPopup(this.popup);
                this.popup.show();
            } else {
                this.popup.toggle();
            }
            currentPopup = this.popup;
            OpenLayers.Event.stop(evt);
        };
        marker.events.register("mousedown", feature, markerClick);
        alumniCountries.addMarker(marker);
    }

И все это прекрасно работает, но отображает значок openLayers по умолчанию. Следующая строка меняет значок, НО это прерывает всплывающее окно в функции markerClick:

feature.icon = new OpenLayers.Icon("marker-blue.png");

Та же строка с помощью marker.icon также меняет значок, но также и всплывающее окно. Буду очень признателен за любые указания о том, как изменить значок без всплывающего окна.

Answer 1

Это заняло какое-то время, но в итоге все было довольно просто:

feature.data.icon = new OpenLayers.Icon("marker-blue.png");

Answer 2

function addMarker(ll, iconURL, popupClass, popupContentHTML, closeBox, overflow) {
    try 
    {
    var size = new OpenLayers.Size(32, 32);
    var offset = new OpenLayers.Pixel(-(size.w / 2), -size.h);
    var newIcon = new OpenLayers.Icon( iconURL, size, offset );
    var feature = new OpenLayers.Feature(markers, ll);
    feature.closeBox = closeBox;
    feature.popupClass = popupClass;
    feature.data.popupContentHTML = popupContentHTML;
    feature.data.overflow = (overflow) ? "auto" : "hidden";
    feature.data.icon = newIcon;

    var marker = feature.createMarker();
    //marker.setUrl('http://maps.google.com/intl/en_us/mapfiles/ms/micons/orange-dot.png');

    var markerClick = function (evt) {
        if (this.popup == null) {
            this.popup = this.createPopup(this.closeBox);
            map.addPopup(this.popup);
            this.popup.show();
        } else {
            this.popup.toggle();
        }
        currentPopup = this.popup;
        OpenLayers.Event.stop(evt);
    };
    marker.events.register("mousedown", feature, markerClick);
    //marker.setUrl('');


    markers.addMarker(marker);
}
catch (err) {
    txt = "There was an error in initOsmMap\n\n";
    txt += "Error description: " + err.message + "\n------------------------------------------------------------------------------------------------------------------------------------------------------------\n";
    console.log(txt);
}

}