Search code examples
javascriptopenlayers

Open Layers not displaying LineString added via addLayer on mobile

I have a line string that needs to be displayed. It is a collection of GeoJSON data.

I have a problem where this works fine when opened in the browser, but when I open it in the mobile browser, the line that I am adding is not displayed.

Function that adds routeLayer

 const route = new LineString(breaks)

 route.transform('EPSG:4326', 'EPSG:3857');

 const routeFeature = new Feature({
      type: 'route',
      geometry: route,
 });

 const features = [routeFeature];

 routeFeature.setStyle(mainRouteStyle);
 const mainRouteVector = new VectorLayer({
       source: new VectorSource({
              features,
       }),
 });

 map.addLayer(mainRouteVector);

I couldn't find anywhere what is wrong, I don't have any errors. I am adding geo markers also with the same method and they are displayed. I also tried putting a simple line that connects 2 coordinates and it is also not shown when I add it later with addLayer but when I include that in layers when initializing the map, it is shown.

Keep in mind that on desktop browser it is working fine, but on mobile it has problems. Does anybody know what is the issue?

Solution

  • Ok, turns out this was not the issue with OpenLayers, I had targeting localhost to get the geojson data, which on mobile is obviously not localhost.