Examples

basics

filtering

drawing

styling

querying

feature collection clipped

This example loads a map of South America using the "SOUTH_AMERICA" key.

The "SOUTH_AMERICA" map was created using the Mapzania MapStyler (see www.mapzania.com/manual/concepts-mapstyler).

The example uses the "usingLayer" method of the Mapzania Map object to get a "COUNTRIES" Layer Object and make chained calls to the "clipByFeatureCollection" and then the "update" method of the layer to clip and redraw the layer data.

For more on layers see: www.mapzania.com/manual/concepts-layers

For more on the Layer Object and applicable methods see:

window.onload = function () {
    var map = new Mapzania.Map("map-div", "SOUTH_AMERICA", function () {

        var featureCollection = {
            type: "FeatureCollection",
            features: [
                {
                    type: "Feature",
                    geometry: {
                        coordinates: [
                            [
                                [-40, 10], [-80, -28], [-40, -40], [-40, 10]
                            ]
                        ],
                        type: "Polygon"
                    }
                }
            ]
        };

        map.usingLayer("COUNTRIES")
            .clipByFeatureCollection(featureCollection)
            .update();

        //----------------------------------------------------
        // Draw the filter's feature-collection on a new layer
        //----------------------------------------------------

        map.usingNewLayer("FILTER")
            .addFeatureCollection(featureCollection)
            .style({ strokeColor: "#000000", strokeWidth: 1 })
            .update();

        //----------------------------------------------------
    });
};
#map-div {
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0px;
    right: 0px;
}

<div id="map-div"></div>