Openlayers 3 特征集合中每个特征的不同颜色
我用openlayers 3在地图中上传了一个geojson文件。geojson文件是一个FeatureCollection,具有LineString类型的5个功能。 如何为每个功能添加不同的颜色以区分路径? 如果我将颜色添加到geojson文件的样式中,则不会读取该文件,如果我将颜色添加到笔划中,则所有功能都以单一颜色着色 下面我添加代码 谢谢Openlayers 3 特征集合中每个特征的不同颜色,openlayers-3,geojson,Openlayers 3,Geojson,我用openlayers 3在地图中上传了一个geojson文件。geojson文件是一个FeatureCollection,具有LineString类型的5个功能。 如何为每个功能添加不同的颜色以区分路径? 如果我将颜色添加到geojson文件的样式中,则不会读取该文件,如果我将颜色添加到笔划中,则所有功能都以单一颜色着色 下面我添加代码 谢谢 var vector = new ol.layer.Vector({ source: new ol.source.Vector
var vector = new ol.layer.Vector({
source: new ol.source.Vector({
format: new ol.format.GeoJSON(),
url: 'http://localhost/joggo_wp/percorsi.geojson'
}),
style: new ol.style.Style({
stroke: new ol.style.Stroke({
color: "#ff000",
width: 2.5,
})
}),
});
文件GEOJSON:
{
“类型”:“FeatureCollection”,
“crs”:{“类型”:“名称”,“属性”:{“名称”:“urn:ogc:def:crs:EPSG::4326”},
“特点”:[
{“类型”:“特征”,“属性”:{“ID”:1.0,“LUNGH_M”:1970.0,“NOME”:“Percorso 1”,“PARTENZA”:“Via del Poggio Imperiale 4”,“ARRIVO”:“Via di S.Leonardo 59n”,“LUNGHEZZA”:“1,97 km”},“风格”:{“颜色”:“ff0000”},“几何体”:{“类型”:“线条”,“坐标”:[11.2420370004032,43.7599754752376],[ 11.247204649917521, 43.750208064502473 ], [ 11.247446659153409, 43.750240561464494 ], [ 11.247746238597509, 43.750179530458503 ], [ 11.247960306028226, 43.750118937742307 ], [ 11.248108264989046, 43.749966781403657 ], [ 11.248240378523741, 43.749814084940027 ], [ 11.248897533371567, 43.75006527742493 ], [ 11.249140299088037, 43.750277668555015 ], [ 11.250198620263028, 43.751078552926899 ], [ 11.250259518649738, 43.751623211022611 ], [ 11.250562891152564, 43.751940055106814 ], [ 11.250844806161599, 43.752116454510677 ], [ 11.250976903611187, 43.752184285854881 ], [ 11.251025276742347, 43.752394633135999 ], [ 11.251095944135562, 43.752551715399683 ], [ 11.252075754111447, 43.753064192693351 ], [ 11.252260569522404, 43.753162663730734 ], [ 11.252298216347477, 43.753302788154329 ], [ 11.252042422884459, 43.753607171300693 ], [ 11.252089750740879, 43.754005360713535 ], [ 11.252046702595303, 43.754152945071198 ], [ 11.251940462780629, 43.754342861090443 ], [ 11.251887408111035, 43.754762904036816 ] ] } },
您需要创建一个样式函数来处理此类情况 因此,让你的风格发挥作用:
var styleFunction = function(feature) {
console.log(feature);
//now you can use any property of your feature to identify the different colors
//I am using the ID property of your data just to demonstrate
var color;
if (feature.get("ID")==1){
color = "red";
} else if (feature.get("ID")==2){
color = "green";
} else {
color = "black";
}
var retStyle = new ol.style.Style({
stroke: new ol.style.Stroke({
color: color,
width: 5
})
});
return retStyle;
};
然后将此函数指定给向量层的样式
var vector = new ol.layer.Vector({
source: new ol.source.Vector({
format: new ol.format.GeoJSON(),
url: 'http://localhost/joggo_wp/percorsi.geojson'
}),
style: styleFunction
});
这是一个