2015-09-24 5 views
6

Ich versuche, die regelbasierte Styling in Openlayers 3 zu tun, hier ist mein Code:Regelbasierte Styling in Openlayers 3

<!DOCTYPE html> 
<html> 
<head> 
<title>CONFIG</title> 


<script src="https://code.jquery.com/jquery-1.11.2.min.js"></script> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> 
<link rel="stylesheet" href="http://openlayers.org/en/v3.8.2/css/ol.css" type="text/css"> 
<script src="http://openlayers.org/en/v3.8.2/build/ol.js"></script> 

</head> 
<body> 
<div class="container-fluid"> 

<div class="row-fluid"> 
    <div class="span12"> 
    <div id="map" class="map"></div> 
    </div> 
</div> 
<script> 

    var layerStyle = { 
     default: { 
     style: new ol.style.Style({ 
     stroke: new ol.style.Stroke({ 
     color: 'rgba(0, 0, 0, 1.0)', 
     width: 0.5 
      }), 
     fill: new ol.style.Fill({ 
     color: 'rgba(0, 255, 0, 0.5)' 
      }) 
      }) 
     }, 

     filter: [{ 
     type: "AND", 
     rules: [{ 
      type: "==", 
      property: "CODE", 
      value: "16" 
     }, { 
      type: "==", 
      property: "NAME", 
      value: "CHIKMAGALUR" 
     }], 
     symbolizers: { 
     style: new ol.style.Style({ 
     stroke: new ol.style.Stroke({ 
       color: 'rgba(0, 255, 0, 0.5)', 
       width: 0.5 
      }), 
     fill: new ol.style.Fill({ 
       color: 'red' 
      }) 
      }) 
     } 
    } ] 
    }; 

    var geojson_layer = new ol.layer.Vector({ 
    source: new ol.source.Vector({ 
     url: 'file.geojson', 
     format: new ol.format.GeoJSON() 
    }), 
}); 
var vectorLayer = new ol.source.Vector({ 
     features: (new ol.format.GeoJSON()).readFeatures(geojsonObject) 
    }); 

     if ('CODE'=='16' && 'NAME'=='CHIKMAGALUR') { 
     style: symbolizers; 
     } 




     var map = new ol.Map({ 
    layers: [ 
    new ol.layer.Tile({ 
     source: new ol.source.OSM() 
    }), 
    vectorLayer, 
    ], 
    target: 'map', 
    controls: ol.control.defaults({ 
    attributionOptions: /** @type {olx.control.AttributionOptions} */ ({ 
     collapsible: false 
    }) 
    }), 
    view: new ol.View({ 
    center: [0, 0], 
    zoom: 5 
    }) 
}); 

</script> 
</body> 
</html> 

Ich versuche, versuchen, den Stil von Symbolizer zu bekommen, aber ich bin Fehler immer . Wie openlayer2 habe ich die Filter für den AND-Betrieb benutzt, aber ich bin geblieben. Kann mir jemand dabei helfen ??

+0

Add ** ** Openlayers-Tag (für OL 2) auf Ihre Frage, ob Openlayers 2 Männer können Ihnen helfen, die zu finden Entsprechung auf OpenLayers 3. Lesen Sie auch die API-Dokumentation, Sie erhalten immer einen Fehler, wenn Sie eine Eigenschaft versuchen, die nicht in der API vorhanden ist. –

Antwort

2

In OL3 haben Vektorebenen ein style-Attribut, das ein Style-Objekt, ein Array von Style-Objekten oder eine Funktion sein kann, die ein Style-Objekt oder ein Array von Style-Objekten zurückgibt. Sie möchten wahrscheinlich eine Stilfunktion für das verwenden, was Sie tun möchten.

Siehe das folgende Beispiel dafür, wie dies getan werden kann:

http://openlayers.org/en/v3.20.1/examples/earthquake-clusters.html

+0

Danke Bob Holmes, kann ich nicht einen Filter in ol3 anwenden? – Rajan

+2

Nicht genau, zumindest gibt es nichts mit diesem Namen. Sie können Ihren Filter jedoch in Ihrer Gestaltungsfunktion implementieren, indem Sie ein Stilobjekt für alle Features, die angezeigt werden sollen, zurückgeben und für alle Features, die herausgefiltert werden sollen, 'null' zurückgeben. – Dirk