BUT what I don't unterstand is the relation of the gallery and the picture measures to each other. What's the logic behind it and how can I calculate the perfect gallery size according to my already converted pictures?
Within a gallery, Juicebox reserves space for the thumbnails and the remainder is used for the image area. This is true no matter what the dimensions of the gallery are.
By default, Juicebox then scales the main image to fit within the image area as large as possible without cropping but whilst respecting the image's aspect ratio.
In your test gallery, image #4 is a different shape to image #3.
If the image has a different aspect ratio to the image area, then the only way for Juicebox to fill the image area with the image would be to set imageScaleMode="FILL" (although, for image #4 in your gallery, this would result in the left and right edges of the image being cropped).
Another possible solution to reduce the space above and below image #4 in your gallery would be to reduce the gallery's height so that the aspect ratio of the image area within the gallery matches the aspect ratio of your images.
Please see this FAQ for further information.
My Juicebox gallery shows too much space above or below the main image, how do I fix this?