# Ground Overlay with gx:LatLonQuad **URL:** \ **Category:** CesiumJS\ **Created:** [May 17, 2016, 12:16pm UTC](https://community.cesium.com/t/ground-overlay-with-gx-latlonquad/4121 "2016-05-17T12:16:59Z")\ **Posts on this page:** 20\ **Page:** 1
**Author:** ![zchira](https://avatars.discourse-cdn.com/v4/letter/z/9de053/32.png) [@zchira](https://community.cesium.com/u/zchira)\ **Post date:** [May 17, 2016, 12:16pm UTC](https://community.cesium.com/t/ground-overlay-with-gx-latlonquad/4121/1 "2016-05-17T12:16:59Z")
Hi to all. Great work with Cesium! Recently we tried many GoogleEarth alternatives (including ArcGis, SharpMap, etc...), but none of them was good enough to replace it. We are still using googleEarth, but the clock is ticking and we decided to try Cesium. For now, it looks very promising! One of the problems we try to solve is to correctly show objects represented with this KML: \   \Overlay\   \0\   \     \[http://127.0.0.1:14499/frame.jpg](http://127.0.0.1:14499/frame.jpg)\     \0.75\   \   \     \       -125.7948791,31.7647378,0       -125.7948905,31.7663583,0       -125.7995141,31.7679331,0       -125.7984818,31.7645867,0       -125.7948791,31.7647378,0     \   \ \ What is correctly shown in cesium: 1. gx:LatLonQuad is shown properly 2. Icon/href image is also retrieved (CORS is enabled on the server) What's wrong: 1. Icon/href is not shown correctly. It looks like it is cropped instead of transformed. I know that in the current KML implementation this specific feature is not implemented. Are there some workarounds that may help me to achieve this goal (to show the image on gx:LatLonQuad), and which would be the best? ---
**Author:** ![hannah](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/hannah/32/4509_2.png) [@hannah](https://community.cesium.com/u/hannah)\ **Post date:** [May 17, 2016, 3:39pm UTC](https://community.cesium.com/t/ground-overlay-with-gx-latlonquad/4121/2 "2016-05-17T15:39:04Z")
Hello, Glad to hear you’re liking Cesium so far! For your issue, would you be able to post a screenshot of what you expect it to look like and what it looks like in Cesium? That will help me give recommendations to achieve what you’re looking for. Thanks, Hannah ---
**Author:** ![zchira](https://avatars.discourse-cdn.com/v4/letter/z/9de053/32.png) [@zchira](https://community.cesium.com/u/zchira)\ **Post date:** [May 18, 2016, 9:07am UTC](https://community.cesium.com/t/ground-overlay-with-gx-latlonquad/4121/3 "2016-05-18T09:07:33Z")
Hello, Hannah, Thank you for the quick response. Here is the screenshot made in google earth with correctly shown kml: [http://s32.postimg.org/q6scdxldx/ge\_example.png](http://s32.postimg.org/q6scdxldx/ge_example.png) and here is the same kml in cesium: [http://s32.postimg.org/ihmru3n2d/cz\_example.png](http://s32.postimg.org/ihmru3n2d/cz_example.png) Here is the whole kml file content: \   \     \Overlay\     \1\     \       \test\_frame.jpg\       \0.75\     \     \       \        -121.7948791,36.7647378,0        -121.7948905,36.7663583,0        -121.7995141,36.7679331,0        -121.7984818,36.7645867,0        -121.7948791,36.7647378,0       \     \   \ \ and this is test\_frame.jpg [http://s32.postimg.org/gly5dg2h1/test\_frame.jpg](http://s32.postimg.org/gly5dg2h1/test_frame.jpg) ---
**Author:** ![Scott\_Reynolds](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/scott_reynolds/32/2014_2.png) [@Scott\_Reynolds](https://community.cesium.com/u/Scott_Reynolds)\ **Post date:** [May 18, 2016, 12:01pm UTC](https://community.cesium.com/t/ground-overlay-with-gx-latlonquad/4121/4 "2016-05-18T12:01:54Z")
You are seeing a known limitation of the KML processor in Cesium which I’m seeing reported in the browser console as: > KML - gx:LatLonQuad Icon does not support texture projection. Correcting this is on the to do list ([KML Support · Issue #873 · CesiumGS/cesium · GitHub](https://github.com/AnalyticalGraphicsInc/cesium/issues/873)), but I can’t say when it will be done. Scott P.S. Your LatLonQuad has too many coordinates (five). ---
**Author:** ![zchira](https://avatars.discourse-cdn.com/v4/letter/z/9de053/32.png) [@zchira](https://community.cesium.com/u/zchira)\ **Post date:** [May 18, 2016, 12:29pm UTC](https://community.cesium.com/t/ground-overlay-with-gx-latlonquad/4121/5 "2016-05-18T12:29:26Z")
Thanks for the response. I know for that limitation. Is there some workaround that will allow me to achieve the same result as in GoogleEarth? Maybe by using CZML, or some custom geometry, or writing some custom shader/renderer, or something else? ---
**Author:** ![hannah](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/hannah/32/4509_2.png) [@hannah](https://community.cesium.com/u/hannah)\ **Post date:** [May 18, 2016, 2:00pm UTC](https://community.cesium.com/t/ground-overlay-with-gx-latlonquad/4121/6 "2016-05-18T14:00:01Z")
Unfortunately, I don’t think there is any easy workaround for this. You would need to implement a custom geometry type that generates the correct texture coordinates, then you would need to connect that type through the entity API and finally modify KmlDataSource to use the new type. If you would like more information about how to implement this, I can point you to some resources. -Hannah ---
**Author:** ![zchira](https://avatars.discourse-cdn.com/v4/letter/z/9de053/32.png) [@zchira](https://community.cesium.com/u/zchira)\ **Post date:** [May 18, 2016, 2:42pm UTC](https://community.cesium.com/t/ground-overlay-with-gx-latlonquad/4121/7 "2016-05-18T14:42:01Z")
We made some complicated workaround. We warped input image in the way it fits to the groundOverlay in the same way as in googleEarth. After transformation our image looks like: [http://s32.postimg.org/5h6jitcat/test\_frame\_warped.png](http://s32.postimg.org/5h6jitcat/test_frame_warped.png) That works, but it isn't elegant solution because we had to add another layer of abstraction that changes our input image. There are few of us here that are willing to try to implement at least a custom geometry type with correct texture coordinates (we don't explicitly need to do this through the kml), so any additional information and resources are welcome 🙂 ---
**Author:** ![hannah](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/hannah/32/4509_2.png) [@hannah](https://community.cesium.com/u/hannah)\ **Post date:** [May 18, 2016, 6:06pm UTC](https://community.cesium.com/t/ground-overlay-with-gx-latlonquad/4121/8 "2016-05-18T18:06:28Z")
Great! Glad you were able to make that work for now. So to get a general idea of how the geometry and appearances layer works as a whole, start by reading this tutorial: [http://cesiumjs.org/tutorials/Geometry-and-Appearances/](http://cesiumjs.org/tutorials/Geometry-and-Appearances/) I started writing a tutorial about creating a custom geometry type here: [https://github.com/AnalyticalGraphicsInc/cesium/wiki/Geometry-and-Appearances](https://github.com/AnalyticalGraphicsInc/cesium/wiki/Geometry-and-Appearances) Some of the code samples may be outdated, but the concepts should still be the same Take a look at the code for RectangleGeometry: [https://github.com/AnalyticalGraphicsInc/cesium/blob/master/Source/Core/RectangleGeometry.js](https://github.com/AnalyticalGraphicsInc/cesium/blob/master/Source/Core/RectangleGeometry.js) If you need the latlonqad to curve to the surface of the globe, you’ll probably want to tesselate it in a similar way, just instead of iterating on lat/lon degrees you’ll probably want to interpolate between points using an [EllipsoidGeodesic](http://cesiumjs.org/Cesium/Build/Documentation/EllipsoidGeodesic.html). You might be able to compute the ‘st’ texture coordinates the same way. The code for finding the normals/tangents/binormals should be similar as well. If you haven’t already, take a look at our [Contributors Documentation](https://github.com/AnalyticalGraphicsInc/cesium/tree/master/Documentation/Contributors). This includes a [Build Guide](https://github.com/AnalyticalGraphicsInc/cesium/tree/master/Documentation/Contributors/BuildGuide) with instructions for pulling down and running the code You’ll be able to see examples for how to use your new geometry type when you’re running the code locally. In Sandcastle, you’ll see a ‘Development’ tab with examples like this one: [http://cesiumjs.org/cesium/Apps/Sandcastle/index.html?src=development/Rectangle.html&label=Development](http://cesiumjs.org/cesium/Apps/Sandcastle/index.html?src=development/Rectangle.html&label=Development) Let me know if you have any questions! Once you get this part of it working, I can point you to more resources for connecting it to the KmlDataSource. -Hannah ---
**Author:** ![Nikos\_Bogdos](https://avatars.discourse-cdn.com/v4/letter/n/d26b3c/32.png) [@Nikos\_Bogdos](https://community.cesium.com/u/Nikos_Bogdos)\ **Post date:** [February 13, 2017, 4:05pm UTC](https://community.cesium.com/t/ground-overlay-with-gx-latlonquad/4121/9 "2017-02-13T16:05:05Z")
Hello, reviving this as I want to know if there are any new developments in this area. I'm trying to visualizes some ground overlays which we used to overlay using google earth. Cesium doesn't seem to apply any rotation. Bellow is an example where you can see that the image inside the box isn't rotated as it should: [https://dl.dropboxusercontent.com/u/10965353/Screen%20Shot%202017-02-13%20at%2018.00.03.jpg](https://dl.dropboxusercontent.com/u/10965353/Screen%20Shot%202017-02-13%20at%2018.00.03.jpg) ---
**Author:** ![hannah](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/hannah/32/4509_2.png) [@hannah](https://community.cesium.com/u/hannah)\ **Post date:** [February 13, 2017, 4:15pm UTC](https://community.cesium.com/t/ground-overlay-with-gx-latlonquad/4121/10 "2017-02-13T16:15:17Z")
Sorry, dropbox is blocked from my network so I can’t see the image. Can you attach it or insert it into the forum post instead? -Hannah ---
**Author:** ![Nikos\_Bogdos](https://avatars.discourse-cdn.com/v4/letter/n/d26b3c/32.png) [@Nikos\_Bogdos](https://community.cesium.com/u/Nikos_Bogdos)\ **Post date:** [February 13, 2017, 5:38pm UTC](https://community.cesium.com/t/ground-overlay-with-gx-latlonquad/4121/11 "2017-02-13T17:38:33Z")
Τη Δευτέρα, 13 Φεβρουαρίου 2017 - 6:15:17 μ.μ. UTC+2, ο χρήστης Hannah Pinkos έγραψε: > Sorry, dropbox is blocked from my network so I can't see the image. Can you attach it or insert it into the forum post instead? > > -Hannah > > On Monday, February 13, 2017 at 11:05:06 AM UTC-5, nikos....@gmail.com wrote:Hello, > reviving this as I want to know if there are any new developments in this area. I'm trying to visualizes some ground overlays which we used to overlay using google earth. Cesium doesn't seem to apply any rotation. Bellow is an example where you can see that the image inside the box isn't rotated as it should: > [https://dl.dropboxusercontent.com/u/10965353/Screen%20Shot%202017-02-13%20at%2018.00.03.jpg](https://dl.dropboxusercontent.com/u/10965353/Screen%20Shot%202017-02-13%20at%2018.00.03.jpg) I tried to find an attach button but I still do not see it. Here's a link that should work though. Notice that the image/layer isn't rotated inside the box. [http://citisens.eu/rotation.jpg](http://citisens.eu/rotation.jpg) ---
**Author:** ![hannah](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/hannah/32/4509_2.png) [@hannah](https://community.cesium.com/u/hannah)\ **Post date:** [February 13, 2017, 7:14pm UTC](https://community.cesium.com/t/ground-overlay-with-gx-latlonquad/4121/12 "2017-02-13T19:14:43Z")
Ah okay. The best way to do this would be with a Rectangle entity with a rotation. You can see an example here: [http://cesiumjs.org/Cesium/Apps/Sandcastle/index.html?src=Rectangle.html&label=Geometries](http://cesiumjs.org/Cesium/Apps/Sandcastle/index.html?src=Rectangle.html&label=Geometries) We don’t currently have support for LatLonQuads, but we have an issue written up to add support here: [https://github.com/AnalyticalGraphicsInc/cesium/issues/4164](https://github.com/AnalyticalGraphicsInc/cesium/issues/4164) -Hannah ---
**Author:** ![Nikos\_Bogdos](https://avatars.discourse-cdn.com/v4/letter/n/d26b3c/32.png) [@Nikos\_Bogdos](https://community.cesium.com/u/Nikos_Bogdos)\ **Post date:** [February 13, 2017, 8:04pm UTC](https://community.cesium.com/t/ground-overlay-with-gx-latlonquad/4121/13 "2017-02-13T20:04:46Z")
Hannah, thanks for your input. I still cannot figure out how could I fit the pictured overlay inside the background box by defining just two points/corners. Rotation messes up with the overlay’s corners and they do not align with the box corners. ![Screen Shot 2017-02-13 at 21.59.47.jpg](https://global.discourse-cdn.com/cesium/original/2X/6/60d55e9abd5235c260e8a56b6f5759899a3fa651.jpeg) Nikos ---
**Author:** ![Nikos\_Bogdos](https://avatars.discourse-cdn.com/v4/letter/n/d26b3c/32.png) [@Nikos\_Bogdos](https://community.cesium.com/u/Nikos_Bogdos)\ **Post date:** [February 15, 2017, 4:36am UTC](https://community.cesium.com/t/ground-overlay-with-gx-latlonquad/4121/14 "2017-02-15T04:36:29Z")
I decided that one path forward is to stop using rotations altogether until gx:LatLonQuad is supported fully by Cesium. My problem now is that although the screen overlay displays OK when terrain view is disabled, when I enable a terrainProvider the overlay isn't clamped to the ground despite setting the clampedToGround option to true in the KmlDataSource.load options. I tried this with other types of KMLs that we use (vector types, polygons, etc.) and the problem remains. Please tell me that I'm doing something wrong and that the "clamped to ground" functionality is supported is some way. ---
**Author:** ![hannah](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/hannah/32/4509_2.png) [@hannah](https://community.cesium.com/u/hannah)\ **Post date:** [February 15, 2017, 3:10pm UTC](https://community.cesium.com/t/ground-overlay-with-gx-latlonquad/4121/15 "2017-02-15T15:10:44Z")
Make sure you’re using the clampToGround option for the KmlDataSource: viewer.dataSources.add(Cesium.KmlDataSource.load(’…/…/SampleData/kml/facilities/facilities.kml’, { camera : viewer.scene.camera, canvas : viewer.scene.canvas, clampToGround: true })); If you are doing that and your entities are still not clamped to ground, could you put together a sample KML file that reproduces the problem? Thanks, Hannah ---
**Author:** ![Nikos\_Bogdos](https://avatars.discourse-cdn.com/v4/letter/n/d26b3c/32.png) [@Nikos\_Bogdos](https://community.cesium.com/u/Nikos_Bogdos)\ **Post date:** [February 15, 2017, 7:02pm UTC](https://community.cesium.com/t/ground-overlay-with-gx-latlonquad/4121/16 "2017-02-15T19:02:25Z")
Yes I tried this but it didn’t work. To replicate the issue use this code snippet: > var terrainProvider = new Cesium.CesiumTerrainProvider({ > url : '[https://assets.agi.com/stk-terrain/world’](https://assets.agi.com/stk-terrain/world'), > requestVertexNormals : true > }); > var viewer = new Cesium.Viewer(‘cesiumContainer’, { > baseLayerPicker : false, > terrainProvider : terrainProvider > }); > var options = { > camera : viewer.scene.camera, > canvas : viewer.scene.canvas, > clampToGround : true > }; > viewer.dataSources.add(Cesium.KmlDataSource.load('[https://dl.dropboxusercontent.com/u/10965353/slope.kml’](https://dl.dropboxusercontent.com/u/10965353/slope.kml'), options)); I also attach the KML file just in case. [slope.kml](https://community.cesium.com/uploads/short-url/36q9qS5l2cGHge2mIxh1u970Rz2.kml) (492 Bytes) ![slope.png](https://global.discourse-cdn.com/cesium/original/2X/f/f162e5ae59c9780cda66c0b3ff55ddd9c3aa9afd.png) ---
**Author:** ![Nikos\_Bogdos](https://avatars.discourse-cdn.com/v4/letter/n/d26b3c/32.png) [@Nikos\_Bogdos](https://community.cesium.com/u/Nikos_Bogdos)\ **Post date:** [February 22, 2017, 3:12pm UTC](https://community.cesium.com/t/ground-overlay-with-gx-latlonquad/4121/17 "2017-02-22T15:12:22Z")
Τη Τετάρτη, 15 Φεβρουαρίου 2017 - 5:10:44 μ.μ. UTC+2, ο χρήστης Hannah Pinkos έγραψε: > Make sure you're using the clampToGround option for the KmlDataSource: > > viewer.dataSources.add(Cesium.KmlDataSource.load('../../SampleData/kml/facilities/facilities.kml', { > > ``` > camera : viewer\.scene\.camera, > canvas : viewer\.scene\.canvas, > clampToGround: true > > ``` > > })); > > If you are doing that and your entities are still not clamped to ground, could you put together a sample KML file that reproduces the problem? > > Thanks, > > Hannah > > On Tuesday, February 14, 2017 at 11:36:29 PM UTC-5, nikos....@gmail.com wrote:I decided that one path forward is to stop using rotations altogether until gx:LatLonQuad is supported fully by Cesium. > My problem now is that although the screen overlay displays OK when terrain view is disabled, when I enable a terrainProvider the overlay isn't clamped to the ground despite setting the clampedToGround option to true in the KmlDataSource.load options. I tried this with other types of KMLs that we use (vector types, polygons, etc.) and the problem remains. > Please tell me that I'm doing something wrong and that the "clamped to ground" functionality is supported is some way. Hi Hannah, did you notice the problem using the files I gave you? I have the same problem when using KMLs containing polygon coordinates (no overlays). The polygons are still not clamped to the ground even when I use the clampedToGround option. ---
**Author:** ![hannah](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/hannah/32/4509_2.png) [@hannah](https://community.cesium.com/u/hannah)\ **Post date:** [February 22, 2017, 6:55pm UTC](https://community.cesium.com/t/ground-overlay-with-gx-latlonquad/4121/18 "2017-02-22T18:55:44Z")
Sorry, I forgot to take a look at this before. Thanks for reminding me. The problem is because we currently do not have ground clamping support for geometry with an image material. Geometry can only clamp to ground if it has a color material. I created an issue here so we can keep track of the number of users asking for this: [https://github.com/AnalyticalGraphicsInc/cesium/issues/5025](https://github.com/AnalyticalGraphicsInc/cesium/issues/5025) Best, Hannah ---
**Author:** ![Nikos\_Bogdos](https://avatars.discourse-cdn.com/v4/letter/n/d26b3c/32.png) [@Nikos\_Bogdos](https://community.cesium.com/u/Nikos_Bogdos)\ **Post date:** [February 22, 2017, 7:30pm UTC](https://community.cesium.com/t/ground-overlay-with-gx-latlonquad/4121/19 "2017-02-22T19:30:43Z")
Thanks for the issue report. As I said in my previous email the problem exists not only for image materials but for polygons as well. Try to visualise the attached KML with terrain ON and watch the polygon positions drift when tilting the camera view despite setting _clampToGround: true_. Best, Nikos [fireProb-3.kml](https://community.cesium.com/uploads/short-url/yHBnSPwGIO47yZfBOJCCzFJrzbl.kml) (142 KB) ---
**Author:** ![hannah](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/hannah/32/4509_2.png) [@hannah](https://community.cesium.com/u/hannah)\ **Post date:** [February 22, 2017, 7:47pm UTC](https://community.cesium.com/t/ground-overlay-with-gx-latlonquad/4121/20 "2017-02-22T19:47:07Z")
Ground clamping worked fine for that file. Here is the code I used: var viewer = new Cesium.Viewer(‘cesiumContainer’); var options = { camera : viewer.scene.camera, canvas : viewer.scene.canvas, clampToGround: true }; var ds = viewer.dataSources.add(Cesium.KmlDataSource.load(’…/…/SampleData/kml/fireProb-3.kml’, options)); viewer.zoomTo(ds); `` If that doesn’t work, what version of Cesium are you using? Make sure you are using the latest version. And what OS and browser are you using? -Hannah [Next page](https://community.cesium.com/t/ground-overlay-with-gx-latlonquad/4121.md?page=2)