How to calculate SVG BBox in a Web Worker?

Question

I am developing a map app in which I am rendering labels client side, basically I am solving this problem. I have lots of labels, and before rendering them on screen, I need to do a pass in which I calculate where labels will be positioned, how much space they will take on screen, whether there are any overlaps etc. Since all this is time consuming, its being done on a web worker. To test if there is an overlap, I need to calculate the SVG BBox. How can I do this on a web worker? web worker does not have access to DOM. Even if it had, I don't want to be rendering anything on screen during this computation pass.

Answer 1

Since you can't access the DOM in a Web Worker, you can't accurately calculate the bounding box of a text label from within the worker.

Some possible work-arounds:

• Do the bounding box calculations on the main thread, then pass messages to the worker with the results. (You don't have to render anything to the screen: just make a detached SVG element that you don't append to the document.)
• Estimate the lengths, by pre-computing the individual character bounding boxes or estimating the average via em-width. After the worker is finished, do checking and correction in the main thread.