Lines not drawn correctly on globe projection about mapbox-gl-js

[mrjbq7]

I tried to use the arc.js plugin version 0.1.0, but it has weird rendering artifacts over the north pole, and I don't understand why a LineString wouldn't render correctly anyway.

<script src="https://api.mapbox.com/mapbox.js/plugins/arc.js/v0.1.0/arc.js"></script>

    let arcs = [];

    let start = { x: -122.375, y: 37.61899948120117};
    let end = { x: 55.3643989563, y: 25.2527999878};

    var generator = new arc.GreatCircle(start, end);
    var line = generator.Arc(100, { offset: 20});
    arcs.push(line.json());

    map.getSource('LineString').setData({
        'type': 'FeatureCollection',
        'features': arcs
    });

[chboing]

You should try mapbox-gl-draw-geodesic instead. https://www.npmjs.com/package/mapbox-gl-draw-geodesic
Mapbox is not drawing geodesic by default.

For the north pole bug . . there are already some issues around here.

You'll soon notice that it's above 85N or below 85S, and probably linked to the lack of map texture there. Seems like a common thing. Google maps or others have no tiles above or below this limit.

[mrjbq7]

@chboing thanks, I also looked at mapbox-gl-draw-geodesic, and it renders the lines in the correct orientation, but also has the North Pole drawing bug...