SightMap JS API Floor Picker Demo

by Jacob Pearlstein

HTML

<script src="https://sightmap.com/embed/api.js">


    </script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
    <style>
      svg#building path,
      #floors>path,
      #floors>polygon {
        fill: rgba(0, 0, 0, 0.4);
      }

      #floors>path:hover,
      #floors>polygon:hover,
      #floors>path.active,
      #floors>polygon.active {
        fill: rgba(72, 138, 153, 0.8);
      }

      #sightmap {
        height: 80vh;
      }

    </style>


    <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 960 640.8">
      <defs>
        <style>
          .cls-1 {
            fill: none;
          }

        </style>
      </defs>
      <g id="background">
        <image width="4000" height="2670" transform="scale(0.24)" xlink:href="https://i.imgur.com/e59CRrA.jpg" />
      </g>
      <g id="floorPicker">
        <g id="floors">
          <polygon id="21337" data-name="21337" class="cls-1" points="378 268.31 379.82 268.31 381.47 268.13 389.7 267.85 397.56 267.6 400.63 267.33 404.96 266.58 410.84 265.83 418.06 265.63 419.94 265.16 424.73 265.13 429.05 264.66 434.59 264.66 436.05 264.24 513.47 264.24 514.89 264.49 519.85 264.61 522.39 265.17 524.87 265.54 529.87 265.74 531.91 266.25 538.15 266.25 548.77 268.09 551.73 268.09 559.5 268.75 568.29 268.75 575.76 268.95 764.55 268.75 764.53 236.32 689.8 236.55 689.8 232.75 685.36 232.75 685.36 223.06 589.15 223.06 543 238.34 527.62 238.34 522.91 240.44 522.91 247.42 522.91 248.25 515.96 248.25 515.96 243.77 427.17 243.77 427.17 239.99 422.69 237.8 406.97 237.9 359.19 222.67 264.85 222.02 264.85 232.31 _258.96 232.31 258.96 235.65 183.28 235.65 183.28 268.95 371.97 268.95 378 268.31" />
          <polygon id="21336" data-name="21336" class="cls-1" points="380.27 289.02 389.57 289.02 397.04 286.84 397.04 285.83 400.74 285.83 404.97 284.37 404.97 282.83 411.66 280.52 417.97 280.52 419.74 279.9 419.74 277.83 425.05 277.75 427.2...