Desktop-like UI for the OpenLayers 3+ web mapping library.
Try the online demo!
This project is licensed under the 2-Clause BSD. This means you can use and modify it for free in private or commercial projects so long as you include the BSD copyright notice in it.
- Download the latest stable release
- Unpack the
distfolder to your project directory - Create a new
index.htmlfile, and copy in the contents below - Finally, open it in your favorite browser!
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>OLEditor - quick start example</title>
<!-- 1. include stylesheets in the header -->
<link rel="stylesheet" href="//openlayers.org/en/master/css/ol.css">
<link rel="stylesheet" href="ol.editor.css">
</head>
<body>
<!-- 2. place a map container somewhere in your document's body -->
<div id="map" class="map"></div>
<!-- 3. include the javascript librarys in the bottom of your document -->
<script src="http://openlayers.org/en/master/build/ol.js"></script>
<script src="ol.editor.js"></script>
<script>// and create the editor just like ol.Map
var editor = new ol.Editor({
target: 'map', // the ID of map container
controls: [ // the available controls
new ol.control.Zoom(),
new ol.control.ScaleLine(),
new ol.control.Attribution(),
// ... and the cool new controls
new ol.control.LayerManager(),
new ol.control.LayerControls(),
new ol.control.SelectionControls(),
new ol.control.EditingControls(),
new ol.control.Message(),
new ol.control.Projection()
],
layers: [ // add some layers
new ol.layer.Tile({
name: 'OpenStreetMap',
source: new ol.source.OSM()
}) //, ...
],
view: new ol.View({ // set the view settings
center: ol.proj.fromLonLat([37.41, 8.82]),
zoom: 4
})
});
// be happy! :)
</script>
</body>
</html>See the quick summary here or check out the source files in the src folder.
The original OpenLayers documentation can be found here, and a lot of examples can be found here.
Please use the GitHub issue tracker for all bugs and feature requests.
The develop branch holds the in-development version and the master branch holds the tested and stable version. If you're intrested in getting involved, make a GitHub account and send me pull requests.
I prefer beer.