3 ms·

Ask HN: Offline display lat long on SVG map?

• solardev 4y ago
  It's not entirely clear to me what you're asking, so please excuse me if I misunderstood something (please do explain if that's the case!). If all you want is an offline map on your phone, you can already do that in Google Maps, just drag an area to download and you can position yourself using GPS and navigate around in it without needing internet. That lets you download a big area at a time (several hundred square miles). If you want something for the entire globe, you might need a different app, and it probably wouldn't be as detailed. The OpenStreetMap project has data for the whole world, to some fairly good level of detail (depending on where you are and what you need it for). The dataset comes in about 100 GB: https://wiki.openstreetmap.org/wiki/Downloading_data https://wiki.openstreetmap.org/wiki/Downloading_data and you can use one of these apps to view it: https://wiki.openstreetmap.org/wiki/Using_OpenStreetMap_offline https://wiki.openstreetmap.org/wiki/Using_OpenStreetMap_offl... Both Google Maps and OpenStreetMaps make extensive use of vector layers. An SVG is just one file format for storing vector shapes, but there are many others, and mapping apps usually use more specialized formats. But they are still vectors and share many of the advantages of SVG (smaller file size, cleaner lines, easier to edit, etc.) It's not really SVG but similar enough. If you're not just wanting that for personal use and you want to MAKE such a map yourself, it gets a bit more complicated. This is a helpful article on map projections, including lat long: https://www.esri.com/arcgis-blog/products/arcgis-pro/mapping/gcs_vs_pcs/#:~:text=What%20is%20the%20difference%20between,map%20or%20a%20computer%20screen https://www.esri.com/arcgis-blog/products/arcgis-pro/mapping.... An SVG (or any other vector shape) has no innate projection, it's just a bunch of lines and curves. You can georeference them (align a shape, like a building or lake outline) to real-world geography using GIS software, like the free and open source QGIS or paid software like ArcMap. Then you'd save that into some geo-enabled format. For the web that would be something like GeoJSON or one of the ESRI web formats. A geoJSON gives you vector shapes, much like SVG would, except they exist in some defined reference system of your choice (like the list here: https://en.wikipedia.org/wiki/EPSG_Geodetic_Parameter_Dataset#Common_EPSG_codes https://en.wikipedia.org/wiki/EPSG_Geodetic_Parameter_Datase...). You can use free software like Leaflet or OpenLayers to display them on a webpage. OpenLayers is good at taking different layers of geo data and reprojecting them on the fly to whatever you want, then you can add additional base layers (OpenStreetMap, aerial photos, whatever) below your vector shapes. If all of that is too complicated and you just want to make a simple map you can share with friends or whatever, maybe try Caltopo, Felt, or Google My Maps? If I totally misunderstood what you're asking, please do explain.
  • graderjs 4y ago
    Thanks..I think this points me in the right direction. I suppose what I'm wanting is to have an SVG map that is accurate in some map projection and then just plot a given latitude and longitude on it. I suppose basically what I want is self-hosted simple low resolution map that generally gives you an idea of where you are in the world once you have your latitude and longitude. I can get my latitude and longitude off my phone but to me those numbers don't mean anything with regards to geography. I just want a simple way to translate it into geography so you know it's mostly accurate for countries.. but obviously it's not a map that includes features like cities or streets or anything like that. The issue I see with using a maps provider is you need an API key and there's quota limits and there's all kind of things I just want to basically have my own stack and not have to depend on some other service.
    • solardev 4y ago
      You don't need any API keys or any payments or anything. Just get a "shapefile" or geojson of world countries, like this one: https://datahub.io/core/geo-countries https://datahub.io/core/geo-countries These are vector formats very similar to SVG except with an understanding of geo coordinate systems and projections. Then use openlayers or leaflet to render it in whatever projection you want, using wgs84 as your coordinate reference system. The earth isn't a perfect sphere so you can't just draw a floating grid around a ball and call it a day. The transformation math is complicated. You can look at the mapping engines source code if you want, or just use them. To add blue dot GPS positioning, you'll have to use Javascript to request the browser location or ip geolocation to guess it. Once you get that you can tell the openlayers to zoom to it and draw a dot and tell you which country it's in using by looking at how it intersects the country polygons. All of that is totally free with no API keys or payments. You can self host all of it with no third party connections.
      • graderjs 4y ago
        Thank you. That's perfect for me! :)