Animation of KML placemarks and description possible within KML only (Google Earth Tour)?

StackOverflow https://stackoverflow.com/questions/18400251

  •  26-06-2022
  •  | 
  •  

Question

I'm dealing with animating a placemark and its description/label in a Google Earth Tour. So far I've accomplished animation of a placemark's tooltip ballon via

<gx:AnimatedUpdate>
    <gx:duration>0.0</gx:duration>
    <Update>
      <targetHref/>
      <Change>
        <Placemark targetId="placemarkpin1">
          <gx:balloonVisibility>1</gx:balloonVisibility>
        </Placemark>
      </Change>
    </Update>
  </gx:AnimatedUpdate>

But trying the same with a placemark and its description aka label (as in this tour it would make sense to show the placemark at the end) doesn't seem to work:

  <gx:AnimatedUpdate>
    <gx:duration>1.0</gx:duration>
    <Update>
      <targetHref></targetHref>
      <Change>
        <IconStyle targetId="pushpin-placemark_normalstate">
          <scale>1.0</scale>
        </IconStyle>
        <LabelStyle targetId="pushpin-placemark_normalstate">
          <scale>1.0</scale>
        </LabelStyle>
      </Change>
    </Update>
  </gx:AnimatedUpdate>

scale is per definition at beginning at 0.0 The both animations are in two separate gx:AnimatedUpdate siblings one after the other at the end of the tour.

I can only work in the KML file, there's no possibility to add JS in this project.

Was it helpful?

Solution

Use unique ids for both the IconStyle and LabelStyle tags and refer to these in the targetHref for updates.

Note: Multiple changes can appear in a single <Change> element (as you have in your original example) or each can be wrapped in its own Change element as children of the <Update> element (as shown below).

 <Style id="pushpin">
      <IconStyle id="myiconstyle">
        ...
      </IconStyle>
      <LabelStyle id="mylabelstyle">
        ...
      </LabelStyle>
 </Style>

 <gx:AnimatedUpdate>
    <gx:duration>1.0</gx:duration>
    <Update>
      <targetHref></targetHref>
      <Change>
        <IconStyle targetId="myiconstyle">
          <scale>1.0</scale>
        </IconStyle>
      </Change>
      <Change>
        <LabelStyle targetId="mylabelstyle">
          <scale>1.0</scale>
        </LabelStyle>
      </Change>
    </Update>
  </gx:AnimatedUpdate>

You can find a complete example with a working tour doing exactly this here: http://googlegeodevelopers.blogspot.com/2009/04/tours-in-kml-animating-camera-and.html

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top