New to Kendo UI for jQuery? Start a free 30-day trial

LayerDefaults.shape.style

configuration

The default style for shapes.

layerDefaults.shape.style

Object

<div id="map"></div>
<script>
    $("#map").kendoMap({
        layerDefaults: {
            shape: {
                style: {
                    fill: {
                        color: "red",
                        opacity: 1
                    },
                    stroke: {
                        color: "green",
                        width: 4,
                        dashType: "longDashDot",
                        opacity: 0.5
                    }
                }
            }
        },
        layers: [{
            type: "shape",
            dataSource: {
                type: "geojson",
                data: [{
                    "type": "Polygon",
                    "coordinates": [
                        [[30, 10], [40, 40], [20, 40], [10, 20], [30, 10]]
                    ]
                }]
            }
        }]
    });
</script>

layerDefaults.shape.style.fill

Object

The default fill for layer shapes. Accepts a valid CSS color string or object with detailed configuration.

<div id="map"></div>
<script>
    $("#map").kendoMap({
        layerDefaults: {
            shape: {
                style: {
                    fill: {
                        color: "red",
                        opacity: 1
                    }
                }
            }
        },
        layers: [{
            type: "shape",
            dataSource: {
                type: "geojson",
                data: [{
                    "type": "Polygon",
                    "coordinates": [
                        [[30, 10], [40, 40], [20, 40], [10, 20], [30, 10]]
                    ]
                }]
            }
        }]
    });
</script>

layerDefaults.shape.style.stroke

Object

The default stroke for layer shapes. Accepts a valid CSS color string or object with detailed configuration.

<div id="map"></div>
<script>
    $("#map").kendoMap({
        layerDefaults: {
            shape: {
                style: {
                    stroke: {
                        color: "green",
                        width: 4,
                        dashType: "longDashDot",
                        opacity: 0.5
                    }
                }
            }
        },
        layers: [{
            type: "shape",
            dataSource: {
                type: "geojson",
                data: [{
                    "type": "Polygon",
                    "coordinates": [
                        [[30, 10], [40, 40], [20, 40], [10, 20], [30, 10]]
                    ]
                }]
            }
        }]
    });
</script>

LayerDefaults.shape.style

layerDefaults.shape.style

layerDefaults.shape.style.fill

layerDefaults.shape.style.stroke

Related Members