Map v2

[JakovTomasic]

Make a better Map component. Related issues for reference: #75, #81, #79

Requirements:

• map should be drawn fast
• map should support ideally SVG images, png/jpeg is also acceptable
• we should be able to draw another (canvas and svg?) elements on the map. Like node dots and path lines.
• map should accept a rectangle (relative coordinates of the underlying map image) and should automatically resize content so that the whole rectangle is always visible. This should be responsive and update as window dimensions change. See #79
• ideally, map should support animations (e.g. arrows move along the path line). This doesn't need to be implemented for this issue, but keep it in mind.
• pinch zoom on touch devices as well as scroll zoom on mouse devices should be supported and smooth

Suggestions:

• create another test project that doesn't use nextjs or any not necessary libraries
• try to support everything we need without D3, if possible. I don't think it's very necessary
• I suggest testing map size as fill-parent (100% width and height). I suspect it to be similar in the production version.

[JakovTomasic]

Is this too optimistic? I am open to another ideas that would work fine for our requirements. But I feel that doing this manually is the easiest solution with the best map quality in the end.

[JakovTomasic]

Interesting resource I found: Adding_vector_graphics_to_the_Web