Draw features with WKT string
Draw features with WKT string
var map = new cercaliagl.Map({
target: 'map',
controls: [],
disableDragWhenEditing: true
});
map.whenReady(function () {
var drawControl = map.getControlByName('draw');
drawControl.setDisableDragWhenEditing(true);
var linestring = new cercaliagl.Feature({
wkt: 'LINESTRING (2.186571267 41.412635584, 2.187218054 41.423617094, 2.183651742 41.428863756)',
simpleLabel: new cercaliagl.SimpleLabel({
text: 'LineString Demo'
}),
draggable: true,
editable: true,
visible: true,
onClick: function onClick() {
linestring.setEditable(true);
}
});
map.addFeature(linestring);
var linestringHalf = new cercaliagl.Feature({
wkt: getPartialLinestring(linestring, 0, 0.8),
zIndex: 4,
editable: true,
strokeColor: '#ff0000'
});
map.addFeature(linestringHalf);
var multilinestring = new cercaliagl.Feature({
wkt: 'MULTILINESTRING( (2.199300394 41.421345211, 2.201582115 41.419648008, 2.202812807 41.420459426 ),(2.205229275 41.422264793, 2.207349299 41.420608184, 2.208409311 41.421399305) )',
draggable: true,
strokeColor: '#519f12',
fillColor: '#f1345f',
editable: true,
fillOpacity: 0.5,
visible: true,
simpleLabel: new cercaliagl.SimpleLabel({
text: 'MultiLineString Demo'
})
});
map.addFeature(multilinestring);
var polygon = new cercaliagl.Feature({
wkt: 'POLYGON((2.177722861 41.413683777, 2.174677572 41.411310103, 2.171263974 41.413372702, 2.174830286 41.416057364, 2.177722861 41.413683777))',
simpleLabel: new cercaliagl.SimpleLabel({
text: 'Polygon Demo'
}),
fillColor: '#0055ff',
fillOpacity: 0.5,
editable: true,
visible: true
});
map.addFeature(polygon);
var multipolygon = new cercaliagl.Feature({
wkt: 'MULTIPOLYGON(((2.200081929 41.411256001, 2.202857723 41.413595865, 2.204052482 41.412581483, 2.200935328 41.410031935, 2.200081929 41.411256001)),((2.207690659 41.413447090, 2.205840130 41.412824936, 2.207394215 41.411837594, 2.208526092 41.412574721, 2.207690659 41.413447090)))',
fillColor: '#cc6611',
strokeColor: '#441100',
fillOpacity: 1,
editable: true,
visible: true,
simpleLabel: new cercaliagl.SimpleLabel({
text: 'MultiPolygon Demo'
})
});
map.addFeature(multipolygon);
map.centerToFeatures([linestring, multilinestring, polygon, multipolygon]);
});
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Draw features with WKT string</title>
<style>
.map {
width: 100%;
height: 640px;
}
</style>
</head>
<body>
<div id="map" class="map"></div>
<link rel="stylesheet" type="text/css" href="//maps.cercalia.com/gl/v1.0/cercaliagl.css">
<script src="//maps.cercalia.com/gl/v1.0/cercaliagl.js?key=YOUR_API_KEY"></script>
<script src="main.js"></script>
</body>
</html>