KmlDataSource.load() - how to get clampToGround working?

[maxdown...@gmail.com]

Hey guys!

I'm puzzling something together based on the Sandcastle KML bike ride example. I got most of it working, except how to get the KML path stick to the terrain surface. The KML is exported straight out of GE, and has times embedded. See data at the bottom of this post (I've shortened it a bit).

The code I'm using is this:

var viewer = new Cesium.Viewer('cesiumContainer');
viewer.terrainProvider = new Cesium.CesiumTerrainProvider({
url : 'https://assets.agi.com/stk-terrain/v1/tilesets/world/tiles'
});
viewer.scene.globe.depthTestAgainstTerrain = true;

var options = {
camera : viewer.scene.camera,
canvas : viewer.scene.canvas,
clampToGround : true
};
viewer.dataSources.add(Cesium.KmlDataSource.load('../myFile.kml', options))
.then(function(dataSource){
//do stuff
});

Yet the KML path is sunken into the ground and only now and then bits pop out of the terrain surface. Can anyone point me into the right direction how to get this to work? I have also tried it with removing the Z component from the KML file, as suggested in some posts, but that made it actually worse.

Thanks for your help,
Max

<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://www.opengis.net/kml/2.2" xmlns:gx="http://www.google.com/kml/ext/2.2" xmlns:kml="http://www.opengis.net/kml/2.2" xmlns:atom="http://www.w3.org/2005/Atom">
<Document>
<name>GPS device</name>
<snippet>Created 08/04/17 13:59:44</snippet>
<LookAt>
<gx:TimeSpan>
<begin>2016-12-05T19:00:00Z</begin>
<end>2016-12-05T19:46:08Z</end>
</gx:TimeSpan>
<longitude>172.116292</longitude>
<latitude>-41.665269</latitude>
<altitude>0</altitude>
<heading>0</heading>
<tilt>0</tilt>
<range>43678.030155</range>
</LookAt>
<Style id="multiTrack_n">
...
</Style>
<Folder>
<name>Tracks</name>
<Placemark id="tour">
<name>MyTrack</name>
<styleUrl>#multiTrack</styleUrl>
<gx:Track>
<when>2016-12-05T19:00:00Z</when>
<when>2016-12-05T19:00:02.8Z</when>
<when>2016-12-05T19:00:04.41Z</when>
...
<gx:coord>172.01701 -41.554678 27.57</gx:coord>
<gx:coord>172.017208 -41.553992 28.6</gx:coord>
<gx:coord>172.01754 -41.553676 29.92</gx:coord>
...
</gx:Track>
</Placemark>
</Folder>
</Document>
</kml>

[Rachel Hwang]

Hi there,

Try iterating through your datasource after load (http://cesiumjs.org/Cesium/Apps/Sandcastle/index.html?src=GeoJSON%20and%20TopoJSON.html&label=Showcases) and setting height to undefined. If height is set, clamping is disabled.

Best,

- Rachel

[Victor]

Hi Max,

Sorry I can't offer any help here. But I'm trying to generate paths in KML for Cesium to show. I assume when you said "GE" you meant "Google Earth". I created a path from VSIM to Parliament Hill (I work in Ottawa) in Google Earth Pro, and exported a kml file of the route. However, there is no time embedded, and the coordinates are not inside the <gx:coord> tags. All I have are turn instructions with comma-separated coordinates, and of course Cesium doesn't read them. How did you create your kml file?

Here are the first 7x lines in the file. I've also attached the file here for your reference. Thanks for your help!

-victor

<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://www.opengis.net/kml/2.2" xmlns:gx="http://www.google.com/kml/ext/2.2" xmlns:kml="http://www.opengis.net/kml/2.2" xmlns:atom="http://www.w3.org/2005/Atom">

<Folder id="results">
 <name>Route from VSIM to Parliament Hill</name>
 <open>1</open>
 <Style id="dir_step">
 <IconStyle>
 <Icon>
 <href>http://maps.gstatic.com/mapfiles/kml/paddle/pause.png</href>
 </Icon>
 </IconStyle>
 <BalloonStyle>
 <text><![CDATA[<div>$[description]</div><div>$[geDirections]</div>]]></text>
 <textColor>ff000000</textColor>
 <displayMode>default</displayMode>
 </BalloonStyle>
 </Style>
 <Placemark id="1.1">
 <name>VSIM Building</name>
 <address>VSIM (Visualization, Simulation and Modeling)</address>
 <styleUrl>#dir_startpoint</styleUrl>
 <Point>
 <coordinates>-75.7002,45.380532,0</coordinates>
 </Point>
 </Placemark>
 <Placemark id="1.2">
 <name>Parliament Hill</name>
 <address>Parliament Hill</address>
 <styleUrl>#dir_endpoint</styleUrl>
 <Point>
 <coordinates>-75.700929,45.4235937,0</coordinates>
 </Point>
 </Placemark>
 <Folder id="1.3">
 <name>Route</name>
 <Style id="dir_route">
 <LineStyle>
 <color>7fa00000</color>
 <colorMode>normal</colorMode>
 <width>6</width>
 </LineStyle>
 </Style>
 <Placemark id="1.3.2.2.2">
 <name>Head north on Library Rd</name>
 <description>Head north on Library Rd</description>
 <LookAt>
 <longitude>-75.7009376</longitude>
 <latitude>45.3805352</latitude>
 <altitude>0</altitude>
 <heading>2.0845308</heading>
 <tilt>45</tilt>
 <range>360</range>
 </LookAt>
 <styleUrl>#dir_step</styleUrl>
 <Region>
 <LatLonAltBox>
 <north>45.48053520000001</north>
 <south>45.2805352</south>
 <east>-75.60093760000001</east>
 <west>-75.8009376</west>
 <minAltitude>0</minAltitude>
 <maxAltitude>0</maxAltitude>
 <altitudeMode>absolute</altitudeMode>
 </LatLonAltBox>
 <Lod>
 <minLodPixels>512</minLodPixels>
 <maxLodPixels>-1</maxLodPixels>
 <minFadeExtent>0</minFadeExtent>
 <maxFadeExtent>0</maxFadeExtent>
 </Lod>
 </Region>
 <gx:balloonVisibility>1</gx:balloonVisibility>
 <Point>
 <coordinates>-75.7009376,45.3805352,0</coordinates>
 </Point>
 </Placemark>
...