Project lat/long to pixels

Question

I´m making an app for smartwatches, where I need to draw the track user is currently using. The track consists of lat/long pairs.

So far I´ve tried many functions, but with this one below I got most consistent results yet there are tracks, that got deformed, like squashed or the route was shifted.

function transformToPixels(lat, lon){
        var westLongitude = boundingBox[1].toDegrees()[1]; 
        var eastLongitude = boundingBox[0].toDegrees()[1];
        var northLatitude = boundingBox[1].toDegrees()[0];
        var southLatitude = boundingBox[0].toDegrees()[0];
        var longitudeDiff = eastLongitude - westLongitude;
        var latitudeDiff = northLatitude - southLatitude;
        var xPixel = (((eastLongitude - lon) / (longitudeDiff).toDouble()) * DISPLAY_WIDTH).toNumber();
        var yPixel = (((northLatitude - lat) / (latitudeDiff).toDouble()) * DISPLAY_HEIGHT).toNumber();
        var result = new [2];
        result[1] = xPixel - 3; //had to try/error these numbers to fit the line on the display
        result[0] = yPixel + 25; //had to try/error these numbers to fit the line on the display
        return result;
    }     

Here is the route drawn on phone from lat/long pairs:

And here is drawn on the smartwatch by projecting the same lat/long to X,Y pixels:

Then there is another route:

And here is drawn on the smartwatch by projecting the same lat/long to X,Y pixels:

Here are the GeoJsons from which I get the lat/long pairs.

This one is working fine: https://pastebin.com/1vx8S98V This one gets deformed: https://pastebin.com/4Mt4MpEq

I don´t need meter-perfect conversion, but the shape of the route shouldn´t be changed.