examples/vector-layer.html

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="X-UA-Compatible" content="chrome=1">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
    <link rel="stylesheet" href="style.css" type="text/css">
    <style type="text/css">
      html, body, #map {
        margin: 0;
        padding: 0;
        width: 100%;
        height: 100%;
      }
      #text {
          position: absolute;
          top: 8px;
          right: 8px;
          z-index: 20000;
          background-color: white;
          padding: 0 0.5em 0.5em 0.5em;
          border-radius: 4px;
      }
      @media only screen and (max-width: 600px) {
        #text {
          display: none;
        }
      }
    </style>
    <title>Full-screen example</title>
  </head>
  <body>
    <div id="map">
      <div id="text">
        <h1 id="title">Vector rendering example</h1>
        <div id="shortdesc">Uses a canvas renderer for drawing vector features.</div>
        <div id="docs">
          <p>See the
          <a href="vector-layer.js" target="_blank">vector-layer.js source</a>
          to see how this is done.</p>
        </div>
      </div>
    </div>
    <div id="tags">vector, feature, canvas</div>
    <script src="loader.js?id=vector-layer" type="text/javascript"></script>
  </body>
</html>