JSFiddle - React, Tailwind, and code Playground

by Jacob Pearlstein

HTML

<!DOCTYPE html>
<html lang="en">

  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>SightMap JavaScript IFrame API Example</title>
    <style type="text/css">
      * {
        box-sizing: border-box;
      }

      html,
      body {
        height: 100%;
        margin: 0;
        padding: 0;
      }

    </style>
  </head>

  <body>
    <!-- The API script must be included on the page -->
    <script src="https://sightmap.com/embed/api.js"></script>

    <!--
    Include the IFrame embed code. The embed URL must include `enable_api=1` and 
    provide the pages origin, the example uses `http://localhost:3000`, however
    update this accordingly. Additionally, the iframe must declare an id
    attribute, in this case it is set to `sightmap`.
    -->
     <iframe id="sightmap" src="https://sightmap.com/embed/rx1p89krwd6?enable_api=1&origin=https://jsfiddle.net" frameborder="0" width="100%" height="100%"></iframe>
    <script type="text/javascript">
      // Create a new embed instance, providing the iframe id value:
      var embed = new SightMap.Embed('sightmap');

      embed.on('ready', function() {
        // Usage example code goes here...
        filterSightmap(false);
         embed.locateUnitById('12237', {
         displayDetails: false
        });
      });

    </script>
  </body>

</html>