样式设置

对矢量元素进行样式设置，OpenLayers3 支持两种方式，一种是直接给feature设置样式，一种是给layer设置样式。系统默认优先考虑feature的样式，如果没有，则使用layer的样式，还有一种情况是layer也没有设置样式，则会采用系统默认的样式。

对于矢量地图而言，要想修改样式也只有这两种途径可选。比如之前例子中使用的GeoJSON，如果要改变线条的颜色成下面这样，可以考虑在layer上设置样式：

代码很简单：

<div id="map" style="width: 100%"></div>
<script type="text/javascript">

    //创建地图
    var map = new ol.Map({
        layers: [
            new ol.layer.Tile({
                source: new ol.source.OSM()
            })
        ],
        view: new ol.View({ 
            center: [-72.980624870461128, 48.161307640513321],
            zoom: 8,
            projection: 'EPSG:4326'
        }),
        target: 'map'
    });

    var vectorLayer = new ol.layer.Vector({
        source: new ol.source.Vector({
            url: '../data/geojson/line-samples.geojson', 
            format: new ol.format.GeoJSON()
        }),
        // 设置样式，颜色为红色，线条粗细为1个像素
        style: new ol.style.Style({
            stroke: new ol.style.Stroke({
                color: 'red',
                size: 1
            })
        })
    });

    map.addLayer(vectorLayer);
</script>

如果要在feature上设置样式，就必须先获取到所有加载的feature，然后依次设置，显然直接设置layer的样式，会在代码编写上更容易一些。

自带样式的矢量地图修改样式

有些矢量地图数据自带样式，比如KML格式的矢量地图，如果要修改样式，则相对比较麻烦。得分情况考虑：

• 一种是所有矢量地图都不使用自带的样式；
• 一种是部分矢量地图不使用自带的样式。

对于第一种情况，则相对比较简单一些，只需要把ol.format.KML的构造参数extractStyles设置为false即可，然后为layer设定自定义的样式。

对于第二种情况，则相对麻烦一些，必须要读取加载的所有feature，并进行过滤，对符合条件的feature重新设置样式。