¿Dibujar polilíneas en Leaflet?

Question

Esta es la codificación que utilicé en Leaflet:

    var pointA = new L.LatLng(28.635308, 77.22496);
    var pointB = new L.LatLng(28.984461, 77.70641);
    var pointList = [pointA, pointB];

    var firstpolyline = new L.Polyline(pointList {
    color: 'red',
    weight: 3,
    opacity: 0.5
    smoothFactor: 1

    });

    map.addLayer(firstpolyline);

El mapa no muestra ningún resultado. Sólo necesito línea recta de un punto a otro, sólo visualizarlo, no geodésica correcta. Los puntos (en "círculos" Leaflet) se muestran perfectamente en el mapa.

Answer 1

¿Ha pegado el código directamente? Si es así,

var pointA = new L.LatLng(28.635308, 77.22496);
var pointB = new L.LatLng(28.984461, 77.70641);
var pointList = [pointA, pointB];

var firstpolyline = new L.polyline(pointList {
color: 'red',
weight: 3,
opacity: 0.5
smoothFactor: 1

});

le faltan comas en las líneas 5 y 8, y en la línea 12 utiliza firstpolyline.addTo(map) . Hazlo

var pointA = new L.LatLng(28.635308, 77.22496);
var pointB = new L.LatLng(28.984461, 77.70641);
var pointList = [pointA, pointB];

var firstpolyline = new L.Polyline(pointList, {
    color: 'red',
    weight: 3,
    opacity: 0.5,
    smoothFactor: 1
});
firstpolyline.addTo(map);

Answer 2

He utilizado el siguiente código para dibujar polyline entre varias ubicaciones:

var polylinePoints = [
    [37.781814, -122.404740],
    [37.781719, -122.404637],
    [37.781489, -122.404949],
    [37.780704, -122.403945],
    [37.780012, -122.404827]
  ];            

  var polyline = L.polyline(polylinePoints).addTo(map);

Para más información este enlace.

Answer 3

addLayer no funciona para mí, tenía que hacer .addTo(map)

Answer 4

Utilice "polilínea" en minúsculas en L.polyline(...) . Esto funcionará.

Answer 5

Si desea una trayectoria exacta (formas curvas), utilice polyline.antPath.