[0001]
[0002]
[0003]
[0004]
[0005]
[0006]
[0007]
[0008]
[0009]
[0010]
[0011]
[0012]
[0013]
[0014]
[0015]
[0016]
[0017]
[0018]
[0019]
[0020]
[0021]
[0022]
[0023]
[0024]
[0025]
[0026]
[0027]
[0028]
[0029]
[0030]
[0031]
[0032]
[0033]
[0034]
[0035]
[0036]
[0037]
[0038]
[0039]
[0040]
[0041]
[0042]
[0043]
[0044]
[0045]
[0046]
[0047]
[0048]
[0049]
[0050]
[0051]
[0052]
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>OpenLayers</title>
<link rel="stylesheet" href="/openlayers/css/ol.css" type="text/css">
<script src="/openlayers/build/ol.js" type="text/JavaScript"></script>
</head>
<body>
<div id="map"></div>
<!-- <div id="map" style="width: 1050px; height: 500px;"></div> -->
<script>
var map = new ol.Map({
target: 'map',
renderer: 'canvas',
layers: [
new ol.layer.Tile({source: new ol.source.OSM()})
],
view: new ol.View({
//projection: 'EPSG:900913',
center: ol.proj.transform([138.6728100, -34.9180000],
'EPSG:4326', 'EPSG:3857'),
zoom: 5
})
});
var myImage = new Image(20,30);
myImage.src = '/wasd_root/src/utils/marker.png';
//Full Screen
var myFullScreenControl = new ol.control.FullScreen();
map.addControl(myFullScreenControl);
map.addOverlay(new ol.Overlay({
position: ol.proj.transform(
[138.6728100, -34.9180000],
'EPSG:4326',
'EPSG:3857'
),
element: myImage
}));
map.on('singleclick', function(evt) {
var coord = evt.coordinate;
var transformed_coordinate = ol.proj.transform(coord, "EPSG:900913",
"EPSG:4326");
console.log(transformed_coordinate);
alert(transformed_coordinate);
})
</script>
</body>
</html>