Changement de position entre un champ ACF et l'affichage en front | Forum WordPress
Merci de vous inscrire pour participer au forum
Invité

7 juillet 2023
Bonjour,
Je travaille avec ACF Openstreetmap Field sur le site web d’un client.
Je saisis une adresse dans l’administration (prenons par exemple « Route de Cruciata, 20166 Pietrosella, Corse ») et lorsque je zoome sur la carte, tout va bien, j’obtiens une position semblable à celle-ci : 41.8440158, 8.7823428.
Cependant, lorsque j’affiche la carte sur le site web via un template en récupérant les données, j’obtiens une adresse quelque part à proximité, mais pas au point exact (environ à 500 mètres de distance : 41.8368279, 8.7780762).
Lorsque je regarde les valeurs de longitude (lng) et de latitude (lat), elles sont déjà incorrectes. Quelque chose se produit entre l’enregistrement dans l’administration et la récupération des données dans mon fichier.
Voici une partie de mon code :
jQuery(document).ready(function($){var zoomvalue = 4.8;
var largeurf = $(window).width();if(largeurf >=768){ zoomvalue = 5.4;}
if(largeurf >=992){ zoomvalue = 5.5;}
if(largeurf >=1200){ zoomvalue = 5.6;}// console.log(zoomvalue);
//Initialisation de la carte sur Londres
var map = L.map('carte-programmes').setView([46.5177483, 0.6572277], zoomvalue); // LIGNE 18//Ajout du fond de carte
var Jawg_Streets = L.tileLayer('https://{s}.tile.jawg.io/jawg-sunny/{z}/{x}/{y}{r}.png?access-token={accessToken}', {
minZoom: 0,
maxZoom: 22,
subdomains: 'abcd',
accessToken: 'XXXX (hidden on purpose)'
});
map.addLayer(Jawg_Streets);//Mise en place des clusters et du CSS des clusters
var markersCluster = new L.MarkerClusterGroup({
iconCreateFunction: function(cluster) {
return L.divIcon({
html: cluster.getChildCount(),
className: 'mycluster',
iconSize: null
});
}
});//Customise les icones de marqueur au zoom
var customIcon = L.icon({
iconUrl: '<?php print $img;?>marker.png',
shadowUrl: '<?php print $img;?>marker-shadow.png',
iconSize: [64, 64], // taille de l'icone
shadowSize: [64, 64], // taille de l'ombre
iconAnchor: [32, 64], // point de l'icone qui correspondra à la position du marqueur
shadowAnchor: [32, 64], // idem pour l'ombre
popupAnchor: [-3, -76] // point depuis lequel la popup doit s'ouvrir relativement à l'iconAnchor
});
L.Marker.mergeOptions({
icon: customIcon
});//Prépare tous les marqueurs correspondants aux programmes et génère les popups
<?php foreach($idsprog->posts as $idprog):?>
var latLng = new L.LatLng(<?php print get_field('adresse',$idprog)['lat'];?>,<?php print get_field('adresse', $idprog)['lng'];?>);var marker = new L.Marker(latLng);
marker.bindPopup(
'<a href="<?php the_permalink($idprog);?>" class="produit popup_carte">' +
'<div class="visuel">' +
'<img src="<?php print get_field('vignette',$idprog)['sizes']['330x200'];?>" />' +
'<div class="textes-visuel">' +
'<div class="type"><?php foreach(get_field('type_logement',$idprog) as $type):?><?php print $type;?><span class="slash"> / </span><?php endforeach;?></div>'+
'<div class="livraison">Livraison <?php print (get_field('annee_livraison',$idprog) > 1) ? the_field('annee_livraison',$idprog) : 'immédiate';?></div>' +
'</div>' +
'</div>' +
'<div class="textes">' +
'<h4><?php print get_the_title($idprog);?></h4>' +
'<div class="lieu"><?php print addslashes(get_term(get_field('lieu',$idprog), 'lieux')->name);?></div>' +
<?php if( have_rows('prix',$idprog) ): the_row();?>
'<div class="prix">À partir de <?php print preg_replace('/(?<=\d)(?=(\d{3})+$)/', ' ', trim(get_sub_field('prix_prog',$idprog)));?>€</div>' +
<?php endif;?>
'</div>' +
'</a>'
);
markersCluster.addLayer(marker);
<?php endforeach;?>map.addLayer(markersCluster);
});
Merci pour votre aide. Le site fonctionne depuis 2-3 ans et maintenant il y a ce problème. Je ne sais pas s'il est nouveau ou si on n'avait jamais remarqué le problème, mais ça me semblerait bizarre qu'on ne l'ait pas vu plus tôt...
7 juillet 2023
Mince, mon copier-coller du code est tout pété, et je ne trouve pas comment modifier ou supprimer le message. Je retente ici :
jQuery(document).ready(function($){
var zoomvalue = 4.8;
var largeurf = $(window).width();
if(largeurf >=768){ zoomvalue = 5.4;}
if(largeurf >=992){ zoomvalue = 5.5;}
if(largeurf >=1200){ zoomvalue = 5.6;}
// console.log(zoomvalue);
//Initialisation de la carte sur Londres
var map = L.map(‘carte-programmes’).setView([46.5177483, 0.6572277], zoomvalue); // LIGNE 18
//Ajout du fond de carte
var Jawg_Streets = L.tileLayer(‘https://{s}.tile.jawg.io/jawg-sunny/{z}/{x}/{y}{r}.png?access-token={accessToken}’, {
minZoom: 0,
maxZoom: 22,
subdomains: ‘abcd’,
accessToken: ‘XXXX (hidden on purpose)’
});
map.addLayer(Jawg_Streets);
//Mise en place des clusters et du CSS des clusters
var markersCluster = new L.MarkerClusterGroup({
iconCreateFunction: function(cluster) {
return L.divIcon({
html: cluster.getChildCount(),
className: ‘mycluster’,
iconSize: null
});
}
});
//Customise les icones de marqueur au zoom
var customIcon = L.icon({
iconUrl: ‘<?php print $img;?>marker.png’,
shadowUrl: ‘<?php print $img;?>marker-shadow.png’,
iconSize: [64, 64], // taille de l’icone
shadowSize: [64, 64], // taille de l’ombre
iconAnchor: [32, 64], // point de l’icone qui correspondra à la position du marqueur
shadowAnchor: [32, 64], // idem pour l’ombre
popupAnchor: [-3, -76] // point depuis lequel la popup doit s’ouvrir relativement à l’iconAnchor
});
L.Marker.mergeOptions({
icon: customIcon
});
//Prépare tous les marqueurs correspondants aux programmes et génère les popups
<?php foreach($idsprog->posts as $idprog):?>
var latLng = new L.LatLng(<?php print get_field(‘adresse’,$idprog)[‘lat’];?>,<?php print get_field(‘adresse’, $idprog)[‘lng’];?>);
var marker = new L.Marker(latLng);
marker.bindPopup(
‘<a href= »<?php the_permalink($idprog);?> » class= »produit popup_carte »>’ +
‘<div class= »visuel »>’ +
‘<img src= »<?php print get_field(‘vignette’,$idprog)[‘sizes’][‘330×200′];?> » />’ +
‘<div class= »textes-visuel »>’ +
‘<div class= »type »><?php foreach(get_field(‘type_logement’,$idprog) as $type):?><?php print $type;?><span class= »slash »> / </span><?php endforeach;?></div>’+
‘<div class= »livraison »>Livraison <?php print (get_field(‘annee_livraison’,$idprog) > 1) ? the_field(‘annee_livraison’,$idprog) : ‘immédiate’;?></div>’ +
‘</div>’ +
‘</div>’ +
‘<div class= »textes »>’ +
‘<h4><?php print get_the_title($idprog);?></h4>’ +
‘<div class= »lieu »><?php print addslashes(get_term(get_field(‘lieu’,$idprog), ‘lieux’)->name);?></div>’ +
<?php if( have_rows(‘prix’,$idprog) ): the_row();?>
‘<div class= »prix »>À partir de <?php print preg_replace(‘/(?<=\d)(?=(\d{3})+$)/’, ‘ ‘, trim(get_sub_field(‘prix_prog’,$idprog)));?>€</div>’ +
<?php endif;?>
‘</div>’ +
‘</a>’
);
markersCluster.addLayer(marker);
<?php endforeach;?>
map.addLayer(markersCluster);
});
Nb max. d'utilisateurs en ligne :615
Actuellement en ligne :
6 Invité(s)
Actuellement sur cette page :
1 Invité(s)
Auteurs les plus actifs :
Bruno: 52
david: 47
Robin: 44
vKr_Onii: 41
Gayraud: 29
Nouveaux membres :
SonChomley
dominicn06
ThomasWeara
RebbaLancaster
King079293
Statistiques du forum :
Groupes :1
Forums :7
Topics :760
Posts :2717
Statistiques des membres :
Invités: 75
Membres : 12172
Modérateurs : 16
Admins: 2
Administrateurs :Litzelmann, TL
Modérateurs :Gebhard, Catherine1, zapps, soborne, mojiezuo, Jeff, redwhirl, Jessica, spleen13, Alain Web-creator, kaepaul, Samson, Ailpp84, Catherine2, Fatalys, Therese
Se connecter
Derniers messages
- Maximizing Profits and Trading Experience with AI Stock Trading Apps Par RebbaLancaster
2 jours auparavant - Build your own Next Gen NFT gaming platform at lower cost Par Josh little
3 jours auparavant - How to Create an On-demand App for Business Owners Par jamieelucass
3 jours auparavant - Tofacitinib 5 mg for Rheumatoid Arthritis: Your Comprehensive Guide Par emergencydrugcompany
1 semaine auparavant - Binance Clone Script - Game-changer for Crypto startups Par jamieelucass
2 semaines auparavant