4

I'm stuck with something simple. I'm trying to draw a multilinestring from a GeoJSON file in a Leaflet map. I've taken the GeoJSON data from an application (built with OpenLayers + GeoServer), which is not mine, but the path I want to draw is exactly the same, so those coordinates serve my purpose.

First thing I don't understand is what are all those numbers that appear after longitude and latitude:

{"type":"MultiLineString","coordinates":[[[17.64145777,40.50170982,0],[4.42581744,11.11602236,4519487.27618627],[4.51125612,0,1232693.68416716],[42.92545724,0,0],

If I use the GeoJSON as it is, it shows strange results. See it here: https://codepen.io/Kata3890/pen/gOdmdRq

enter image description here

I tried to get rid of those numbers and use only the long/lat coordinates:

"type":"MultiLineString",
        "coordinates":[
           [
              [
                 17.64145777,
                 40.50170982
              ],
              [
                 17.64256586,
                 40.50200452
              ],

but then again the result is a bunch of crossing lines and gaps in the line when I zoom the map: See it here: https://codepen.io/Kata3890/pen/yLxMxPJ

enter image description here

What is wrong here?

Edit: image of how the path should look like: enter image description here

3
  • Is this "application (built with OpenLayers + GeoServer)" available online? Does it request some WFS service?
    – TomazicM
    Commented Mar 2, 2023 at 13:47
  • Here it is: appia.beniculturali.it/appia It is feeded by a GeoServer in the same domain. I got the coordinates from appia.beniculturali.it/geoserver/hub/… (I added &srsName=epsg:4326 at the end to get long/lat coordinates) Commented Mar 2, 2023 at 14:12
  • I'm not some GeoServer or WFS expert, but I would say that server returns wrong/mangled coordinates with WFS request. The correct image above comes from WMS service.
    – TomazicM
    Commented Mar 2, 2023 at 18:02

1 Answer 1

5

I managed to partly resolve the mystery of GeoJSON returned by WFS service. There are still some coordinates missing, but that's probably consequence of some configuration error on GeoServer.

First I called WFS without srsName=epsg:4326 parameter and got the following result:

{
  "type": "FeatureCollection",
  "totalFeatures": 439,
  "features": [
    {
      "type": "Feature",
      "id": "vw_appia_cammino.fid-33ff99b0_186a32cb3fd_222b",
      "geometry": {
        "type": "MultiLineString",
        "coordinates": [
          [
            [
              1232637.59780902,
              4519475.4590854,
              0
            ],
            [
              0,
              1232662.16392913,
              4519487.27618627
            ],
            [
              0,
              0,
              1232693.68416716
            ],
            [
              4519502.58434888,
              0,
              0
            ],
            [
              1232728.41700269,
              4519517.51341278,
              0
            ],
.
.
.
  "crs": {
    "type": "name",
    "properties": {
      "name": "urn:ogc:def:crs:EPSG::32632"
    }
  }
}

There is obviously some error in coordinates returned. It seems like third coordinate is inserted and then coordinates are somehow shifted, and this cyclically repeats every four coordinates.

If coordinates are cleaned up and converted from EPSG::32632 to EPSG:4326 with proj4.js with this code:

road.features.forEach(function(feature) {
  var coords = feature.geometry.coordinates;
  coords.forEach(function(lineCoords, k) {
    var newLineCoords = [];
    var newCoord;
    for (var i = 0; i < lineCoords.length; i += 4) {
      newCoord = [];
      newCoord[0] = lineCoords[i][0];
      newCoord[1] = lineCoords[i][1];
      newLineCoords.push(newCoord);
      if ((i + 1) == lineCoords.length) break;
      newCoord = [];
      newCoord[0] = lineCoords[i + 1][1];
      newCoord[1] = lineCoords[i + 1][2];
      newLineCoords.push(newCoord);
      if ((i + 3) >= lineCoords.length) break;
      newCoord = [];
      newCoord[0] = lineCoords[i + 2][2];
      newCoord[1] = lineCoords[i + 3][0];
      newLineCoords.push(newCoord);
    }
    coords[k] = newLineCoords;
  }); 
});

var epsg32632 = new L.Proj.CRS('EPSG:32632','+proj=utm +zone=32 +datum=WGS84 +units=m +no_defs +type=crs');

function coordsToLatLng(coords) {
  var latLng = epsg32632.unproject(L.point(coords[0], coords[1]));
  return latLng;
};

L.geoJson(road, {
   coordsToLatLng: coordsToLatLng,
   style: function (feature) {
       return {
         stroke: true,
         color: "red", 
         weight: 5};
   }
}).addTo(map);

then result seems OK, excepts for coordinates missing at the end of sections, which is probably consequence of mentioned coordinate shift:

enter image description here

4
  • TomazicM, you are amazing. Thank you very much!! I never could have figure this out by myself. I really appreciate your help. However, as I zoom in, the gaps are more evident, they are everywhere... so I think using WMS should be the way to go instead of WFS. Commented Mar 3, 2023 at 12:30
  • Having a look to the code in appia.beniculturali.it/appia/js/appia_map.js I see they call the WMS like this: source: new ol.source.ImageWMS({ url: 'appia.beniculturali.it/geoserver/wms', params: {'LAYERS': 'hub:appia_tutte_le_tappe_del_cammino'}, ratio: 1, serverType: 'geoserver' }) Can I abuse your wisdom and ask which of the available WMS is loading there? Commented Mar 3, 2023 at 12:31
  • If you go to appia.beniculturali.it/geoserver/web/wicket/bookmarkable/… and type "appia_tutte" in the search box you can see a list of the WMS available. Which one are they using? Commented Mar 3, 2023 at 12:32
  • TomazicM, forget my previous messages. I was lucky enough to find the coordinates of the "Appian Way" in the English Wikipedia. I have a nice correct path now: codepen.io/Kata3890/pen/poOPLxY I accept your answer since you found out and solve the original problem. Thanks again and I hope your answer may inspire others in the future. Commented Mar 3, 2023 at 13:43

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.