knightss27 / grafana-network-weathermap

A fully featured and customizable network weathermap plugin for Grafana (9.0+).
https://grafana.com/grafana/plugins/knightss27-weathermap-panel/
Apache License 2.0
139 stars 7 forks source link

Zoom on map #32

Open OCrylic opened 1 year ago

OCrylic commented 1 year ago

Hi @knightss27,

I encounter some "difficulties" regarding the size of the viewbox, so here is a suggestion of enhancement.

From what I understand, I have to choices to size the map:

The first one is great to control the size of the viewbox but is not ideal nor dynamic The second one is more dynamic but when I build the network weathermap I have to think and make calculation of the map size according my drawing to display it correctly and fix the zoom correctly with the mouse while editing. Sometimes, according the size of the panel, the map is not always on the same place inside the panel (might move from left to center). Also, while being a read_only user, I cannot change the zoom level.

A suggestion would be to have the same configuration as the Geomap panel from Grafana:

That way, if I am just a viewer, I can resize the panel and keep consistent view , but I also can keep the same size but zoom in or out or move the map to see what I need.

What do you think of this ?

image image

nadriang commented 1 year ago

A zoom feature will be really helpful. I hope it will be on priority list for the next versions. @OCrylic very nice description and great job with the addon @knightss27, thank you.

knightss27 commented 1 year ago

Ok, I can definitely just expose the zoom level and possibly centering to the editor.

Also, while being a read_only user, I cannot change the zoom level.

Hadn't realized this but it makes sense. Zooming got restricted to only be changed in editing mode, as otherwise when you scroll past the window it can be annoying, and I felt that realistically most people keep the weathermap just up in a place to glance at, but I do see how if you wanted to have someone view the weathermap and also have the ability to zoom this wouldn't work. I will add a separate key you are able to hold while using the map outside of editing that lets you zoom.

Also the "viewbox" has a bit of a mixed up role as it stands, which I'm not entirely sure how to fix. The viewbox field when editing the weathermap directly informs the underlying SVG viewbox attribute. For most people, they shouldn't have to touch this since just zooming out and panning should let them fix most things to fit. But I still have it exposed for whatever reason.

Sometimes, according the size of the panel, the map is not always on the same place inside the panel (might move from left to center).

This is because the SVG's width/height on the screen (so not the "viewbox" which is internal to the SVG, but the SVG element's own width/height) attempts to fit to the smaller dimension of the size of the panel. This is why when you have no viewbox size it doesn't respond dynamically. If your "viewbox" is a square (i.e. 600x600) then the SVG will try and fit your panel's size based on that -- i.e. the SVG will move to the right if you make your panel a long rectangle, as it is fitting the SVG to the height of the panel and then centering horizontally.

So I can make sure to add read_only zooming ability, and I can expose the zoom level attribute. I need to investigate a little more about having a "centered on" attribute since currently I just use an "offset" value which tells the SVG how far off from the original (0,0) centered position to draw stuff.

OCrylic commented 1 year ago

Hi @knightss27,

OK, looking forward to this.

knightss27 commented 1 year ago

I've gone ahead to allow zooming / moving outside of edit mode, so view-only users can just peruse around as they see fit. I've also exposed the zoom level and the default offsets, so you can set them to specific numbers, though this doesn't work quite the way I think the map centering you mentioned does. The new release (v0.3.4) is awaiting review from Grafana as it stands.