Как стилизовать каждую функцию в одном слое с разными цветами - OpenLayers 2

Question

Ниже приведенный ниже фрагмент дает краткое представление о том, как добавлять функции к векторному слою.

vectors = new OpenLayers.Layer.Vector("Vector Layer"); 

drawControls = {      
    Point1: new OpenLayers.Control.DrawFeature(vectors, OpenLayers.Handler.Point), 
    Point2: new OpenLayers.Control.DrawFeature(vectors, OpenLayers.Handler.Point), 
    Polygon1: new OpenLayers.Control.DrawFeature(vectors, OpenLayers.Handler.Polygon), 
    Polygon2: new OpenLayers.Control.DrawFeature(vectors, OpenLayers.Handler.Polygon) 
} 

for(var key in drawControls) { 
    map.addControl(drawControls[key]); 
} 

Как настроить каждую функцию с разными цветами ?.

Я знаю, что может стиль векторного слоя в целом с кодом, приведенными ниже:

var defStyle_layer = { 
    strokeColor: "blue", 
    fillColor: "blue" 
}; 

var layer_style= OpenLayers.Util.applyDefaults(defStyle_layer, OpenLayers.Feature.Vector.style["default"]); 

var layer_sm= new OpenLayers.StyleMap({ 
    'default': layer_style 
}); 

vectors = new OpenLayers.Layer.Vector("Vector Layer", {stylemap:layer_sm }) 

мне нужна помощь для укладки каждой функции в том же векторном слое отдельно. Причина, по которой мне нужно разместить все эти функции в том же слое, потому что я хочу иметь опцию «UNDO»

Answer 1

я нашел решение вопроса, которое разместил меня: Вот фрагмент кода приведен ниже:

<script src="lib/OpenLayers.js"></script> 
<script src="lib/GeometricNet/UndoRedo.js"></script> 
....... 
....... 
Rest of the code 
....... 
....... 
var defStyle_point1 = {strokeColor: "Darkblue", strokeOpacity: "0.5", strokeWidth:3, cursor: "pointer", fillColor: "Darkblue"}; 
var point1_style = OpenLayers.Util.applyDefaults(defStyle_point1,OpenLayers.Feature.Vector.style["default"]); 
var point1_sm = new OpenLayers.StyleMap({ 
        'default': point1_style 
        }); 

var defStyle_polygon1 = {strokeColor: "Red", strokeOpacity: "0.5", strokeWidth: 3, cursor: "pointer", fillColor: "Red"}; 
var polygon1_style = OpenLayers.Util.applyDefaults(defStyle_polygon1, Openlayers.Feature.Vector.style["default"]); 
var polygon1_sm = new OpenLayers.StyleMap({ 
        'default': polygon1_style 
        }); 


point1_layer= new OpenLayers.Layer.Vector("Point1 Layer",{styleMap: point1_sm}); 
polygon1_layer= new OpenLayers.Layer.Vector("Polygon1 Layer",{styleMap: polygon1_sm}); 

drawControls = {      
       Point1: new OpenLayers.Control.DrawFeature(point1_layer, OpenLayers.Handler.Point), 
       Polygon1: new OpenLayers.Control.DrawFeature(polygon1_layer,OpenLayers.Handler.Polygon), 
       } 

for(var key in drawControls) { 
      map.addControl(drawControls[key]); 
} 

undoRedo = new UndoRedo([point1_layer,polygon1_layer]); 

Answer 2

Я считаю, что следующий фрагмент достигает того, что вы хотели бы.

Вы можете использовать интерполяцию ${...} в определениях стилей для обозначения атрибутов атрибутов. Таким образом, вы можете определить стили для каждой функции. Естественно, вы также можете определить другие атрибуты для функций, а затем определить правила стиля для сопоставления этих атрибутов, если определение значений цвета внутри самой функции микширует данные и презентацию слишком много в вашем случае.

sketchcomplete -event позволяет подключаться к созданию новых функций и изменять их содержимое (в этом случае назначая новый атрибут функции).

function init() { 
    var map = new OpenLayers.Map("map"); 
    var style = new OpenLayers.Style({ fillColor: "${color}" }); 
    var styleMap = new OpenLayers.StyleMap({ default: style }); 

    var wmsLayer = new OpenLayers.Layer.WMS("OpenLayers WMS", 
       "http://vmap0.tiles.osgeo.org/wms/vmap0?", {layers: 'basic'}); 
    var polygonLayer = new OpenLayers.Layer.Vector("Polygon Layer", { styleMap: styleMap }); 

    map.addLayers([wmsLayer, polygonLayer]); 

    var drawFeatureControl = new OpenLayers.Control.DrawFeature(polygonLayer, OpenLayers.Handler.Polygon); 

    polygonLayer.events.register("sketchcomplete", drawFeatureControl, function(event) { event.feature.attributes.color = "#aa0000"; }); 

    map.addControl(drawFeatureControl); 

    map.setCenter(new OpenLayers.LonLat(0, 0), 3); 

    drawFeatureControl.activate(); 
} 

Answer 3

Вы должны подгонять каждую функцию во время создания. Вот конструктор вы chould использовать:

var newFeature = new OpenLayers.Feature.Vector(geometry, attributes, style); 
    layer.addFeature(newFeature); 

1. геометрия - геометрия ваша функция представляет
2. атрибуты - необязательные атрибуты вашей функции
3. стиль - ваш пользовательский стиль

Надежда помогает !