Vektorová vrstva

by smap

HTML

<!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8" />
        <title>api4.mapy.cz - ukázka práce se vektorovou vrstvou</title>
        <script type="text/javascript" src="https://api.mapy.cz/loader.js"></script>
        <script type="text/javascript">Loader.load();</script>
    </head>
    <body id="advanced-geometry">
        <div id="m" style="height:360px"></div>
    </body>
</html>

JavaScript

var m = new SMap(JAK.gel("m"));
m.addControl(new SMap.Control.Sync()); /* Aby mapa reagovala na změnu velikosti průhledu */
m.addDefaultLayer(SMap.DEF_BASE).enable(); /* Turistický podklad */
var mouse = new SMap.Control.Mouse(SMap.MOUSE_PAN | SMap.MOUSE_WHEEL | SMap.MOUSE_ZOOM); /* Ovládání myší */
m.addControl(mouse); 

var response = function(xmlDoc) {
var souradnice = [];
var coords = xmlDoc.getElementsByTagName("coord");
var maxPoints = Math.min(200, coords.length);
for (var i=0;i<maxPoints;i++) {
    var index = Math.round(coords.length * (i / maxPoints));
    var node = coords[index];
    var lat = parseFloat(node.getAttribute("lat"));
    var lon = parseFloat(node.getAttribute("lon"));
    var c = SMap.Coords.fromWGS84(lat, lon);
    souradnice.push(c);
}

var vrstva = new SMap.Layer.Geometry();     /* Geometrická vrstva */
m.addLayer(vrstva);                          /* Přidat ji do mapy */
vrstva.enable();                         /* A povolit */

var options = {
    color: "blue",
    opacity: 0.3,
    outlineColor: "blue",
    outlineOpacity: 0.7,
    outlineWidth: 4,
    curvature: 0
};
var polygon = new SMap.Geometry(SMap.GEOMETRY_POLYGON, null, souradnice, options);    
vrstva.addGeometry(polygon);

var cz = m.computeCenterZoom(souradnice); /* Spočítat pozici mapy tak, aby byl vidět celý mnohoúhelník */
m.setCenterZoom(cz[0], cz[1]);
}

var request = new JAK.Request(JAK.Request.XML);
request.setCallback(window, response);
request.send("//api.mapy.cz/xml/cr.xml");