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

a marqué ce sujet comme résolu.

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.

+0 -0

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 ?

Connectez-vous pour pouvoir poster un message.
Connexion

Pas encore membre ?

Créez un compte en une minute pour profiter pleinement de toutes les fonctionnalités de Zeste de Savoir. Ici, tout est gratuit et sans publicité.
Créer un compte