How to render dynamic HTML into billboard?

CesiumJS
1

Hi,

I want to render the HTML content into billboard. Below is the code snippet. I’ve created a drawImage(), to create a dynamic HTML content. The result should render in billboard.

var entity = viewer.entities.add({

id: data.id,

name: data.name,

data: data,

position: position,

orientation: orientation,

model: {

uri: url,

minimumPixelSize: 0

},

billboard: {

                    image: drawImage(data),

show: true

                                }

            });

   function drawImage(data) {

            // good look and feel HTML content to show the model details.

            var html = "<div class='popup'>\
\

<img src=’/images/movies/’"+ data.image + " >\

\
\
" + data.header + "
\

< div class=‘description’ >\

\ + data.description + \

\ \ ";

return html;

        }

``

Appreciate your support to achieve this feature. If possible, share some sample code on this…

Thank you!

2

Hello,

I don’t think this kind of functionality is currently supported. Instead, you could use the html as the description property for the billboard, and that will show up in the InfoBox when you click on the billboard. Would that work for you?

Best,

Hannah

3

While Hannah is correct, have a look at the example I just posted here: https://groups.google.com/d/msg/cesium-dev/hP5wjNeOWzo/dq7frk-_AwAJ

It’s not a billboard, but allows you to render geo-located arbitrary HTML.