Bubble chart label placement algorithm? (preferabl

2019-03-08 07:46发布

I'd like to automatically place 100-200 bubble labels so that the following requirements are met:

  • Labels should not overlap
  • Labels should preferably not overlap bubbles
  • Label should be close to bubble
  • Preferred label position (top left, top, bottom, right etc.) should be respected to some extent
  • Font-size can vary

Are there any helpful libraries / algorithms for this? (preferably JavaScript or PHP)

(The label placement in the image does not meet these requirements)

enter image description here

9条回答
SAY GOODBYE
2楼-- · 2019-03-08 08:19

I think if you are using D3 inside your tools, you can use "force-based" label placement algorithm. The solution originally belongs to Max Planck Research Networks but there is already a ready-made Javascript example, here: Force-based label placement in D3

手持菜刀,她持情操
3楼-- · 2019-03-08 08:28

How about

label.substring(0, Math.sqrt(bubbleValueOrRadius))

I found this in one of protovis.js examples.

Juvenile、少年°
4楼-- · 2019-03-08 08:29

I found an approach in Java actually for this problem that actually works and is called Force Directed Map Labeling and is an open-source academy experience.

Here is the documentation + project source code: Force Directed Map Labeling

登录 后发表回答