Hintergrund für Mouseover

Super Einstellung… :slight_smile:
Die gefällt mir !

Bei mir kommen 68 raus. > Nachgemessen hat “Abgrund” aber ca. 46 Pixel.
Ich hab auch schon rumprobiert, ob der Text vielleicht immer 2/3 des angezeigten ist, aber dem ist leider nicht so. :slight_smile:
Wäre ja zu einfach gewesen :slight_smile:

Gruß Wayne

Bingo,

gerade rausgefunden: liegt am Font

nimm mal temporär im styleMap fontFamily und fontSize raus. dann passt es.

habe versucht, das im style vom span-element anzugeben, aber das wollte der nicht. liegt auf jeden Fall daran, dass beim Berechnen und beim Zeichnen natürlich der gleiche Font verwendet werden muss.
bin ein wenig müde - du wirst das schon hinkriegen ^^

Gruss
Walter

Moin moin,

Du könntest einen Monospace-Font nehmen, Courier oder ähnlich.
Da haben alle Zeichen per definitionem die gleiche Breite. :slight_smile:

Das ist aber nicht wirklich eine Lösung, alldieweil unterschiedliche Browser möglicherweise unterschiedlich große Fonts haben.

Es ist wirklich knifflig, nämlich ein Henne-und-Ei-Problem:
– Die Textgröße kann man nach dem Zeichnen abfragen.
– Der Style will die Breite aber vor dem Zeichnen wissen.

Das Problem wird durch die Art und Weise verursacht, wie OpenLayers mit Labels umgeht.
Innerhalb von OL könnte man relativ leicht Features “Hintergrundgrafik mit automatischer Größenanpassung” oder Hintergrundfarbe (auch mit Rahmen) realisieren.

Ich habe den grundsätzlichen Ablauf ins OL reingepatched:

(Das Klauen der Karte bitte ich nachzusehen, das war schneller als selber eine Demo zu bauen.)

Durch Aufruf der URL mit angehängter Font-Größe kann man sehen, wie die Hintergrundgrafik an den Text angepasst wird.

Leider ist diese Lösung noch nicht serienreif. :frowning:

Gruß Wolf

genau das machen wir doch: text schreiben, grösse feststellen, label erstellen.
müssen nur noch den text im gewünschen style schreiben, damit die größe 100% stimmt.

edit:


<span id="sizer" style="visibility: hidden; white-space: nowrap; font-family: 'Arial'; font-size: 15"></span>

damit stimmen styleMap und sizer-feld überein und die Grösse passt. :slight_smile:

Gruss
Walter

Oha, da haben aber 2 ne Nachtschicht eingelegt… :wink: >> Da hab ich ja jetzt ein richtig schlechtes Gewissen. :sunglasses:

Damit kommen auf jeden Fall mal 54 raus, was zumindest bedeutend näher dran ist !


context:
{
    getBackgroundWidth: function(feature)
    {
        String.prototype.visualLength = function()
        {
            var sizer = document.getElementById("sizer");
            sizer.innerHTML = this;
            return sizer.offsetWidth;
        }

        var s = '${ziel}';
        return(s.visualLength());
    }
}

So scheint es zu funktionieren, nur wird mir aktuell die Variable ${ziel} noch nicht für jeden Marker ersetzt, sondern selbst als Text interpretiert.
http://tinyurl.com/7kgejy7
Hmmmm

Gruß und vielen Dank Wayne

Nahmd,

Genauer:
– HTML-Objekt bauen und rendern lassen
– Größe auslesen
– HTML-Objekt entsorgen
– SGV mit der ausgelesenen Größe rendern lassen und hoffen, dass er das gleiche macht wie der HTML-Renderer.

Ich habe versucht:
– SVG rendern lassen
– Größe des von SGV gerenderten Objektes abfragen
– Damit die Graphik nachziehen

Das sieht sehr ähnlich aus, ist es aber nicht.

Der Umweg über HTML muss versuchen, alle Parameter zu simulieren, also auch LineHeight, eventuelle Paddings, you name it.
Spätestens bei automatischem Umbruch (ja, das kann SVG), wird das minderspaßig zu bauen. :confused:

Die direkte Version ohne Umweg über HTML macht jeden Unsinn mit:

Einmal gebaut, braucht man da nie mehr nachzubessern.
Und das kommt meiner Faulheit sehr entgegen.

Gruß Wolf

ich kann die ganze Sache hier nur rudimentär testen. Knackpunkt ist ja die Frage, wie man an den aktuellen String rankommt.
Eventuel über das feature, das ja als Argument übergeben wird?

Gruss
Walter

Nahmd,

Das “${name}” ist keine in JavaScript eingebaute Funktion (so wie in Perl oder PHP). Sondern an einigen Stellen schickt OL Strings durch die (recht leistungsfähige) OpenLayers.String.format-Methode, die solche Referenzen ersetzt. Dieser Methode muss natürlich eine Liste von name→Wert-Zuordnungen mitgeschickt werden.

Du könntest an dieser Stelle schreiben:


var s = OpenLayers.String.format ('${ziel}', feature.attributes);

Das ist aber Overkill.
Wäre nützlich, wenn Du im String gleich zwei Felder ersetzen wolltest:


var s = OpenLayers.String.format ('${ziel} (${verspaetung})', feature.attributes);

Ende des Exkurses.

Du schreibst ganz einfach:


var s = feature.attributes.ziel;

Gruß Wolf

Sodele, musste mich schnell um meinen Big Mac, ähm um mein Putensteak Bombay-Art kümmern…

Ich hoffe die Testkarte bleibt erhalten, damit ich deinen OL-Patch mal genaustens analysieren kann.

Genau das wars.

Vielen Dank, das ihr euch so toll um mein Problem gekümmert habt.

Jetzt muß ich die Marker nur noch via ID definieren, dann kann ich die Aktualisierungsrate wieder auf 1 Sekunde setzen (sonst schließt er den Mouseover ja bei jedem refresh)
und dann steht dem relaunch fast nix mehr im Wege… :slight_smile:

Gruß Wayne

PS:

Kann man dein “Labor” mal mieten?
Wenn sich da all meine Map-Probleme so schnell auflösen, würde sich das glatt lohnen. :wink:
Anstelle von Wochen und Monaten negativem probieren in paar Tagen… schwärm :slight_smile:

Hab auch schon öfter mal dran gedacht bei Walter zu klopfen ist ja nicht soo weit weg, gelle? :slight_smile:
Georg

Moin moin,

Wenn Du die Animation in JavaScript machst, kannst Du ein paar Fahrzeuge mehr bei noch höheren Raten schaffen. :slight_smile:

Gruß Wolf

Wow. >> Das ist genau das, was ich suche bzw mir vorstelle… :slight_smile:
Jetzt häng ich mich an dich wie ne Klette… :wink:

Nur lädst du ja in deiner Karte sämtliche Standorte auf einmal und gibst sie dann entsprechend aus.
Meine Standortdaten werden ja jede Sekunde neu generiert.

Gruß Wayne