Am 14. September 2017 haben wir eine überarbeitete Fassung unserer Datenschutzrichtlinie veröffentlicht. Wenn Sie video2brain.com weiterhin nutzen, erklären Sie sich mit diesem überarbeiteten Dokument einverstanden. Bitte lesen Sie es deshalb sorgfältig durch.

Panoramafotografie: Virtuelle Touren mit Pano2VR

Tooltip für Node Marker

LinkedIn Learning kostenlos und unverbindlich testen!

Jetzt testen Alle Abonnements anzeigen
Um vorab zu zeigen, wohin der Klick auf einen Marker im Grundriss führt, baut der Trainer in diesem Video einen kleinen Tooltip samt Text ein.

Transkript

In diesem Video möchte ich noch ein kleines Hilfsmittel einbauen für unsere Besucher, damit die auch wenn Sie mit der Maus über diesen Grundriss fahren, bei den entsprechenden Node Marker Stellen auch Informationen kriegen, wo geht's denn dahin, zum Beispiel der Name des Panoramas, kann man auch beliebig erweitern mit Bildern und ähnlichen Dingen mehr. Da das immer funktionieren soll, können wir das dem markertemplate direkt unterordnen, während diese beiden Grafiken hier situationsabhängig sind, ob das jetzt der aktive Node ist oder einer von den anderen. So, ich mache mir das Leben jetzt ein bisschen leichter und auch ein bisschen von wegen der Gestaltungskonsistenz. Wir haben ja bei den hotspots mitunter, so kleine Textfähnchen daran, dass haben wir ja hier bei diesem simplex skin auch so gelassen, da gibts dieses image hier. Ich mach das mal hier kurz an und da haben wir eben hier dieses Bildchen und dann haben wir hier ein kleines Textfähnchen, ein sogenanntes Tooltip, und das werde ich mir jetzt einfach mal kopieren. Und das füge ich mal als Kind-Element bei diesem markertemplate ein, weil so kann man nämlich direkt dort einfach unterordnen. Wichtigster Text ist jetzt ein anderer, der hotspot hat ein anderen Text, natürlich sollte der auch einen anderen Namen bekommen, nm_text, und dieser Text, den werde ich jetzt erstmal hier rübergeben, dieses Texting das kopiere ich natürlich immer genau da drüber und den sortiere ich mir jetzt mal hier links oberhalb von meinem Node marker. Und warum, weil diese Karte an der rechten unteren Ecke ist und sobald ich das irgendwie zentriert mache oder vielleicht sogar untendrunter, dann ist es nicht mehr lesbar, das Fähnchen hier, wenn das beim mouseover sozusagen erscheint. Wenn ich hier zu sehr am Rand bin und da diese map am Rand organisiert ist, schau ich, dass die immer auf jeden Fall ins Bild zeigt, ein Stückchen oberhalb und immer links vom kleinen usability-Ding. Habe ich schon viel Mist gesehen, in der Richtung sollte man einfach darauf achten, wo liegen meine Elemente und was ist eventuell, dann ebenmal einfach nicht mehr zu sehen, muss man ein bischen aufpassen, dass es genau passt, wegen den Bildschirmen - größer/kleiner - was verschwindet denn alles, was sollte man abschalten und so ähnliche Dinge mehr. Gut ich ändere das ein bisschen hier ab, zum Beispiel der Text sollte mal rechtsbündig sein, die Automatische Größe lasse ich und ich verankere das hier an der rechten unteren Ecke, mit Bezug hier, dass es immer in dieser Distanz bleibt. Und was ich noch ändern muss das $hs, was ich jetzt hier von dem hotspot kopiert habe, das ist die Benennung, die der hotspot hat und da es aber kein hotspot ist, technisch, sondern nur das Textfähnchen soll halt gleich ausschauen, da müssen wir hier was anderes reingeben. Das künftige Panorama oder das Panorama was dahinter liegt, dort kann beim Reinziehen und Verlinken einfach Pano2VR auf die User-Daten zugreifen und da können wir einfach $ut, das ist bei den User-Daten der Titel, der dahintersteckt. Und ich schreibe jetzt immer noch ein bisschen, man kann nämlich auch hier html reinschreiben, also zum Beispiel b für Bold und /b, also ganz simplen HTML-Code, dadurch wird der Text dann einfach fett gedruckt. Den Rest lasse ich mal so, jetzt muss ich natürlich noch dafür sorgen, dass dieser Text unsichtbar ist standardmäßig, dadurch, dass ich ihn kopiert habe der dort die gleiche Funktion hat, ist er hier unsichtbar, aber ich möchte ihn natürlich ganz gerne einblenden. Kopiere ich mir einfach von dem hotspot mal die entsprechenden Aktionen, Maus betritt und verlässt, Kopieren und das gebe ich mir bei den markertemplate mal rein und füge das ein, ändere dort aber nur das auf nm_text und im zweiten auch und schon ist die Geschichte hier erledigt. Das ist das Schöne, wenn einfach diese ganzen Aktionen hin und her kopierbar sind. Jetzt muss ich natürlich noch dafür sorgen, das mache ich jetzt gleich in einem Aufwasch, dass natürlich dieser node marker auch auf das entsprechende Panorama verlinkt. Das sorgte ja jetzt nur dafür, dass dieser Tooltip an und aus geht und da gucken wir mal, wie die das da unten bei dem hotspot gemacht haben und da sagen wir Mausklick, Gehe zur URL, das kopiere ich mir jetzt einfach mal, wissen nämlich genau, dass ich das eigentlich brauche, wenn ich im Panorama auf ein Hotspot klicke, will ich zum nächsten Panorama und hier will ich auch zu einem Panorama, also sollte das mal ziemlich ähnlich sein. Wichtig ist aber, das habe ich jetzt nicht beim markertemplate darauf hängen, weil das Ding nämlich einfach eine zu kleine Klickfläche hat und ich kopiere das hier mal in die Grafiken rein, dann geht das nämlich, Einfügen, und hier sage ich auch, diese URL Geschichte, man kann nämlich ein Panorama auch einfach mit der URL verlinken, einmal über Öffne Panorama und bei URL kann man es eben Allgemein halten, da sagt man einfach $hu und das Ziel brauche ich nicht, das ist praktisch die Zielansicht. Die lösche ich mal weg, dann kopiere ich das Ganze und füge das dem anderen Button auch noch zu und dann ist es eigentlich fertig, das Ganze. Und ob das jetzt dann wirklich funktioniert, das werden wir dann im nächsten Video sehen. Wenn wir dann mit diesen markertemplates das erste Mal ein Panorama auf diesen Grundriss verlinken. Wir kontrollieren es noch mal vorher, den hotspot hier, den mache ich mal wieder aus und das hide_template, das muss übrigens auch unsichtbar sein, das reicht nicht, wenn man dieses Auge ausmacht, sondern es muss auch unsichtbar sein, dieser Ordner. Die Dinge da drin, die sollten aber sichtbar bleiben und dann ist es hier so, dass wir das markertemplate der holt sich diese beiden Grafiken, der Text ist permanent untergeordnet, der Text wird hier sichtbar gemacht, wenn man mit der Maus über das Ganze fährt und der Klick von dem Ganzen, der liegt hier drauf Gehe zu URL, $hu und das Gleiche gilt für die beiden. Auch noch im Prinzip bräuchte man es beim Aktiven gar nicht machen, weil da sollte gar nichts passieren, aber das mache ich jetzt mal der Vollständigkeit halber und damit sollte dieses markertemplate eigentlich mal fertig sein. Und wir schauen uns im nächsten Video an, wie wir dann die Verlinkung vornehmen.

Panoramafotografie: Virtuelle Touren mit Pano2VR

Lernen Sie, wie Sie mit Pano2VR mehrere Panoramen zu einer interaktiven, begehbaren Besichtigungstour zusammenstellen und für das Web ausgeben.

9 Std. 51 min (103 Videos)
Derzeit sind keine Feedbacks vorhanden...
 

Dieser Online-Kurs ist als Download und als Streaming-Video verfügbar. Die gute Nachricht: Sie müssen sich nicht entscheiden - sobald Sie das Training erwerben, erhalten Sie Zugang zu beiden Optionen!

Der Download ermöglicht Ihnen die Offline-Nutzung des Trainings und bietet die Vorteile einer benutzerfreundlichen Abspielumgebung. Wenn Sie an verschiedenen Computern arbeiten, oder nicht den ganzen Kurs auf einmal herunterladen möchten, loggen Sie sich auf dieser Seite ein, um alle Videos des Trainings als Streaming-Video anzusehen.

Wir hoffen, dass Sie viel Freude und Erfolg mit diesem Video-Training haben werden. Falls Sie irgendwelche Fragen haben, zögern Sie nicht uns zu kontaktieren!