Skip to content

GitLab

Commit 71899064 authored by duminil's avatar duminil
Browse files

OpenLayers quick start example.

parent 5af70bab
Hide whitespace changes
Inline Side-by-side
website/gmaps/index.html 0 → 100644
View file @ 71899064
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-1">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<title> Simstadt Region Chooser </title>
<meta name="keywords" content="polygon,creator,google map,v3,draw,paint">
<meta name="description" content="Google Map V3 Polygon Creator for Simstadt">
<link rel="stylesheet" type="text/css" href="style.css">
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="proj4.js"></script>
<script type="text/javascript" src="polygon.js"></script>
<script type="text/javascript">
$(function(){
//create map
var gruenbuehl =new google.maps.LatLng(48.881, 9.213);
var myOptions = {
zoom: 16,
center: gruenbuehl ,
mapTypeId: google.maps.MapTypeId.HYBRID
}
map = new google.maps.Map(document.getElementById('main-map'), myOptions);
var creator = new PolygonCreator(map);
//reset
$('#reset').click(function(){
creator.destroy();
creator=null;
creator=new PolygonCreator(map);
});
});
</script>
</head>
<body>
<div id="header">
<ul>
<li class="title">
Simstadt Region Chooser
</li>
</ul>
<p>
<span class="instruction">Demo Instruction:</span>
Left click on the map to create markers, when last marker meets first marker, it will form a polygon.
</p>
</div>
<div id="main-map">
</div>
<div id="side">
<input id="reset" value="Reset" type="button" class="navi"/>
<div id="dataPanel">
</div>
</div>
</body>
</html>
website/index.html
View file @ 71899064
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-1">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<title> Simstadt Region Chooser </title>
<meta name="keywords" content="polygon,creator,google map,v3,draw,paint">
<meta name="description" content="Google Map V3 Polygon Creator for Simstadt">
<link rel="stylesheet" type="text/css" href="style.css">
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="proj4.js"></script>
<script type="text/javascript" src="polygon.js"></script>
<script type="text/javascript">
$(function(){
//create map
var gruenbuehl =new google.maps.LatLng(48.881, 9.213);
var myOptions = {
zoom: 16,
center: gruenbuehl ,
mapTypeId: google.maps.MapTypeId.HYBRID
}
map = new google.maps.Map(document.getElementById('main-map'), myOptions);
var creator = new PolygonCreator(map);
//reset
$('#reset').click(function(){
creator.destroy();
creator=null;
creator=new PolygonCreator(map);
});
});
</script>
</head>
<body>
<div id="header">
<ul>
<li class="title">
Simstadt Region Chooser
</li>
</ul>
<p>
<span class="instruction">Demo Instruction:</span>
Left click on the map to create markers, when last marker meets first marker, it will form a polygon.
</p>
</div>
<div id="main-map">
</div>
<div id="side">
<input id="reset" value="Reset" type="button" class="navi"/>
<div id="dataPanel">
</div>
</div>
</body>
</html>
<!doctype html>
<html lang="en">
<head>
<link rel="stylesheet" href="http://openlayers.org/en/v3.4.0/css/ol.css" type="text/css">
<style>
.map {
height: 400px;
width: 100%;
}
</style>
<script src="http://openlayers.org/en/v3.4.0/build/ol.js" type="text/javascript"></script>
<title>OpenLayers 3 example</title>
</head>
<body>
<h2>My Map</h2>
<div id="map" class="map"></div>
<script type="text/javascript">
var map = new ol.Map({
target: 'map',
layers: [
new ol.layer.Tile({
source: new ol.source.MapQuest({layer: 'sat'})
})
],
view: new ol.View({
center: ol.proj.transform([37.41, 8.82], 'EPSG:4326', 'EPSG:3857'),
zoom: 4
})
});
</script>
</body>
</html>
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

Dies ist die Gitlab-Instanz des Transferportals der Hochschule für Technik Stuttgart. Hier geht es zurück zum Portal