globes

Attributes

`GLOBE_HTML`
`RESOLUTIONS`

Functions

globe(data[, style, out_fn, out_path, size, ...])

Generate an IFrame containing a templated javascript package.

Module Contents

globes.GLOBE_HTML = Multiline-String

Show Value

"""
<head>
    <style> body {{ margin: 0; }} </style>

    <script src="https://unpkg.com/react/umd/react.production.min.js"></script>
    <script src="https://unpkg.com/react-dom/umd/react-dom.production.min.js"></script>
    <script src="https://unpkg.com/@babel/standalone"></script>

    <script src="https://unpkg.com/react-globe.gl"></script>
    <script src="https://unpkg.com/three/build/three.module.js"></script>
    <!--<script src="../../dist/react-globe.gl.js"></script>-->
  </head>

  <body>
    <div id="globeViz"></div>

  <script type="text/jsx" data-type="module">
    import * as THREE from '//unpkg.com/three/build/three.module.js';
    const globeMaterial = new THREE.MeshBasicMaterial();

  const {{ useState, useEffect }} = React;

  const World = () => {{

    const coastlines = {coastlines}

    return <Globe
      globeImageUrl="{img_url}"
      backgroundColor="#00000000"
      width={{{width}}}
      height={{{height}}}
      globeMaterial={{globeMaterial}}
    pathsData={{coastlines}}
    pathPoints="coords"
    pathPointLat={{p => p[1]}}
    pathPointLng={{p => p[0]}}
    pathPointAlt={{0.001}}
    pathColor="#555"
    pathStroke={{0.75}}
    pathTransitionDuration={{0}}
    />;
  }};

  ReactDOM.render(
    <World />,
    document.getElementById('globeViz')
  );
  </script>
  </body>
"""

globes.RESOLUTIONS

globes.globe(data, style=None, out_fn=None, out_path='.', size=500, resolution='medium', how='block', **kwargs): Generate an IFrame containing a templated javascript package.