Skip to content

Instantly share code, notes, and snippets.

@alperdincer
Created August 28, 2013 09:34
Show Gist options
  • Save alperdincer/6364139 to your computer and use it in GitHub Desktop.
Save alperdincer/6364139 to your computer and use it in GitHub Desktop.
OpenLayers v3 feature adding to vector layer - test
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Test</title>
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 5px; }
#mapDiv { width: 800px; height: 500px; }
</style>
<link rel="stylesheet" href="http://ol3js.org/en/master/build/ol.css" type="text/css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="http://ol3js.org/en/master/build/ol-simple.js"></script>
<script type="text/javascript">
var map, polygon, vectorLayer;
function initMap() {
var raster = new ol.layer.TileLayer({
visible: true,
preload: Infinity,
source: new ol.source.BingMaps({
key: 'AnomwJFerlTXXuM8oE-dbOU00vZNtU_eGc3CE9u_HPBWev4dGn-f3SaGFJNQ1m5z',
style: "Road"
})
});
map = new ol.Map({
layers: [raster],
renderer: ol.RendererHint.CANVAS,
target: 'mapDiv',
view: new ol.View2D({
center: ol.proj.transform([0, 0], 'EPSG:4326', 'EPSG:3857'),
zoom: 2
})
});
vectorLayer = new ol.layer.Vector({
source: new ol.source.Vector({
projection: ol.proj.get('EPSG:4326')
})
});
map.addLayer(vectorLayer);
drawGeom();
}
function drawGeom() {
var path = [[0,0], [30,30], [60,60], [0,0]];
polygon = new ol.geom.Polygon(path);
var feature = new ol.Feature();
feature.setGeometry(polygon);
vectorLayer.addFeatures(feature);
}
</script>
</head>
<body onload="initMap();">
<b>OLv3 Test</b><br>
<div id="mapDiv"></div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment