czml3 icon indicating copy to clipboard operation
czml3 copied to clipboard

Allow standalone export

Open astrojuanlu opened this issue 6 years ago • 7 comments

astrojuanlu avatar Dec 03 '19 18:12 astrojuanlu

I think this means producing complete HTML that does not need embedding anywhere else.

astrojuanlu avatar Apr 12 '20 16:04 astrojuanlu

Hi @astrojuanlu! Is there currently any good way to use the CZMLWidget HTML representation outside of a notebook, e.g. embedded within some template page?

lalligagger avatar Sep 07 '22 20:09 lalligagger

Hi @lalligagger! If I recall correctly, this widget does not (yet) have any jupyter-specific code, it's just a blob of HTML. The only thing missing is <html>, <head>, and <body>, but maybe this is perfect for what you need.

Have a look at the to_html method:

https://github.com/poliastro/czml3/blob/46b434214b40dee14fbe2d0d74baba90b44b7ba4/src/czml3/widget.py#L97-L103

astrojuanlu avatar Sep 08 '22 06:09 astrojuanlu

Ok, I haven't been able to get standalone html working but a mashup of the extractor and the approach taken below has me running in a dash app!

https://community.plotly.com/t/adding-cesium-app-to-plotly-dash/48336

lalligagger avatar Sep 10 '22 19:09 lalligagger

What exactly didn't work, or what errors did you observe? Would be useful to know so we can try to address them.

astrojuanlu avatar Sep 11 '22 06:09 astrojuanlu

I added your suggested tags to beginning/ end of to_html output and saved as .html but nothing renders in that case.

lalligagger avatar Sep 12 '22 18:09 lalligagger

The existing "to_html" function actually works, but you need to load RequireJS in the html page you want to hold the resulting widget. For example:

from czml3.examples import simple
from czml3.widget import CZMLWidget

view = CZMLWidget(simple)
html = view.to_html()
page = f"""<!DOCTYPE html>
        <html>
            <head>
                <script src="http://requirejs.org/docs/release/2.3.6/comments/require.js"></script>
            </head>
            <body>

            <!-- CZMLWidget -->
            {html}

            </body>
        </html>
        """

# save to file
with open("CesiumJS.html", "w") as file:
        file.write(page)

Xenon130 avatar Apr 05 '23 00:04 Xenon130