php et js point carte cliquable

This commit is contained in:
ouidade 2024-11-07 21:43:28 +01:00
parent 7f5db774d6
commit ea811fccb5
2 changed files with 15 additions and 2 deletions

View File

@ -101,3 +101,14 @@ if (pageIdMatch) {
const matchingCircle = document.querySelector(`#site-${pageId} circle`); const matchingCircle = document.querySelector(`#site-${pageId} circle`);
if (matchingCircle) matchingCircle.setAttribute('fill', 'red'); if (matchingCircle) matchingCircle.setAttribute('fill', 'red');
} }
// Écouter les événements de clic sur le SVG
svgElement.addEventListener('click', function(event) {
if (event.target.tagName === 'circle' && event.target.classList.contains('site-link')) {
const targetUrl = event.target.getAttribute('data-url'); // Récupérer l'URL de redirection
if (targetUrl) {
window.location.href = targetUrl; // Rediriger vers l'URL cible
}
}
});

View File

@ -42,7 +42,8 @@ class SitesMap extends BlockBase {
$title = $site->get('title')->getString(); $title = $site->get('title')->getString();
$subtitle = $site->get('field_sous_titre')->getString(); $subtitle = $site->get('field_sous_titre')->getString();
$link_options = ['absolute' => FALSE, 'attributes' => ['class' => 'site-link']]; $link_options = ['absolute' => TRUE, 'attributes' => ['class' => 'site-link']]; // Passer 'absolute' à TRUE
$site_url = $site->toUrl('canonical', $link_options)->toString(); // URL absolue pour le data-url
$site_link_object = Link::createFromRoute("voir le site", 'entity.node.canonical', ['node' => $site->id()], $link_options); $site_link_object = Link::createFromRoute("voir le site", 'entity.node.canonical', ['node' => $site->id()], $link_options);
$link = $site_link_object->toString()->getGeneratedLink(); $link = $site_link_object->toString()->getGeneratedLink();
@ -71,6 +72,7 @@ class SitesMap extends BlockBase {
<circle <circle
class="site-link" class="site-link"
data-content="$datacontent" data-content="$datacontent"
data-url="$site_url"
cx="0" cy="0" r="$r" cx="0" cy="0" r="$r"
style="fill-opacity:1;fill-rule:nonzero;" /> style="fill-opacity:1;fill-rule:nonzero;" />
<path <path