1

Im looking to create a map that can be interactive.

The best option that I found is leaflet, the thing is I don't find any resource explaining how to create my own map.

Im looking to create an indoor map where user can see all the building

How could I achieve that ?

Improve this question
2
  • 1
    Do you have a familiarity with HTML and JavaScript? Have you looked at Leaflet.indoor?
    – Barbarossa
    Commented Jul 29, 2015 at 15:50
  • @Barbarossa Yeah of course Im a JS developper. I looked at leaflet.indoor it kind of what Im looking to achieve but without the real world map just the mall map
    – Isaac
    Commented Jul 29, 2015 at 17:08

2 Answers 2

Reset to default
3

You can try to use this tutorial from MapBox to get started.

You will need to create your own GeoJSON data for the stores and fountains that you want to display, and you can use this website to generate the GeoJSON file.

Improve this answer
4
  • Im looking to build the indoor map of a single mall not to locate store on a real world map
    – Isaac
    Commented Jul 29, 2015 at 17:10
  • Although the example I put there is showing stores as points, however, you can create a GeoJOSN file with polygons that represent the indoor stores. And you can remove the base map so you app would look like an actual indoor map.
    – Vanni Zhang
    Commented Jul 29, 2015 at 17:15
  • Good idea @Vanni Zhang, I was looking on the net and in the leaflet documentation any tutorial that could explain me how to remove the base map and replace it preferably with a custom color or with an image ? Could you point me in a direction ?
    – Isaac
    Commented Jul 29, 2015 at 17:21
  • @Isaac, check out this example (jsfiddle.net/vannizhang/pxm4b7z3/3) that I just put together on jsfiddle, it shows a geojson file with polygons without displaying the base map.
    – Vanni Zhang
    Commented Jul 29, 2015 at 17:50
1

The first question is what do you mean by interactive? Do you just mean basic pan and zoom, or do you need to let users click the map to get information on features?

If you have an image of the mall layout, and want a simple interactive map image with pan and zoom, check out these two tutorials for using Leaflet as a kind of zoom image tool:

http://kempe.net/blog/2014/06/14/leaflet-pan-zoom-image.html http://blog.thematicmapping.org/2013/06/showing-zoomify-images-with-leaflet.html

If your image is large and you want to create a pyramid of image tiles, check out gdal2tiles.py

For more complex interactivity in a map with pixel coordinates (as opposed to real-world coordinate reference system), check out the following discussion on SO (a bit old but may get you started).

Improve this answer
1
  • By interactive I mean click on a rectangle and having the store information...
    – Isaac
    Commented Jul 29, 2015 at 18:09

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.