Commander1024/lostplaces-backend
Commander1024/lostplaces-backend
1
0
Fork 0
Code Issues 14 Pull Requests Releases Wiki Activity

Fixed indentation again. Because I'm stupid ;-)

Browse Source
This commit is contained in:
Marcus Scholz 2020-08-22 09:22:20 +02:00
parent 04940a0901
commit a0627761a7
1 changed files with 61 additions and 61 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

120
lostplaces/lostplaces_app/templates/partials/osm_map.html
View File

@ -2,68 +2,68 @@
<div id="map" class="map" style="height: 300px"></div> <div id="map" class="map" style="height: 300px"></div>
<div id="info" class="map-popup"></div> <div id="info" class="map-popup"></div>
<script type="text/javascript"> <script type="text/javascript">
var map = new ol.Map({ var map = new ol.Map({
target: 'map', target: 'map',
layers: [ layers: [
new ol.layer.Tile({ new ol.layer.Tile({
source: new ol.source.OSM() source: new ol.source.OSM()
}), }),
], ],
view: new ol.View({ view: new ol.View({
center: ol.proj.fromLonLat([{{place_map_center|last}}, {{place_map_center|first}}]), center: ol.proj.fromLonLat([{{place_map_center|last}}, {{place_map_center|first}}]),
zoom: 9 zoom: 9
})
});
var vectorSource = new ol.source.Vector({
features: [
{% for place in place_list %}
new ol.Feature({
geometry: new ol.geom.Point(
ol.proj.fromLonLat([{{place.longitude}},{{place.latitude}}])
),
url: '{% url 'place_detail' pk=place.pk %}',
name: '{{place.name}}'
}),
{% endfor %}
]
});
var markerVectorLayer = new ol.layer.Vector({
source: vectorSource,
style: new ol.style.Style({
image: new ol.style.Icon({
anchor: [0.5, 46],
anchorXUnits: 'fraction',
anchorYUnits: 'pixels',
scale: 0.3,
src: 'http://icons.iconarchive.com/icons/paomedia/small-n-flat/128/map-marker-icon.png'
})
}) })
});
map.addLayer(markerVectorLayer);
var overlay = new ol.Overlay({
element: document.getElementById('info'),
positioning: 'bottom-left'
});
overlay.setMap(map);
map.on(['singleclick'], function(evt) {
var feature = map.forEachFeatureAtPixel(evt.pixel, function(feature) {
window.open(feature.get('url'), '_blank');
}); });
});
map.on(['pointermove'], function(evt) { var vectorSource = new ol.source.Vector({
var feature = map.forEachFeatureAtPixel(evt.pixel, function(feature) { features: [
overlay.setPosition(evt.coordinate.map(element => element + 1)); {% for place in place_list %}
overlay.getElement().innerHTML = feature.get('name'); new ol.Feature({
return feature; geometry: new ol.geom.Point(
ol.proj.fromLonLat([{{place.longitude}},{{place.latitude}}])
),
url: '{% url 'place_detail' pk=place.pk %}',
name: '{{place.name}}'
}),
{% endfor %}
]
}); });
overlay.getElement().style.display = feature ? '' : 'none';
document.body.style.cursor = feature ? 'pointer' : '';
});
</script> var markerVectorLayer = new ol.layer.Vector({
source: vectorSource,
style: new ol.style.Style({
image: new ol.style.Icon({
anchor: [0.5, 46],
anchorXUnits: 'fraction',
anchorYUnits: 'pixels',
scale: 0.3,
src: 'http://icons.iconarchive.com/icons/paomedia/small-n-flat/128/map-marker-icon.png'
})
})
});
map.addLayer(markerVectorLayer);
var overlay = new ol.Overlay({
element: document.getElementById('info'),
positioning: 'bottom-left'
});
overlay.setMap(map);
map.on(['singleclick'], function(evt) {
var feature = map.forEachFeatureAtPixel(evt.pixel, function(feature) {
window.open(feature.get('url'), '_blank');
});
});
map.on(['pointermove'], function(evt) {
var feature = map.forEachFeatureAtPixel(evt.pixel, function(feature) {
overlay.setPosition(evt.coordinate.map(element => element + 1));
overlay.getElement().innerHTML = feature.get('name');
return feature;
});
overlay.getElement().style.display = feature ? '' : 'none';
document.body.style.cursor = feature ? 'pointer' : '';
});
</script>