mapboxgl.accessToken =
"pk.eyJ1Ijoib3R0eWxhYiIsImEiOiJjbTNsYmhxdWwwaWJtMnFxenIzNmJuaGJmIn0.QEnCKZZKJQBAbK8GFBzAcw";
const map = new mapboxgl.Map({
container: "map",
// Choose from Mapbox's core styles, or make your own style with Mapbox Studio
style: "mapbox://styles/mapbox/streets-v12",
center: [-79.4512, 43.6568],
zoom: 13
});
const style = [
{
id: "directions-origin-point",
type: "circle",
source: "directions",
paint: {
"circle-radius": 18,
"circle-color": "#ff0000"
},
filter: ["all", ["in", "$type", "Point"], ["in", "marker-symbol", "A"]]
}
];
map.addControl(
new MapboxDirections({
accessToken: mapboxgl.accessToken,
styles: style,
}),
"top-left"
);