ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Removing the style rules example for now

Browse Source 
The addFeatures method on layer is going to go away temporarily (so all feature adding will take advantage of shared vertices structures).  Later we can accept feature arrays in parseFeatures and rename the method back to addFeatures.
This commit is contained in:
Tim Schaub
2013-03-07 23:32:56 -07:00
parent 4422e3e73b
commit 85a1599a1a
2 changed files with 0 additions and 146 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
examples/style-rules.html
View File

@@ -1,47 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
<link rel="stylesheet" href="style.css" type="text/css">
<style type="text/css">
html, body, #map {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
}
#text {
position: absolute;
top: 8px;
right: 8px;
z-index: 20000;
background-color: white;
padding: 0 0.5em 0.5em 0.5em;
border-radius: 4px;
}
@media only screen and (max-width: 600px) {
#text {
display: none;
}
}
</style>
<title>Vector Layer Example</title>
</head>
<body>
<div id="map">
<div id="text">
<h1 id="title">Style rules example</h1>
<div id="shortdesc">Draws features with rule based styles.</div>
<div id="docs">
<p>See the
<a href="style-rules.js" target="_blank">style-rules.js source</a>
to see how this is done.</p>
</div>
</div>
</div>
<div id="tags">vector, feature, canvas</div>
<script src="loader.js?id=style-rules" type="text/javascript"></script>
</body>
</html>

99
examples/style-rules.js
View File

@@ -1,99 +0,0 @@
goog.require('ol.Collection');
goog.require('ol.Coordinate');
goog.require('ol.Expression');
goog.require('ol.Feature');
goog.require('ol.Map');
goog.require('ol.RendererHint');
goog.require('ol.View2D');
goog.require('ol.filter.Filter');
goog.require('ol.geom.LineString');
goog.require('ol.layer.Vector');
goog.require('ol.projection');
goog.require('ol.source.Vector');
goog.require('ol.style.Line');
goog.require('ol.style.Rule');
goog.require('ol.style.Style');
var style = new ol.style.Style({rules: [
new ol.style.Rule({
filter: new ol.filter.Filter(function(feature) {
return feature.get('where') == 'outer';
}),
symbolizers: [
new ol.style.Line({
strokeStyle: new ol.Expression('color'),
strokeWidth: 4,
opacity: 1
})
]
}),
new ol.style.Rule({
filter: new ol.filter.Filter(function(feature) {
return feature.get('where') == 'inner';
}),
symbolizers: [
new ol.style.Line({
strokeStyle: '#013',
strokeWidth: 4,
opacity: 1
}),
new ol.style.Line({
strokeStyle: new ol.Expression('color'),
strokeWidth: 2,
opacity: 1
})
]
})
]});
var vector = new ol.layer.Vector({
style: style,
source: new ol.source.Vector({
projection: ol.projection.getFromCode('EPSG:3857')
})
});
vector.addFeatures([
new ol.Feature({
g: new ol.geom.LineString([[-10000000, -10000000], [10000000, 10000000]]),
'color': '#BADA55',
'where': 'inner'
}),
new ol.Feature({
g: new ol.geom.LineString([[-10000000, 10000000], [10000000, -10000000]]),
'color': '#BADA55',
'where': 'inner'
}),
new ol.Feature({
g: new ol.geom.LineString([[-10000000, -10000000], [-10000000, 10000000]]),
'color': '#013',
'where': 'outer'
}),
new ol.Feature({
g: new ol.geom.LineString([[-10000000, 10000000], [10000000, 10000000]]),
'color': '#013',
'where': 'outer'
}),
new ol.Feature({
g: new ol.geom.LineString([[10000000, 10000000], [10000000, -10000000]]),
'color': '#013',
'where': 'outer'
}),
new ol.Feature({
g: new ol.geom.LineString([[10000000, -10000000], [-10000000, -10000000]]),
'color': '#013',
'where': 'outer'
})
]);
var map = new ol.Map({
layers: new ol.Collection([vector]),
renderer: ol.RendererHint.CANVAS,
target: 'map',
view: new ol.View2D({
center: new ol.Coordinate(0, 0),
zoom: 2
})
});