IE11 se gèle lors de l'affichage d'une polyline leaflet

Je suis nouveau sur Leaflet et j’ai une erreur quand j’affiche des polylines sous IE 11.

Ma page est très simple et fonctionne sur Chrome et FireFox. Je dessine juste un point et une polyline.

Tout va bien quand je dessine juste un marqueur mais lorsque j’ajoute une polyligne, sur IE, la navigation se passe très bien tant que la carte de l’écran n’atteint pas la polyline (niveau de zoom élevé). Dès que je fais un zoom arrière pour voir la polyline, IE11 se fige.

Une erreur est générée dans le script https://unpkg.com/leaflet@1.6.0/dist/leaflet.js (5,61705): [Impossible d’obtenir la propriété "x" d’une référence nulle ou non définie] sur la fonction :

    // return closest point on segment or distance to that point
function _sqClosestPointOnSegment(p, p1, p2, sqDist) {
var x = p1.x, // L'erreur se produit ici
    y = p1.y,
    dx = p2.x - x,
    dy = p2.y - y,
    dot = dx * dx + dy * dy,
    t;

if (dot > 0) {
    t = ((p.x - x) * dx + (p.y - y) * dy) / dot;

    if (t > 1) {
        x = p2.x;
        y = p2.y;
    } else if (t > 0) {
        x += dx * t;
        y += dy * t;
    }
}

dx = p.x - x;
dy = p.y - y;

return sqDist ? dx * dx + dy * dy : new Point(x, y);
}

Mon code est:

function init() {
   var Produit4 = {
    lat: 52,
    lon: 0,
  };
  var ZoomLevel = 7;
  var mymap = L.map("mapid").setView([Produit4.lat, Produit4.lon], ZoomLevel);
  var MainLayer = L.tileLayer(
    "https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token=sk.eyJ1IjoiYnJ1bm9nYXJuaWVyIiwiYSI6ImNrYmFzam9hdzA5OW0ycnB2Z2JxeXEwYmcifQ.m0w2z_IIm_M2JdO0W7mJBA",
    {
      attribution:
        "Map data © OpenStreetMap contributors, " +
        "CC-BY-SA, " +
        "Imagery © Mapbox",
      maxZoom: 18,
      id: "mapbox/streets-v11",
      tileSize: 512,
      zoomOffset: -1,
    }
  );
  L.Browser.touch = false;
  MainLayer.addTo(mymap);
  var rectangle = L.polyline([
    [46, -16],
    [62.75, -16],
    [62.75, 13],
    [46, 13],
  ]).addTo(mymap);
  var marker = L.marker([51.5, -0.09]).addTo(mymap);
}

Si jamais vous aviez besoin des autres fichiers, voici un codepen : https://codepen.io/bruno-garnier/pen/abdNXjR

Merci d’avance ! Bruno.

Bonjour Adri1, Oui, tu as raison, je vais arrêter de m’arracher les cheveux … Merci en tout cas !

Bonjour à tous, J’ai trouvé la solution. IE11 considère mon application comme un intranet (car elle se trouve sur mon ordinateur) Or, pour les sites intranet, IE11 fonctionne en mode de compatibilité IE7 (pourquoi ???). Donc, juste en désactivant le mode de compatibilité pour les sites intranet (dans outils/paramètres d’affichage de compatibilité), cela a résolu mon problème. Merci à Adri1 de s’être penché sur mon problème !

Btw, savez-vous comment on peut fermer un fil ?

@BrunoGarnier Hello, tu peux marquer le topic comme résolu via le menu latéral pour indiquer que le sujet est clos, ça devrait suffire

IE me fera toujours rire (jaune) avec son mode compatibilité et ses bugs sortis de l’ombre