Pixelkoordinaten vom Bild in Meter ausgeben lassen

[kkapsner]

Dann zeig' doch bitte noch, wie du es gelöst hast. Dann haben kommende Suchende auch was davon. Danke.

Steht zu den Markern nicht in der Dokumnetation?

 

[JQJava]

Mein Fehler war, dass ich nicht den kompletten Code veröffentlicht habe. In meiner ol.Map{...} hatte ich diesen Code drin stehen, was das ganze verursacht habe.

controls: ol.control.defaults().extend([
        new ol.control.ScaleLine({
            units: 'metrics'
        })
    ]),

Aber ich verstehe nciht wieso. Dieser Teil soll ein Balken darstellen. Aber gut...

Zum Marker:
Ich habe mir die Dokumentation angeschaut. Nur finde ich nichts gescheites zum Marker.
Ich habe einige <label>... erstellt und dazugehöriges input. Jetzt muss ich herausfinden wie ich einen marker erstelle, wenn ich in das input eintippe. Da hänge ich gerade einwenig.

 

[kkapsner]

Schau' dir hier mal die icon.js an.

 

[JQJava]

Danke! Diese Seite habe ich mir schon bereits angeschaut und daraus meinen Marker erstellt. Es funktioniert alles, wenn ich selbst fest definierte ol.geom.Point([5, 5]); implementiere. Dann zeigt er mir an der Position diesen Icon. Mein Problem ist jetzt, wie ich aus einem input die eingegebenen Werte in die MapBeispielbild einen Marker erstelle.

Mein Code befindet sich im Anhang.

Bedanke mich auf weitere Hilfe!

Habe den Code im Anhang überarbeitet. Jetzt zeigt mir der icon an, aber wenn ich zoome, dann verschiebt sich das Icon. Soll es aber nicht sein.

 

[JQJava]

Ach je...ich habe den Fehler gefunden. Und zwar anchor. Da muss es richtig gesetzt werden jenachdem wie groß der Marker ist.

Wenn ich Marker erstelle und aktualisiere. Wie kann ich die Marker beibehalten? Weil die verschwinden immer nach der aktualisieren.

 

[JQJava]

Meine andere Frage, wie erstelle ich einen Radius Circle zu den Icons die erstellt werden?

var icons=[];
function checkRefresh(){
    var xCoo = document.getElementById("coordx").value;
    var yCoo = document.getElementById("coordy").value;
    var rad = document.getElementById("rad").value;
    
    if( xCoo == "" || yCoo == "" || xCoo == "" && yCoo == ""){
        alert("Bitte Tippen Sie die Zahlen ein!");
    }else{   
         var iconFeature = new ol.Feature({
            geometry: new ol.geom.Point([xCoo, yCoo])
        });
        
        var iconStyle = new ol.style.Style({
            image: new ol.style.Icon({
              anchor: [10, 20],
              anchorXUnits: 'fraction',
              anchorYUnits: 'pixels',
              opacity: 0.75,
              src: 'icon.png'
            })
         });
        
        iconFeature.setStyle(iconStyle);
    
        var vectorSource = new ol.source.Vector({
          features: [iconFeature]         
        });

        var vectorLayer = new ol.layer.Vector({
          source: vectorSource
        });
        
        //save in array
        icons.push(vectorLayer);
        
        //put the Marker to map
        map.addLayer(vectorLayer);
    }
};

Wie füge ich jetzt zu den icons, wenn das Feld input "rad" eingetippt wurde, einen Radius hinzu? Also quasi einen Kreis mit grüner Fläche.

Danke!