Map zoom and center

[bidsinga]

As part of #10, we're manually adding the marker count of each country. A logical thing to do is to add the functionality to click on the marker count button, and then zoom in and make the map center to those coordinates. This has to be done manually, and I've been able to make it work partially, but not completely yet, as I ran into the following problems.

Attempt 1 When clicked on a button that holds the total amount of markers of a certain country, a function clickmarkercounter() is actived. The zoom is increased with zoom++. The coordinates of the selected country are also passed to the coordinates that are used by the map. All seems to work fine, except for when you drag the map to another section (thus different center coordinates) and then zoom in. In the zoom, the map seems to look for the latest saved coordinates, which are still the ones assigned to after the function clickmarkercounter() was triggered. The map relocates to those coordinates which is not what we want.

Attempt 2 In order to save the live coordinates each time the map has moved, I added @move="movemapfunction()" to v-map. This function is triggered each time the map moves. It updates the used coordinates with the last coordinates of the mapObject. But when the button is called, function clickmarkercounter() is triggered again, zooms in and changes the coordinates, but the map doesn't move as the movemapfunction() seems to overrule changing the coordinates.

It feels like I'm close to the solution, but missing out on something. I placed the code in src/components/Map/MapNew.vue

See also this commit.

[bidsinga]

There is now a test environment with route /maptest, in which you can test the new map function, it's still in #24

[bidsinga]

With our latest commits, this issue have been solved!