Sie sind nicht angemeldet.

1

Samstag, 14. Dezember 2013, 12:45

Aktiver hotspot grün anzeigen

Hallo,
ich stehe gerade auf dem Schlauch.
Ich habe eine eigene Karte in eine Tour eingebaut und sie mit hotspots (vtourskin_mapspot.png, blauer mapspot) versehen. Soweit hat das auch funktioniert.
Was kann ich nun aber tun, damit der player weiß, welches Pano gerade aktiv ist.
Ist es eventuell möglich mit "onloaded" und dann die png's zu tauschen, das blaue gegen das grüne?

Mein Code für den hotspot sieht so aus:
<plugin name="schlafzimmer"
url="../skin/vtourskin_mapspot.png"
scale="0.5"
parent="map"
keep="true"
align="leftbottom"
edge="bottom"
x="110"
y="60"
zorder="2"
onhover="showtext(Schlafzimmer);"
onclick="loadscene(scene_Appartement1_Schlafzimmer,null,MERGE,BLEND(2))"
/>

Danke schonmal!

2

Samstag, 14. Dezember 2013, 13:40

Mal eben nur aus einer meiner Touren ausgschnitten:

Zitat

<style name="mapspot" keep="true" url="camicon.png" parent="map" align="lefttop" edge="center"/>
<style name="mapspotred" keep="true" url="camicon_red.png" parent="map" align="lefttop" edge="center"/>

<plugin name="SpotEinfahrt" style="mapspot" zorder="10" x="174" y="10" onclick="wait(0.5); loadscene(Einfahrt,null,MERGE,BLEND(1));" onhover="showtext('Einfahrt',hotspottextstyle);"/>
<plugin name="SpotEingang" style="mapspot" zorder="10" x="109" y="150" onclick="wait(0.5); loadscene(Eingang,null,MERGE,BLEND(1));" onhover="showtext('Eingang',hotspottextstyle);"/>
<plugin name="SpotWohnzimmer" style="mapspot" x="142" y="237" onclick="wait(0.5); loadscene(Wohnzimmer,null,MERGE,BLEND(1));" onhover="showtext('Wohnzimmer',hotspottextstyle);"/>
<plugin name="SpotKueche" style="mapspot" x="72" y="245" onclick="wait(0.5); loadscene(Kueche,null,MERGE,BLEND(1));" onhover="showtext('Küche',hotspottextstyle);"/>
<plugin name="SpotMasterschlafzimmer" style="mapspot" x="36" y="256" onclick="wait(0.5); loadscene(Masterschlafzimmer,null,MERGE,BLEND(1));" onhover="showtext('Masterschlafzimmer',hotspottextstyle);"/>
<plugin name="SpotTerrasse" style="mapspot" x="99" y="314" onclick="wait(0.5); loadscene(Terrasse,null,MERGE,BLEND(1));" onhover="showtext('Terrasse',hotspottextstyle);"/>
<plugin name="SpotSonnenterrasse" style="mapspot" x="206" y="339" onclick="wait(0.5); loadscene(Sonnenterrasse,null,MERGE,BLEND(1));" onhover="showtext('Sonnenterrasse',hotspottextstyle);"/>

<plugin name="SpotGarten" style="mapspotred" x="54" y="112" onhover="showtext ('Garten',hotspottextstyle);"/>
<plugin name="SpotGarage" style="mapspotred" x="185" y="119" onhover="showtext ('Garage',hotspottextstyle);"/>
<plugin name="SpotLaundry" style="mapspotred" x="176" y="200" onhover="showtext ('Laundry',hotspottextstyle);"/>
<plugin name="SpotMasterBadezimmer1" style="mapspotred" x="28" y="207" onhover="showtext ('Masterbadezimmer Ansicht 1',hotspottextstyle);"/>
<plugin name="SpotMasterBadezimmer2" style="mapspotred" x="28" y="185" onhover="showtext ('Masterbadezimmer Ansicht 2',hotspottextstyle);"/>
<plugin name="SpotMasterBadezimmerWC" style="mapspotred" x="11" y="172" onhover="showtext ('Masterbadezimmer WC',hotspottextstyle);"/>
<plugin name="SpotDurchgang" style="mapspotred" x="183" y="226" onhover="showtext ('Durchgang',hotspottextstyle);"/>
<plugin name="SpotSchlafzimmer4" style="mapspotred" x="201" y="197" onhover="showtext ('Schlafzimmer 4',hotspottextstyle);"/>
<plugin name="SpotBadezimmer3" style="mapspotred" x="212" y="227" onhover="showtext ('Badezimmer 3',hotspottextstyle);"/>
<plugin name="SpotSchlafzimmer3" style="mapspotred" x="200" y="243" onhover="showtext ('Schlafzimmer 3',hotspottextstyle);"/>
<plugin name="SpotSchlafzimmer2" style="mapspotred" x="192" y="296" onhover="showtext ('Schlafzimmer 2',hotspottextstyle);"/>
<plugin name="SpotBadezimmer2" style="mapspotred" x="159" y="290" onhover="showtext ('Badezimmer 2',hotspottextstyle);"/>
<plugin name="SpotTerrasse2" style="mapspotred" x="143" y="332" onhover="showtext ('Terrasse Ansicht 2',hotspottextstyle);"/>
<plugin name="SpotBootsdeck" style="mapspotred" x="161" y="450" onhover="showtext ('Bootsdeck',hotspottextstyle);"/>

<plugin name="activespot" keep="true" url="camicon_active.png" align="center" edge="center"/>

<plugin name="radar" keep="true" devices="flash" url="%SWFPATH%/plugins/radar.swf" editmode="true" parent="activespot" scale="0.5" align="center" edge="center" x="1" y="1" fillalpha="0.5" fillcolor="0x888888" mask="radarmask"/>

<plugin name="radarmask" keep="true" devices="flash" url="plan.png" parent="map" align="lefttop" visible="false" enabled="false"/>


<action name="setz">
set(plugin[SpotEinfahrt].zorder,10);
set(plugin[SpotEingang].zorder,10);
set(plugin[SpotWohnzimmer].zorder,10);
set(plugin[SpotKueche].zorder,10);
set(plugin[SpotMasterschlafzimmer].zorder,10);
set(plugin[SpotTerrasse].zorder,10);
set(plugin[SpotSonnenterrasse].zorder,10);
set(plugin[SpotGarten].zorder,10);
set(plugin[SpotGarage].zorder,10);
set(plugin[SpotLaundry].zorder,10);
set(plugin[SpotMasterBadezimmer1].zorder,10);
set(plugin[SpotMasterBadezimmer2].zorder,10);
set(plugin[SpotMasterBadezimmerWC].zorder,10);
set(plugin[SpotDurchgang].zorder,10);
set(plugin[SpotSchlafzimmer4].zorder,10);
set(plugin[SpotBadezimmer3].zorder,10);
set(plugin[SpotSchlafzimmer3].zorder,10);
set(plugin[SpotSchlafzimmer2].zorder,10);
set(plugin[SpotTerrasse2].zorder,10);
set(plugin[SpotBootsdeck].zorder,10);
</action>

[..]

<scene name="Einfahrt" title="Einfahrt" onstart="" thumburl="panos/Einfahrt.tiles/thumb.jpg" lat="" lng="" heading="0" onstart="setactive();">

<action name="setactive">
set(plugin[activespot].parent, SpotEinfahrt);
set(plugin[radar].heading, 90);
setz(); set(plugin[SpotEinfahrt].zorder,5);

</action>
Gruß

3

Samstag, 14. Dezember 2013, 17:00

Danke EOS1D,
leider komme ich damit nicht weiter.
Ich habe gedacht es gäbe so was ähnliches wie, wenn pano aktiv, so grüner hotspot.
Trotzdem danke,
Lothar

4

Samstag, 14. Dezember 2013, 20:17

Danke EOS1D,
leider komme ich damit nicht weiter.
Ich habe gedacht es gäbe so was ähnliches wie, wenn pano aktiv, so grüner hotspot.
Trotzdem danke,
Lothar
Grundkenntnisse in Javascript, XML und CSS sind für krpano natürlich sehr von Vorteil

$this->cacheCode('[php]','
//Vorgeplänkel:
<style name="mapspot" keep="true" url="camicon.png" parent="map" align="lefttop" edge="center"/> // Entspricht deinem blauen Symbol

<plugin name="SpotEinfahrt" style="mapspot" zorder="10" x="174"
y="10"/> // Setzt das obige Symbol mit x und y Koordinaten auf deine Karte mit einem Z wert von 10 für die dritte Dimension

<plugin name="activespot" keep="true" url="camicon_active.png" align="center" edge="center"/> // Definiert dein gewünschtes grünes Symbol


<plugin name="radar" keep="true" devices="flash"
url="%SWFPATH%/plugins/radar.swf" editmode="true" parent="activespot"
scale="0.5" align="center" edge="center" x="1" y="1" fillalpha="0.5"
fillcolor="0x888888" mask="radarmask"/> // Definiert deine Karte als Elternelement deines grünen Punktes

// Dann noch eine funktionen definieren, die alle blauen Punkte den Z-Wert 10 für die dritte Dimension gibt, hier müssen also alle grünen Punte erfasst sein (ginge sicher eleganter, ist recht faul und schlampig gescriptet)
<action name="setz">

set(plugin[SpotEinfahrt].zorder,10);

set(plugin[SpotEingang].zorder,10);

set(plugin[SpotWohnzimmer].zorder,10);

set(plugin[SpotKueche].zorder,10);

set(plugin[SpotMasterschlafzimmer].zorder,10);

set(plugin[SpotTerrasse].zorder,10);

set(plugin[SpotSonnenterrasse].zorder,10);

set(plugin[SpotGarten].zorder,10);

set(plugin[SpotGarage].zorder,10);

set(plugin[SpotLaundry].zorder,10);

set(plugin[SpotMasterBadezimmer1].zorder,10);

set(plugin[SpotMasterBadezimmer2].zorder,10);

set(plugin[SpotMasterBadezimmerWC].zorder,10);

set(plugin[SpotDurchgang].zorder,10);

set(plugin[SpotSchlafzimmer4].zorder,10);

set(plugin[SpotBadezimmer3].zorder,10);

set(plugin[SpotSchlafzimmer3].zorder,10);

set(plugin[SpotSchlafzimmer2].zorder,10);

set(plugin[SpotTerrasse2].zorder,10);

set(plugin[SpotBootsdeck].zorder,10);

</action>

// Jetzt kommen deine einzelen Scenes und darin jeweils:

<scene name="Einfahrt" title="Einfahrt"
thumburl="panos/Einfahrt.tiles/thumb.jpg" lat="" lng="" heading="0"
onstart="setactive();"> // Beim Starten der Scene die Funktion/Aktion setactive aufrufen

// innerhalb jeder Scene kommt nun die jeweilige setactive() Aktion
<action name="setactive">

set(plugin[activespot].parent, SpotEinfahrt); // den grünen Punkt als Kindelement des Mapunktes setzen, damit der grüne Punkt nun an die stelle des blauen wandert

setz(); // die ominöse setz() Funktion, die nun alle Punkte auf die Z Ebene 10 bringt
set(plugin[SpotEinfahrt].zorder,5); // jetzt dem blauen Punkt den Z wert 5 geben. Da der grüne Punkt oben mit allen anderen den Z Wert 10 bekommen hat, verschwindet nun also der blaue Punkt in der dritten Dimension hinter dem grünen Punkt.

</action>

// Ergebnis: Alle Punkte sind nun blau, nur nich der der Scene in der wir uns gerade befinden, der ist nämlich wie gewünscht grün.
')

Gruß

5

Sonntag, 15. Dezember 2013, 09:35

Hallo EOS1D,
herzlichen dank für deine aufschlußreiche Anleitung.
Ich bin jetzt nach ein paar Stunden herumprobieren ein gutes Stück weiter gekommen :-).
Grüße,
Lothar

6

Sonntag, 15. Dezember 2013, 09:46

Hallo Lothar,

das ist schön zu hören! Wenn Du eine funktionierende tour.xml hast, würde ich die gern mal zum Üben und Lernen sehen. Geht das?

Grüße

Harald

7

Sonntag, 15. Dezember 2013, 11:46

Was kann ich nun aber tun, damit der player weiß, welches Pano gerade aktiv ist.

hallo Lothar,

evtl. sehe ich ja den Wald vor Bäumen nicht. Reicht das Radar nicht für diesen Zweck?

Das Umfärben des Spots würde ich zwar trotzdem ausführen, allerdings permanent, damit der User die bereits besuchten Panos erkennen kann.
Die sollte man, wenn man diesen Ansatz verfolgt, nicht zurück setzen.
// Ergebnis: Alle Punkte sind nun blau, nur nich der der Scene in der wir uns gerade befinden, der ist nämlich wie gewünscht grün.

Fals deine Tour mehrere Etagen hat, musst du dir die besuchten Panos merken, um bei der Rückkehr zu einer Etage den alten Zustand wieder herstellen zu können.

Gruß
Wolf

8

Sonntag, 15. Dezember 2013, 14:30

Hallo EOS1D,
herzlichen dank für deine aufschlußreiche Anleitung.
Ich bin jetzt nach ein paar Stunden herumprobieren ein gutes Stück weiter gekommen :-).
Grüße,
Lothar
Super, das freut mich!
Hallo Lothar,

das ist schön zu hören! Wenn Du eine funktionierende tour.xml hast, würde ich die gern mal zum Üben und Lernen sehen. Geht das?

Grüße

Harald
Harald, damit solltest du gut bedient sein: http://krpano.com/tours/bkeller/


Das Umfärben des Spots würde ich zwar trotzdem ausführen, allerdings permanent, damit der User die bereits besuchten Panos erkennen kann.
Die sollte man, wenn man diesen Ansatz verfolgt, nicht zurück setzen.

Fals deine Tour mehrere Etagen hat, musst du dir die besuchten Panos merken, um bei der Rückkehr zu einer Etage den alten Zustand wieder herstellen zu können.

Gruß
Wolf
Klar, wenn man das verfolgt, kann man diese hässliche setz() Funktion weg lassen.

Mein Ding wäre das aber nicht. Sollen die bereits besuchten erkennbar sein, würde ich da dann noch eine dritte Farbe ins Spiel bringen ;)

9

Montag, 16. Dezember 2013, 06:50

Hallo Lothar,

das ist schön zu hören! Wenn Du eine funktionierende tour.xml hast, würde ich die gern mal zum Üben und Lernen sehen. Geht das?

Hallo Harald, nach ein paar Stunden habe ich noch das automap plugin zur Hilfe genommen. Wenn du die tour.xml trotzdem möchtest, kannst du sie gerne haben.

evtl. sehe ich ja den Wald vor Bäumen nicht. Reicht das Radar nicht für diesen Zweck

Du hast recht Wolf, da bin ich dann auch drauf gekommen :-(.

Jetzt habe ich aber noch ein anderes Problem. Die "onover" und "onout" Funktion, bei dem ich die Karte vergrößern und in der Transparenz ändern möchte funktioniert noch nicht und ich habe keine Ahnung an was es liegen kann. Wenn ich "onover" auf "onhover" ändere, funtioniert die Aktion, aber nicht "onout", dass heißt die Karte bleibt vergrößert.

Hier mein map code:
<map name="map1"
keep="true"
editmode="false"
edge="lefttop"
align="lefttop"
x="20"
y="100"
path="automap/"
map="map_images/map.png"
mask=""
zorder="10"
scale="0.5"
alpha="0.5"
scalechildren="true"
children="true"
radar_alpha="0.5"
radar_visible="true"
point_url="map_images/viewpoint.png"
point_crop="32"
viewpoint_auto="false"
onover="tween(alpha,1.0); tween(scale,1);"
onout="tween(alpha,0.5); tween(scale,0.5);"
onclick=""
>

Außerdem startet das radar plugin erst nachdem ich einen hotspot angeklickt habe.

Danke euch allen für eure Hilfe,
Lothar

Ähnliche Themen

Verwendete Tags

Hotspots, mapspots