openlayers之style符号化

功能说明

openlayers符号化之ol.style常用功能总结

分为点、线、面

可以单独给feature设置样式 feature.setStyle(style);也可以给整个图层设置样式

var style=new ol.style.Style({
    image:new ol.style.Icon({//点符号,可以为图片 支持jpg、png不支持gif(亲测)
        src:'',
        anchor:[0.5,0.5]
    }),
    stroke:new ol.style.Stroke({//边线符号
        color:'',//颜色
        width:2//宽度 px
    }),
    fill:new ol.style.Fill({//面填充色
        color:''//颜色支持rgba、16进制 可以设置透明度比如'rgba(0,0,0,0.5)'
    }),
    text: new ol.style.Text({//文字标注
          font: '12px Calibri,sans-serif',
          fill: new ol.style.Fill({
            color: '#000'
          }),
          stroke: new ol.style.Stroke({
            color: '#fff',
            width: 3
          })
        })
})

//image也可以是其他图形
image: new ol.style.Circle({//圆
       radius: 100,//半径
       fill: new ol.style.Fill({//圆填充色
         color: ''
       }),
       stroke: new ol.style.Stroke({//圆边线样式
         color:'',
         width: 2
       })
     })

可以单独给feature设置样式 feature.setStyle(style);也可以给整个图层设置样式

var layer=new ol.layer.Vector({
    source:new ol.source.Vector(),
    style:function(feature,resolution){
        //可以根据feature的属性进行判断返回特定style
        return style;//类似上面定义的样式style
    }
})

You may also like...

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注

CAPTCHAis initialing...