Bild Nullpunkt

[JQJava]

Hallo,

bin seit langem auf der Suche nach der richtigen Koordinatenangabe. Und das Forum kann ich hier sehr gut empfehlen. Ich hatte einige Fehler an meinem Code nicht gesehen und habe hier soviele Tipps und Vorschläge erhalten. Finde ich echt toll ;-)

Im Anhang habe ich ein Beispielbild hochgeladen. Ich möchte in OL3 die follgenden extent richtig angeben.
HTML:

<label class="radio" for="bild-switch_2">
<input id="bild-switch_2" class="bild-switch_1a" type="radio" name="bilder" value="Bild2" onchange="checkedRadioBtn('Haus.png', [750, 547], [-20, -10, 55, 20])" />Haus
</label>

JS:

function checkedRadioBtn(url, size, extProj){
var resultExt,  r2 = 0, ext = 1;
   
    if(extProj[0] < 0){
        ext = extProj[0] * (-1);
        //Dreisatz
        resultExt = (((extProj[2] + ext)*size[1])/size[0])+extProj[1];
    }else{
        resultExt = (((extProj[2] - extProj[0])*size[1]) / size[0])-extProj[1];
    }
    resultExt.toFixed(2);
 
    var newSizeProjection = new ol.proj.Projection({
        code: 'metrics',
        units: 'm',
        extent: [extProj[0], extProj[1], extProj[2], resultExt]  //Xmin, Ymin, Xmax, Ymax
    });
//remove
        map.removeLayer(baseLayer);
 
        //get layers and remove marker
        var allLayers = map.getLayers().getArray()[0];
        map.removeLayer(allLayers);
 
        for(var i = 0; i<icons.length; i++){
            map.removeLayer(icons[i]);  
        }
 
        var extent = newSizeProjection.getExtent();
        var center = ol.extent.getCenter(extent);
 
        var newV = new ol.View2D({
            projection: newSizeProjection,
            center: center,
            zoom: 2
        });
 
        map.updateSize();
        map.addLayer(newL);
        map.getView().getView2D().setProjection(newSizeProjection);
        map.getView().getView2D().setCenter(center);
        $("#extentResult").text('Extent: ' +newSizeProjection.getExtent()[0].toFixed(2)+", "+newSizeProjection.getExtent()[1].toFixed(2)+", "+newSizeProjection.getExtent()[2].toFixed(2)+", "+newSizeProjection.getExtent()[3].toFixed(2));
};

Code, wenn ich eine Stelle anklicke damit die Koordinaten angezeigt werden.

map.on('click', function(evt){
            var coordinate = evt.coordinate;
 
            $("#result").text('You clicked here: x:' + coordinate[0].toFixed(2) + " m - y:" + coordinate[1].toFixed(2) + " m");
           
            overlay.setPosition(coordinate);
            content.innerHTML = '<p>You clicked here:</p></br><code>x: ' +  coordinate[0].toFixed(2) + ' m </br> y: ' + coordinate[1].toFixed(2) + ' m</code>';
            container.style.display = 'block';
    });

Meine Frage wäre wie kann ich den Nullpunkt nicht links definieren sondern wie kann ich dies rechts definieren? Spricht die Meterangabe am Bild sind gespiegelt worden. Nullpunkt fängt nicht wie gewohnt von links an sondern laut Bild von rechts. Also links 55 und rechts -20. Wenn ich die jeweiligen extent Bereich ändere, dann werden auch die Koordinaten nicht richtig angezeigt.
Wenn ich am Bild rechts klicke soll P(-10/2) angezeigt werden und nicht P(52/2).
Hoffe ihr wisst was ich meine.

Ich bedanke mich für eure HIlfe!

 

[JQJava]

Ich habe jetzt follgendes ausprobiert und zeigt mir aber das Popup gespiegelt. Wenn ich rechts am Bild klicke dann zeigt er mir den Popup links an.

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

            coordinate = evt.coordinate;
            
            if(document.getElementById('bild-switch_2').checked == true){
                coordinate[0] = 45- coordinate[0];
                coordinate[1] = coordinate[1];
                
                overlay.setPosition(coordinate);
            }else{
                overlay.setPosition(coordinate);
            }
            
            $("#result").show();
            $("#result").text('You clicked here: x:' + coordinate[0].toFixed(2) + " m - y:" + coordinate[1].toFixed(2) + " m");

            content.innerHTML = '<p>You clicked here:</p></br><code>x: ' +  coordinate[0].toFixed(2) + ' m </br> y: ' + coordinate[1].toFixed(2) + ' m</code>';

            container.style.display = 'block';  

    });

Die 45 habe ich am Bild den Wert genommen wo der 0 Punkt liegt. Da es ja fix ist habe ich 45 immer minus die Position was beim alten Wert ist abgezogen um dann auf den richtigen Wert zu kommen. Wie 45-45= 0 also an der Position 45 wird dann 0 angezeigt an der x -Achse. Aber das Popup erscheint entgegengesetzt.

Kann mir einer helfen, wo der Fehler liegt ;--( ?

 

[kkapsner]

Du musst das overlay.setPosition(coordinate); machen bevor du deine Umrechnung machst.

Aber hast du mal ausprobiert was rauskommt, wenn du dein Xmin größer als das Xmax machst?

PS: OpenLayers.Projection - OpenLayers könnte eventuell noch hilfreich sein.

 

[JQJava]

Du musst das overlay.setPosition(coordinate); machen bevor du deine Umrechnung machst.

Wie meinst du das? Verstehe ich nicht so ganz.

Aber hast du mal ausprobiert was rauskommt, wenn du dein Xmin größer als das Xmax machst?

Ja, das habe ich davor ausprobiert. Bevor ich diese Umrechnung mache, habe ich zuerst mit den [-20, -10, 55, 20] xmin, ymin, xmax und ymax gespielt. Ob es nicht einfacher geht, wenn ich einfach statt rechts 55 ist das ich dies auf der linken Seite anpasse. Habe es so ausprobiert: [55, -10, -20, 20]. Vielleicht liege ich auch falsch. Aber es hat nicht geklappt ;-(

PS: OpenLayers.Projection - OpenLayers könnte eventuell noch hilfreich sein.

Das ist Openlayer 2 und ich arbeite mit der neuen Version openlayer 3.

 

[JQJava]

Habe das Problem gelöst. Habe in der ontent.innerHTML = '<p>You clicked here:</p></br><code>x: ' + coordinate[0].toFixed(2) + ' m </br> y: ' + coordinate[1].toFixed(2) + ' m</code>'; diese 45 abgezogen. Aber in einer variable gespeichert und dann auch abgefragt ob dieser radio angeklickt wurde. Jetzt klappt es super.

var v= (document.getElementById('bild-switch_2').checked)? 490 - coordinate[0] : coordinate[0];
content.innerHTML = '<code>x: ' +v.toFixed(2) +' m</code></br><code>y: '+ coordinate[1].toFixed(2) + ' m</code>';

 

[kkapsner]

Wie meinst du das? Verstehe ich nicht so ganz.

                overlay.setPosition(coordinate);
            if(document.getElementById('bild-switch_2').checked == true){
                coordinate[0] = 45- coordinate[0];
                coordinate[1] = coordinate[1];
            }

Das ist Openlayer 2 und ich arbeite mit der neuen Version openlayer 3.

Oh - hat ich übersehen.

Habe das Problem gelöst. Habe in der ontent.innerHTML = '<p>You clicked here:</p></br><code>x: ' + coordinate[0].toFixed(2) + ' m </br> y: ' + coordinate[1].toFixed(2) + ' m</code>'; diese 45 abgezogen. Aber in einer variable gespeichert und dann auch abgefragt ob dieser radio angeklickt wurde. Jetzt klappt es super.

So geht's natürlich auch.

 

[JQJava]

Danke an alle!

 

[kkapsner]

Bitte - gern geschehen.