XY based primitives

[TonyD]

Is it possible to create an X/Y based primitive and anchor it to a geo point? For instance, if I want a filled rectangle 50 pixels x 100 pixels and anchored to an arbitrary geo location.

[Hannah Pinkos]

Hello,

Are you thinking something like this example? http://analyticalgraphicsinc.github.io/cesium-google-earth-examples/examples/pinStyle.html

This uses a billboard to put a square defined in as a png image on the globe.

Best,

Hannah

[to...@daloisio.com]

Yes, but for all primitives in addition to images, that way I can modify stuff like line width, material, or just change the shape entirely without having to render a new picture.

I would imagine that Cesium essentially takes whatever primitive is defined, does a geo -> cartesian conversion and renders it. It might be a good idea to come up with a set of primitives that skip the geo conversion and go straight to rendering, except that they can be anchored to a geo location.

Really just a suggestion.

[to...@daloisio.com]

Some uses for this would be info balloons, symbols, and directional vectors to name a few.

[Matthew Amato]

Tony, the main reason Cesium doesn't do what you are describing is because you can already do it with normal HTML.  This is how the green selection indicator works when you click on an entity in Viewer, for example.  Here's a complete example that you can paste into Sandcastle and adapt to your own needs.

var viewer = new Cesium.Viewer('cesiumContainer');

//Normally you would define the default styles

//in CSS, but for the example it's easier to 

//just do it here.

var geoOverlay = document.createElement('div');

viewer.container.appendChild(geoOverlay);

geoOverlay.style.display = 'none';

geoOverlay.style['background-color'] = 'white';

geoOverlay.style.position = 'absolute';

geoOverlay.style.top = '0';

geoOverlay.style.left = '0';

geoOverlay.style.width = '20px';

geoOverlay.style.height = '20px';

geoOverlay.style['pointer-events'] = 'none'; //Disable mouse inter

//The geolocation that we want to the element t olive.

var anchor = Cesium.Cartesian3.fromDegrees(0, 0, 0);

//Every frame, figure out if the geolocation is on the screen

//and move the element accordingly.

var tmp = new Cesium.Cartesian2();

viewer.scene.preRender.addEventListener(function(){

    var result = Cesium.SceneTransforms.wgs84ToWindowCoordinates(viewer.scene, anchor, tmp);

    if(Cesium.defined(result)){

        geoOverlay.style.display = 'block';

        geoOverlay.style.top = tmp.y + 'px';

        geoOverlay.style.left = tmp.x + 'px';

    } else {

        geoOverlay.style.display = 'none';

    }

});

--
You received this message because you are subscribed to the Google Groups "cesium-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to cesium-dev+...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[to...@daloisio.com]

Thanks, that worked. I would still make the suggestion to add X/Y based primitives to Cesium. I worked on a map product years ago and found the capability to be highly useful. It also frees the developer from having to check when and how the scene changes and which html objects would need to be re-rendered. Just a suggestion.

Thanks,
Tony

[Ian Walberg]

Is there a complete example including adding the pick for the entity anywhere?

Thanks

Ian