OpenStreetMap
This commit is contained in:
parent
43dd339c63
commit
9f1c3a98d2
@ -429,7 +429,7 @@ class IdentiteController extends Zend_Controller_Action
|
||||
$this->view->AuthorizeGeocode = $userAccessEdition;
|
||||
|
||||
// --- Gestion source
|
||||
$mapSource = 'google';
|
||||
$mapSource = 'openstreetmap';
|
||||
if ($mapSource == 'google') {
|
||||
$this->view->headScript()->appendFile('http://maps.google.com/maps/api/js?sensor=false', 'text/javascript');
|
||||
}
|
||||
@ -497,20 +497,20 @@ class IdentiteController extends Zend_Controller_Action
|
||||
|
||||
|
||||
$iconeMarqueur = $this->iconeDuMarqueur($etab->NafEtab, $etab->Siege, $etab->Actif);
|
||||
$icone = '';
|
||||
$icone = 'etab1.png';
|
||||
if ( !empty($iconeMarqueur) ) {
|
||||
$icone = 'http://'.$_SERVER['SERVER_NAME'].'/themes/default/images/maps/'.$iconeMarqueur;
|
||||
$icone = $iconeMarqueur;
|
||||
}
|
||||
$gps = array();
|
||||
if ( floatval($etab->GeoLatitude) != 0 && floatval($etab->GeoLongitude) != 0 ) {
|
||||
$gps = array(
|
||||
'lat' => $etab->GeoLatitude,
|
||||
'lon' => $etab->GeoLongitude,
|
||||
'lat' => $etab->GeoLatitude*1,
|
||||
'lon' => $etab->GeoLongitude*1,
|
||||
);
|
||||
}
|
||||
|
||||
$marks[] = array(
|
||||
'siret' => $siren.$etab->Nic,
|
||||
'siret' => $siren.' '.$etab->Nic,
|
||||
'address' => $adresse,
|
||||
'title' => $titre,
|
||||
'text' => $texte,
|
||||
|
@ -1,4 +1,4 @@
|
||||
<div id="map" class="map">Préparation de la carte ...</div>
|
||||
<div id="map" class="map"><div id="popup"></div></div>
|
||||
|
||||
<?php if ($this->source == 'google') {?>
|
||||
<script type="text/javascript">
|
||||
@ -29,7 +29,7 @@ function createMarker(m) {
|
||||
map: map,
|
||||
position: m.location,
|
||||
title: m.title,
|
||||
icon: m.icon,
|
||||
icon: '/themes/default/images/maps/' + m.icon,
|
||||
});
|
||||
// --- Info Window
|
||||
var infowindow = new google.maps.InfoWindow({
|
||||
@ -133,57 +133,99 @@ $(document).ready(function(){
|
||||
<?php if ($this->source == 'openstreetmap') {?>
|
||||
<script type="text/javascript">
|
||||
<?php echo 'var marks = '.$this->marks.';'?>
|
||||
var zoneMarker;
|
||||
var zoom = 6;
|
||||
var FCenterLng = 1.87528;
|
||||
var FCenterLat = 46.60611;
|
||||
|
||||
//--- Wait the document is ready
|
||||
$(document).ready(function(){
|
||||
// --- Create Markers
|
||||
var listSource = {};
|
||||
$.each(marks, function (i, item) {
|
||||
if (item.gps.lat && item.gps.lon) {
|
||||
var iconFeature = new ol.Feature({
|
||||
geometry: new ol.geom.Point(ol.proj.transform([item.gps.lon, item.gps.lat], 'EPSG:4326', 'EPSG:3857')),
|
||||
name: item.siret,
|
||||
text: item.text,
|
||||
});
|
||||
console.log(item.icon);
|
||||
if (typeof listSource[item.icon] === 'undefined') {
|
||||
listSource[item.icon] = new ol.source.Vector({});
|
||||
}
|
||||
var vectorSource = listSource[item.icon];
|
||||
vectorSource.addFeature(iconFeature);
|
||||
listSource[item.icon] = vectorSource;
|
||||
}
|
||||
});
|
||||
|
||||
// --- Create Layers
|
||||
var rasterLayer = new ol.layer.Tile({ source: new ol.source.OSM() });
|
||||
var listLayers = [rasterLayer];
|
||||
console.log(listSource);
|
||||
$.each(listSource, function (type, item) {
|
||||
// --- Create Style
|
||||
var iconStyle = new ol.style.Style({
|
||||
image: new ol.style.Icon(/** @type {olx.style.IconOptions} */ ({
|
||||
anchor: [0.5, 46],
|
||||
anchorXUnits: 'fraction',
|
||||
anchorYUnits: 'pixels',
|
||||
opacity: 0.75,
|
||||
src: '/themes/default/images/maps/' + type
|
||||
}))
|
||||
});
|
||||
var vectorLayer = new ol.layer.Vector({ source: item, style: iconStyle });
|
||||
listLayers.push(vectorLayer);
|
||||
});
|
||||
|
||||
// --- Load Map
|
||||
var map = new ol.Map({
|
||||
target: 'map',
|
||||
layers: [
|
||||
new ol.layer.Tile({
|
||||
source: new ol.source.OSM()
|
||||
})
|
||||
],
|
||||
layers: listLayers,
|
||||
view: new ol.View({
|
||||
center: ol.proj.transform([FCenterLng, FCenterLat], 'EPSG:4326', 'EPSG:3857'),
|
||||
zoom: zoom
|
||||
})
|
||||
});
|
||||
|
||||
// --- Zone des markers
|
||||
|
||||
// --- Create Markers
|
||||
$.each(marks, function (i, item){
|
||||
if (item.gps.lat && item.gps.lon) {
|
||||
|
||||
// Popup
|
||||
var element = document.getElementById('popup');
|
||||
var popup = new ol.Overlay({
|
||||
element: element,
|
||||
positioning: 'bottom-center',
|
||||
stopEvent: false
|
||||
});
|
||||
map.addOverlay(popup);
|
||||
|
||||
// display popup on click
|
||||
map.on('click', function(evt) {
|
||||
var feature = map.forEachFeatureAtPixel(evt.pixel,
|
||||
function(feature, layer) {
|
||||
return feature;
|
||||
});
|
||||
if (feature) {
|
||||
var geometry = feature.getGeometry();
|
||||
var coord = geometry.getCoordinates();
|
||||
popup.setPosition(coord);
|
||||
$(element).qtip({
|
||||
content: {
|
||||
title: feature.get('name'),
|
||||
text: feature.get('text'),
|
||||
},
|
||||
position: { my: 'bottom center', at: 'top center', adjust: { y: -30 } },
|
||||
style: { classes: 'qtip-light' }
|
||||
})
|
||||
$(element).qtip('api').show();
|
||||
/*$(element).popover({
|
||||
'placement': 'top',
|
||||
'html': true,
|
||||
'content': feature.get('name')
|
||||
});
|
||||
$(element).popover('show');*/
|
||||
} else {
|
||||
$(element).qtip('api').destroy();
|
||||
/*$(element).popover('destroy');*/
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
function createMarker(m){
|
||||
// --- Info Window, Create event marker
|
||||
var icon = $('<img src="' + m.icon + '">');
|
||||
//.tooltip({title: 'Hello, world!', trigger: 'click'})
|
||||
|
||||
// --- Marker options
|
||||
var marker = new ol.Overlay({
|
||||
position: ol.proj.transform([2, 46], 'EPSG:4326', 'EPSG:3857'),
|
||||
element: icon
|
||||
});
|
||||
map.addOverlay(marker);
|
||||
|
||||
// --- Extend map by adding marker
|
||||
//ol.control.ZoomToExtent ol.extent.boundingExtent
|
||||
}
|
||||
|
||||
</script>
|
||||
<?php }?>
|
@ -1 +1 @@
|
||||
.ol-mouse-position{top:8px;right:8px;position:absolute}.ol-scale-line{background:#95b9e6;background:rgba(0,60,136,.3);border-radius:4px;bottom:8px;left:8px;padding:2px;position:absolute}.ol-scale-line-inner{border:1px solid #eee;border-top:none;color:#eee;font-size:10px;text-align:center;margin:1px;will-change:contents,width}.ol-overlay-container{will-change:left,right,top,bottom}.ol-unsupported{display:none}.ol-viewport .ol-unselectable{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.ol-control{position:absolute;background-color:#eee;background-color:rgba(255,255,255,.4);border-radius:4px;padding:2px}.ol-control:hover{background-color:rgba(255,255,255,.6)}.ol-zoom{top:.5em;left:.5em}.ol-rotate{top:.5em;right:.5em;transition:opacity .25s linear,visibility 0s linear}.ol-rotate.ol-hidden{opacity:0;visibility:hidden;transition:opacity .25s linear,visibility 0s linear .25s}.ol-zoom-extent{top:4.643em;left:.5em}.ol-full-screen{right:.5em;top:.5em}@media print{.ol-control{display:none}}.ol-control button{display:block;margin:1px;padding:0;color:#fff;font-size:1.14em;font-weight:700;text-decoration:none;text-align:center;height:1.375em;width:1.375em;line-height:.4em;background-color:#7b98bc;background-color:rgba(0,60,136,.5);border:none;border-radius:2px}.ol-control button::-moz-focus-inner{border:none;padding:0}.ol-zoom-extent button{line-height:1.4em}.ol-compass{display:block;font-weight:400;font-size:1.2em;will-change:transform}.ol-touch .ol-control button{font-size:1.5em}.ol-touch .ol-zoom-extent{top:5.5em}.ol-control button:focus,.ol-control button:hover{text-decoration:none;background-color:#4c6079;background-color:rgba(0,60,136,.7)}.ol-zoom .ol-zoom-in{border-radius:2px 2px 0 0}.ol-zoom .ol-zoom-out{border-radius:0 0 2px 2px}.ol-attribution{text-align:right;bottom:.5em;right:.5em;max-width:calc(100% - 1.3em)}.ol-attribution ul{margin:0;padding:0 .5em;font-size:.7rem;line-height:1.375em;color:#000;text-shadow:0 0 2px #fff}.ol-attribution li{display:inline;list-style:none;line-height:inherit}.ol-attribution li:not(:last-child):after{content:" "}.ol-attribution img{max-height:2em;max-width:inherit}.ol-attribution button,.ol-attribution ul{display:inline-block}.ol-attribution.ol-collapsed ul{display:none}.ol-attribution.ol-logo-only ul{display:block}.ol-attribution:not(.ol-collapsed){background:rgba(255,255,255,.8)}.ol-attribution.ol-uncollapsible{bottom:0;right:0;border-radius:4px 0 0;height:1.1em;line-height:1em}.ol-attribution.ol-logo-only{background:0 0;bottom:.4em;height:1.1em;line-height:1em}.ol-attribution.ol-uncollapsible img{margin-top:-.2em;max-height:1.6em}.ol-attribution.ol-logo-only button,.ol-attribution.ol-uncollapsible button{display:none}.ol-zoomslider{top:4.5em;left:.5em;width:24px;height:200px}.ol-zoomslider-thumb{position:absolute;background:#7b98bc;background:rgba(0,60,136,.5);border-radius:2px;cursor:pointer;height:10px;width:22px;margin:3px}.ol-touch .ol-zoomslider{top:5.5em;width:2.052em}.ol-touch .ol-zoomslider-thumb{width:1.8em}.ol-overviewmap{left:.5em;bottom:.5em}.ol-overviewmap.ol-uncollapsible{bottom:0;left:0;border-radius:0 4px 0 0}.ol-overviewmap .ol-overviewmap-map,.ol-overviewmap button{display:inline-block}.ol-overviewmap .ol-overviewmap-map{border:1px solid #7b98bc;height:150px;margin:2px;width:150px}.ol-overviewmap:not(.ol-collapsed) button{bottom:1px;left:2px;position:absolute}.ol-overviewmap.ol-collapsed .ol-overviewmap-map,.ol-overviewmap.ol-uncollapsible button{display:none}.ol-overviewmap:not(.ol-collapsed){background:rgba(255,255,255,.8)}.ol-overviewmap-box{border:2px dotted rgba(0,60,136,.7)}
|
||||
.ol-control,.ol-scale-line{position:absolute;padding:2px}.ol-box{box-sizing:border-box;border-radius:2px;border:2px solid #00f}.ol-mouse-position{top:8px;right:8px;position:absolute}.ol-scale-line{background:rgba(0,60,136,.3);border-radius:4px;bottom:8px;left:8px}.ol-scale-line-inner{border:1px solid #eee;border-top:none;color:#eee;font-size:10px;text-align:center;margin:1px;will-change:contents,width}.ol-overlay-container{will-change:left,right,top,bottom}.ol-unsupported{display:none}.ol-viewport .ol-unselectable{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.ol-control{background-color:rgba(255,255,255,.4);border-radius:4px}.ol-control:hover{background-color:rgba(255,255,255,.6)}.ol-zoom{top:.5em;left:.5em}.ol-rotate{top:.5em;right:.5em;transition:opacity .25s linear,visibility 0s linear}.ol-rotate.ol-hidden{opacity:0;visibility:hidden;transition:opacity .25s linear,visibility 0s linear .25s}.ol-zoom-extent{top:4.643em;left:.5em}.ol-full-screen{right:.5em;top:.5em}@media print{.ol-control{display:none}}.ol-control button{display:block;margin:1px;padding:0;color:#fff;font-size:1.14em;font-weight:700;text-decoration:none;text-align:center;height:1.375em;width:1.375em;line-height:.4em;background-color:rgba(0,60,136,.5);border:none;border-radius:2px}.ol-control button::-moz-focus-inner{border:none;padding:0}.ol-zoom-extent button{line-height:1.4em}.ol-compass{display:block;font-weight:400;font-size:1.2em;will-change:transform}.ol-touch .ol-control button{font-size:1.5em}.ol-touch .ol-zoom-extent{top:5.5em}.ol-control button:focus,.ol-control button:hover{text-decoration:none;background-color:rgba(0,60,136,.7)}.ol-zoom .ol-zoom-in{border-radius:2px 2px 0 0}.ol-zoom .ol-zoom-out{border-radius:0 0 2px 2px}.ol-attribution{text-align:right;bottom:.5em;right:.5em;max-width:calc(100% - 1.3em)}.ol-attribution ul{margin:0;padding:0 .5em;font-size:.7rem;line-height:1.375em;color:#000;text-shadow:0 0 2px #fff}.ol-attribution li{display:inline;list-style:none;line-height:inherit}.ol-attribution li:not(:last-child):after{content:" "}.ol-attribution img{max-height:2em;max-width:inherit;vertical-align:middle}.ol-attribution button,.ol-attribution ul{display:inline-block}.ol-attribution.ol-collapsed ul{display:none}.ol-attribution.ol-logo-only ul{display:block}.ol-attribution:not(.ol-collapsed){background:rgba(255,255,255,.8)}.ol-attribution.ol-uncollapsible{bottom:0;right:0;border-radius:4px 0 0;height:1.1em;line-height:1em}.ol-attribution.ol-logo-only{background:0 0;bottom:.4em;height:1.1em;line-height:1em}.ol-attribution.ol-uncollapsible img{margin-top:-.2em;max-height:1.6em}.ol-attribution.ol-logo-only button,.ol-attribution.ol-uncollapsible button{display:none}.ol-zoomslider{top:4.5em;left:.5em;height:200px}.ol-zoomslider button{position:relative;height:10px}.ol-touch .ol-zoomslider{top:5.5em}.ol-overviewmap{left:.5em;bottom:.5em}.ol-overviewmap.ol-uncollapsible{bottom:0;left:0;border-radius:0 4px 0 0}.ol-overviewmap .ol-overviewmap-map,.ol-overviewmap button{display:inline-block}.ol-overviewmap .ol-overviewmap-map{border:1px solid #7b98bc;height:150px;margin:2px;width:150px}.ol-overviewmap:not(.ol-collapsed) button{bottom:1px;left:2px;position:absolute}.ol-overviewmap.ol-collapsed .ol-overviewmap-map,.ol-overviewmap.ol-uncollapsible button{display:none}.ol-overviewmap:not(.ol-collapsed){background:rgba(255,255,255,.8)}.ol-overviewmap-box{border:2px dotted rgba(0,60,136,.7)}
|
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue
Block a user