The problem concerned with the rendering of the label, and the coordinates as I understand it from pageX/pageY to take.
Yes, the coordinates must be taken from the click event.
Render the label should not cause any problem - just create an empty absolutely positioned div with the right class, and draw a circle in css is easy.
If you change the size of the image a label corresponding also to move.
This makes the task a little complicated. But only need to converterwith coordinates of the label when it was created in the interest of the map and position them - then the zoom will work as expected.
A simplified example: jsfiddle.net/alexey_m_ukolov/Lnvfju2b/24
The specific implementation depends on which browsers you want to support, and other features of the project, but the idea of this.
In my example, however, managed to give up interest in favor of the conversion of pixels depending on the zoom, but for the correct location already meets the browser itself. But I don't remember how well the browsers supported zoom, so I can not say how such an implementation is reliable.
that won't work in Firefox, so it's best to alter under transform: scale