CODEWITHSUNDEEP
mapboxmapbox-gl-jsmapbox-marker
B. Bob
B. Bob

Reputation: 23

Draw multiple lines from one point in Mapbox

I would like to create a tree/chain of lines in Mapbox where multiple lines would branch out of one point or marker like this: Europe Map

I am able to create a simple line with a line string:

map.on("load", function () {
    addLines();
  });
function addLines() {
  console.log(coordinateList);
  map.addSource("route", {
    type: "geojson",
    data: {
      type: "Feature",
      properties: {},
      geometry: {
        type: "LineString",
        coordinates: coordinateList,
      },
    },
  });
  map.addLayer({
    id: "route",
    type: "line",
    source: "route",
    layout: {
      "line-join": "round",
      "line-cap": "round",
    },
    paint: {
      "line-color": "#a1c2f7",
      "line-width": 4,
    },
  });
}

I also tried replacing the coordinateList variable with a nx2 array of coordinates without success:

[[[lat1,lng1],[lat2,lng2]],[[lat1,lng1],[lat3,lng3]]]

I have not found related info in documentation and past questions so any direction on how to do this would be helpful.

Upvotes: 0

Views: 1564

Answers (1)

B. Bob
B. Bob

Reputation: 23

Replacing "LineString" with "MultiLineString" using the nx2 format above worked for this problem

Upvotes: 2

Related Questions