# Clamping Czml polyline to terrain

**URL:** <https://community.cesium.com/t/clamping-czml-polyline-to-terrain/8729>\
**Category:** CesiumJS\
**Created:** [October 7, 2019, 7:01am UTC](https://community.cesium.com/t/clamping-czml-polyline-to-terrain/8729 "2019-10-07T07:01:07Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![Adam\_Roy](https://avatars.discourse-cdn.com/v4/letter/a/bcef8e/32.png) [@Adam\_Roy](https://community.cesium.com/u/Adam_Roy)\
**Post date:** [October 7, 2019, 7:01am UTC](https://community.cesium.com/t/clamping-czml-polyline-to-terrain/8729/1 "2019-10-07T07:01:07Z")

</div>

**Hi all,**

**I have a CZML track I’m trying to clamp to terrain, and I’m not having a lot of luck. See the code (with big blocks of coordinates removed for readability) at the bottom of this message. This CZML file generates a point and a line; as written, the code clamps the point to the ground, but not the polyline. Screenshot attached for reference. Any idea what I’m doing wrong?**

**CZML:**

**[{“id”: “document”, “name”: “Demo”, “version”: “1.0”,**

**"author": “Adam”, “clock”: {“interval”:**

**"2019-08-28T01:14:42+00:00/2019-09-02T14:50:51+00:00", “currentTime”:**

**"2019-08-28T01:14:42+00:00", “multiplier”: 10}}, {“id”: “path”,**

**"availability":**

**"2019-08-28T01:14:42+00:00/2019-09-02T14:50:51+00:00", “position”:**

**{“epoch”: “2019-08-28T01:14:42+00:00”, “cartographicDegrees”: [0,**

**-71.021238, 44.485148, 914.9, 7.0,**

**/_A LOT OF NUMBERS HERE_/**

**-68.921541, 45.904477, 1584.7, 480969.0, -68.921516, 45.904461,**

**1584.0]}, “path”: {“material”: {“polylineOutline”: {“color”: {“rgba”:**

**[255, 255, 255, 200]}, “outlineColor”: {“rgba”: [0, 173, 253, 200]},**

**"outlineWidth": 5, “heightReference”:**

**"CLAMP\_TO\_GROUND"}}, “width”: 6, “leadTime”: 0, “trailTime”: 519000,**

**"resolution": 5}}, {“id”: “Point”, “availability”:**

**"2019-08-28T01:14:42+00:00/2019-09-02T14:50:51+00:00", “position”:**

**{“epoch”: “2019-08-28T01:14:42+00:00”, “cartographicDegrees”: [0,**

**-71.021238, 44.485148, 30, 7.0,**

**/_A LOT OF NUMBERS HERE_/**

**480966.0, -68.921541, 45.904477, 30, 480969.0,**

**-68.921516, 45.904461, 30]}, “point”: {“color”: {“rgba”: [255, 255,**

**255, 255]}, “outlineColor”: {“rgba”: [0, 173, 253, 255]},**

**"outlineWidth": 6, “pixelSize”: 8, “heightReference”:**

**"CLAMP\_TO\_GROUND"}}]**

 ![Screen Shot 2019-10-07 at 12.52.51 AM.jpg](https://global.discourse-cdn.com/cesium/original/1X/c65598ac1ea52bd43d0db2215a96169afbb75b1c.jpeg)

---

<div class="post-metadata">

**Author:** ![omar](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/omar/32/1999_2.png) [@omar](https://community.cesium.com/u/omar)\
**Post date:** [October 8, 2019, 7:20pm UTC](https://community.cesium.com/t/clamping-czml-polyline-to-terrain/8729/2 "2019-10-08T19:20:07Z")

</div>

You need to actually set the clampToGround property, not just set the height reference to clamp to ground, like in this example:

> **[Cesium Sandcastle](https://sandcastle.cesium.com/?src=CZML%20Polyline.html)**
>
> The Cesium Sandcastle provides an interactive environment for testing Cesium code.

This is because while a point can be clamped just by moving the whole entity to the right height, a polyline is clamped by clamping every position along its path and interpolating. So it’s the difference between putting the center of the line on the ground vs bending the whole line.

---

<div class="post-metadata">

**Author:** ![Adam\_Roy](https://avatars.discourse-cdn.com/v4/letter/a/bcef8e/32.png) [@Adam\_Roy](https://community.cesium.com/u/Adam_Roy)\
**Post date:** [October 8, 2019, 8:44pm UTC](https://community.cesium.com/t/clamping-czml-polyline-to-terrain/8729/3 "2019-10-08T20:44:10Z")

</div>

Thanks, Omar. Still no luck, unfortunately. Here’s the relevant section of code—am I still doing something wrong?

…-68.921541, 45.904477, 1584.7, 480969.0, -68.921516, 45.904461,

1584.0]}, “path”: {“material”: {“polylineOutline”: {“color”: {“rgba”:

[255, 255, 255, 200]}, “outlineColor”: {“rgba”: [0, 173, 253, 200]},

“outlineWidth”: 5, “clampToGround” : true}}, “width”: 6, “leadTime”: 0, “trailTime”: 519000,

“resolution”: 5}}

``

---

<div class="post-metadata">

**Author:** ![omar](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/omar/32/1999_2.png) [@omar](https://community.cesium.com/u/omar)\
**Post date:** [October 8, 2019, 8:55pm UTC](https://community.cesium.com/t/clamping-czml-polyline-to-terrain/8729/4 "2019-10-08T20:55:42Z")

</div>

Are you able to share a sample that reproduces the issue on Sandcastle? Is the red line in your screenshot clamped to ground? How is that constructed?

You could also try creating the polyline directly with the Entity API to see if that works and help you narrow down where the issue might be.

---

<div class="post-metadata">

**Author:** ![Adam\_Roy](https://avatars.discourse-cdn.com/v4/letter/a/bcef8e/32.png) [@Adam\_Roy](https://community.cesium.com/u/Adam_Roy)\
**Post date:** [October 8, 2019, 9:12pm UTC](https://community.cesium.com/t/clamping-czml-polyline-to-terrain/8729/5 "2019-10-08T21:12:20Z")

</div>

Would a Glitch project work? Here’s the thing in action: [https://glitch.com/edit/#!/noted-numismatist?path=at-demo.czml:20227:45](https://glitch.com/edit/#!/noted-numismatist?path=at-demo.czml:20227:45)

The red line is clamped to ground. It’s actually derived from exactly the same GPX file, just static rather than animated. The difference is that the red line was converted to GeoJSON and imported as such. Here’s the relevant code:

/_load AT path as linestring from GeoJSON_/

viewer.dataSources.add(

Cesium.GeoJsonDataSource.load(“path.geojson”, {

stroke: Cesium.Color.RED,

fill: Cesium.Color.RED,

strokeWidth: 4,

clampToGround: true,

scaleByDistance: { nearFarScalar: [1.0, 2.0, 10000.0, 0.0] }

})

);

``

Because I need the blue line to animate, I converted it to a CZML file and imported it with CzmlDataSource. Here’s the code snippet that imports it and tracks the point:

/_import and track animated path_/  
viewer.dataSources

.add(Cesium.CzmlDataSource.load(czml))

.then(function(ds) {

viewer.trackedEntity = ds.entities.getById(“Point”);

});

``

Does that make sense?

I actually, ideally, would like to set the animated line’s height to some nominal value (~1 meter above terrain) because I’d like it to cover the red line as it progresses.

---

<div class="post-metadata">

**Author:** ![omar](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/omar/32/1999_2.png) [@omar](https://community.cesium.com/u/omar)\
**Post date:** [October 9, 2019, 5:06pm UTC](https://community.cesium.com/t/clamping-czml-polyline-to-terrain/8729/6 "2019-10-09T17:06:49Z")

</div>

Thanks for the Glitch project! So the issue is “clampToGround” is only a property on polyline, not paths. Paths don’t currently support clamping to ground, but there’s a GitHub issue for this feature request:

[https://github.com/AnalyticalGraphicsInc/cesium/issues/7133](https://github.com/AnalyticalGraphicsInc/cesium/issues/7133)

I think a workaround might either be computing the terrain heights ahead of time and embedding them in the CZML file (perhaps using [https://cesiumjs.org/Cesium/Build/Documentation/sampleTerrainMostDetailed.html](https://cesiumjs.org/Cesium/Build/Documentation/sampleTerrainMostDetailed.html)), or since the polyline already computes the heights for the whole path upfront at runtime, extracting those positions and using them on the path could also work (although that might require some digging through private functions since the entity API doesn’t expose this).

---

<div class="post-metadata">

**Author:** ![Adam\_Roy](https://avatars.discourse-cdn.com/v4/letter/a/bcef8e/32.png) [@Adam\_Roy](https://community.cesium.com/u/Adam_Roy)\
**Post date:** [October 9, 2019, 5:33pm UTC](https://community.cesium.com/t/clamping-czml-polyline-to-terrain/8729/7 "2019-10-09T17:33:19Z")

</div>

Thanks, Omar! Good to know. I think fixing the height data is probably going to be the way to go, then.