reactjs - 如何在 React Chartjs 中获取压缩圆图？

Question

我想介绍一个压缩圆图（气泡图的一种变体，仅包含半径作为其维度）。React Chartjs甚至Chartjs只支持气泡图，不支持压缩圆图。这是我要添加的预期图表的示例

我可以得到这样的东西react-chartjs吗？例如，需要为定期启动气泡图执行以下操作。

const defaultDatasets = [
            {
              label: ["China"],
              backgroundColor: "rgba(255,221,50,0.2)",
              borderColor: "rgba(255,221,50,1)",
              data: [{
                x: 735,
                y: 50,
                r: 15
              }]
            }, {
              label: ["Denmark"],
              backgroundColor: "rgba(60,186,159,0.2)",
              borderColor: "rgba(60,186,159,1)",
              data: [{
                x: 116,
                y: 50,
                r: 10
              }]
            }, {
              label: ["Germany"],
              backgroundColor: "rgba(0,0,0,0.2)",
              borderColor: "#000",
              data: [{
                x: 2116,
                y: 50,
                r: 15
              }]
            }
          ]

由于我的要求是压缩圆图，所以我有两个选择。

• 我可以省略x和y值。但随后所有的泡沫都被弄乱了。
• 我可以随机化x和y值并隐藏轴。但是，随机化并不能保证任何气泡重叠，或者可能会使一些气泡集中到一个点。

是否有任何技巧或解决方法可以像上图那样以良好的顺序显示气泡？

标签： reactjschart.jsbubble-chartreact-chartjs-2