Version:

Draw features with WKT string

Draw features with WKT string

Draw features with WKT string

<!DOCTYPE html>
<html>
  <head>
    <title>Draw features with WKT string</title>
    <script src="https://maps.cercalia.com/maps/loader.js?key=YOUR_API_KEY&v=5&lang=en&theme=1976d2"></script>
  </head>
  <body>
    <div id="map" class="map"></div>
    <script>
      document.addEventListener('cercalia-ready', initMap);

      var map;

      function initMap() {
        map = new cercalia.Map({
          target: 'map',
          controls: []
        });

        var point = new cercalia.Feature({
          wkt: 'POINT (-31.574814 55.288342)',
          simpleLabel: new cercalia.SimpleLabel({
            text: 'Point Demo',
            offsetY: -20
          }),
          editable: true
        });
        map.addFeature(point);

        var linestring = new cercalia.Feature({
          wkt: 'LINESTRING (2.043350 41.979704, 12.502334 42.597372, -1.164658 48.701654)',
          simpleLabel: new cercalia.SimpleLabel({
            text: 'LineString Demo'
          }),
          draggable: true,
          editable: true
        });
        map.addFeature(linestring);

        var multilinestring = new cercalia.Feature({
          wkt: 'MULTILINESTRING( (-2 41.5, -1 50, 0 60 ),(-1.541 40.141, -2.5 40.661, -1.8 41.541, -0.7 42.151) )',
          draggable: true,
          strokeColor: '#519f12',
          fillColor: '#f1345f',
          fillOpacity: 0.5,
          simpleLabel: new cercalia.SimpleLabel({
            text: 'MultiLineString Demo'
          })
        });
        map.addFeature(multilinestring);

        var polygon = new cercalia.Feature({
          wkt: 'POLYGON((23.972060 54.377196, 22.697646 49.763346, 14.567764 51.872928, 13.600967 55.637141))',
          simpleLabel: new cercalia.SimpleLabel({
            text: 'Polygon Demo'
          }),
          fillColor: '#0055ff',
          fillOpacity: 0.5
        });
        map.addFeature(polygon);

        var multipolygon = new cercalia.Feature({
          wkt: 'MULTIPOLYGON(((-39.39 55.22, -41 60, -50 50, -40 60)),((-60 60, -60 50, -39.39 55.22, -50 40)))',
          fillColor: '#cc6611',
          strokeColor: '#00ff00',
          fillOpacity: 1,
          simpleLabel: new cercalia.SimpleLabel({
            text: 'MultiPolygon Demo'
          })
        });
        map.addFeature(multipolygon);

        map.centerToFeatures([point, linestring, multilinestring, polygon, multipolygon]);
      }
    </script>
  </body>
</html>