drupal-quartiersdedemain/web/modules/custom/q2d_mod/templates/svg-mapsites.html.twig

<div id="sites-map-container">
  {# <svg {{ svg_attributes }}>
    <path {{ path_attributes }}></path>
  </svg> #}
  <svg
      width="100%"
      height="auto"
      viewBox="0 0 {{ vpw }} {{ vph }}"
      version="1.1"
      id="svg1"
      xmlns="http://www.w3.org/2000/svg"
      xmlns:svg="http://www.w3.org/2000/svg">

      <g
        id="layer1"
        width="auto"
      height="100%"
              transform="
          translate(-34,-43)
          scale(3 3)"
        > 
        <g
          id="g87"
          transform="matrix(0.26458333,0,0,0.26458333,-117.12499,-462.76799)"
          >
          <path
            d="M 22.94948,0 24.34889,-18.0149 0,-25.72302 5.65439,-72.56693 20.36713,-85.65977 31.67962,-51.59929 30.80613,-4.91625 Z"
            style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
            transform="matrix(1.3333333,0,0,-1.3333333,1086.6494,2370.4282)"
            id="path86" />
          <path
            d="M 213.91022,-8.56159 245.88833,0 c 0,0 58.73522,-78.05274 188.63529,-102.77609 0,0 -13.72994,-23.9062 -20.7684,-68.77233 l -46.76509,-59.13289 22.59883,4.10628 9.98215,-59.15478 -15.22238,-6.69194 c 0,0 21.10627,-42.02694 33.11738,-51.15904 l -49.61728,-51.89156 c 0,0 -54.37257,40.3184 -83.08495,23.05862 -26.13166,-16.38332 -20.26669,-47.73592 -20.26669,-47.73592 l -84.48157,7.5286 -73.42912,23.87167 c 0,0 13.68285,68.86637 13.5616,120.85908 l 13.70164,-16.03089 -8.31311,25.90453 c -7.71795,24.04996 -30.44003,42.76792 -30.59939,44.58536 -3.6948,42.13802 -38.37183,51.8082 -82.82932,56.0101 L 0,-120.94655 l 48.38804,11.38921 63.90371,-13.15789 c 0,0 -1.62874,19.5427 -17.78042,51.54499 l 20.25382,7.61331 c 0,0 16.51357,-27.83033 25.80184,-26.51089 4.8781,0.69253 23.95695,21.70897 32.12568,26.76126 7.32295,4.5292 35.79484,10.58956 36.55389,13.534 2.94469,10.87069 4.66366,41.21097 4.66366,41.21097 z"
            style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
            transform="matrix(1.3333333,0,0,-1.3333333,543.93475,1857.6088)"
            id="path87" />
        </g>
      </g>
      <g
        id="layer2">
          {{ sites|raw }}
      </g>
    </svg>

    <!-- Fond du modal -->
    <div id="modal-background" class="modal-background"></div>

    <!-- Popup -->
    <div id="popup" class="popup">
      <p id="popup-content">Hello! I am a popup!</p>
      <!--<button onclick="closePopup()">Close</button>-->
    </div>
</div>