Ground Overlay with gx:LatLonQuad

[zch...@gmail.com]

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:

<GroundOverlay id="a6925dcd-9c68-437a-9e90-8167a178c0e9">
<name>Overlay</name>
<visibility>0</visibility>
<Icon>
<href>http://127.0.0.1:14499/frame.jpg</href>
<viewBoundScale>0.75</viewBoundScale>
</Icon>
<gx:LatLonQuad>
<coordinates>
-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
</coordinates>
</gx:LatLonQuad>
</GroundOverlay>

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?

[Hannah Pinkos]

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

[zch...@gmail.com]

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

and here is the same kml in cesium:
http://s32.postimg.org/ihmru3n2d/cz_example.png

Here is the whole kml file content:

<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">
<GroundOverlay id="69b165f9-05d7-44a7-b672-d7159cc523aa">
<name>Overlay</name>
<visibility>1</visibility>
<Icon>
<href>test_frame.jpg</href>

<viewBoundScale>0.75</viewBoundScale>
</Icon>
<gx:LatLonQuad>
<coordinates>

-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
</coordinates>
</gx:LatLonQuad>
</GroundOverlay>
</kml>

and this is test_frame.jpg
http://s32.postimg.org/gly5dg2h1/test_frame.jpg

[Scott Reynolds]

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 (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).

[zch...@gmail.com]

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?

[Hannah Pinkos]

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

[zch...@gmail.com]

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

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 :)

[Hannah Pinkos]

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/

I started writing a tutorial about creating a custom geometry type here: 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

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.  

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.  This includes a Build Guide 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

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

[nikos....@gmail.com]

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

[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

[nikos....@gmail.com]

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

[Hannah Pinkos]

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

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

-Hannah

[Nikos Bogdos]

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.

Nikos

--
You received this message because you are subscribed to a topic in the Google Groups "cesium-dev" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/cesium-dev/x3sYLgIr8Mc/unsubscribe.
To unsubscribe from this group and all its topics, send an email to cesium-dev+...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[nikos....@gmail.com]

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.

[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

[Nikos Bogdos]

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',

    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', options));

I also attach the KML file just in case.

[nikos....@gmail.com]

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.

[Hannah Pinkos]

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

Best,

Hannah

[Nikos Bogdos]

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

[Hannah Pinkos]

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

[Nikos Bogdos]

Hannah you forgot to enable terrain. Here’s your code with terrain ON and ground clamping isn’t working:

var terrainProvider = new Cesium.CesiumTerrainProvider({

    url : '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

};

var ds = viewer.dataSources.add(Cesium.KmlDataSource.load('../../SampleData/kml/fireProb-3.kml', options));

viewer.zoomTo(ds);

[Hannah Pinkos]

Sorry, I did enable terrain, I just didn't include that in my code snippet.  Here's what I see:

What version of Cesium are you using, and what is your browser and operating system?

-Hannah

[Nikos Bogdos]

Sorry, I feel a bit stupid that I was using an old installation of Cesium. The current version fixed it. So I’m waiting for the ground clamping and rotation support of imagery layers. Thank you and let me know if there’s any way I can speed up some developments in this area.

Nikos