在页面上放置多个 raphael.js 对象

Question

我是 raphael.js 的新手，想用它来制作显示进度百分比的小饼图。我已经准备好绘制图表的功能，如果页面上只有一个图表，它会很好地工作。但是，当我添加其他元素时，图表会重叠。我遍历.min-pie-chart 元素：

$(".min-pie-chart").each(function () {
  var value = $(this).data("percent");
  Raphael($(this), 20, 20).minPieChart(10, 10, 8, value, "rgb(89,185,86)", "rgb(75,175,72)");
});

我猜这对我来说也是一个新的 css 问题。

演示位于here。

感谢任何帮助。

Answer 1

您需要根据某些因素调整其位置。在这种情况下，根据列表中的索引调整偏移量可能是有意义的。

你可以从匿名函数中获取索引...

each(function (index) {

然后

minPieChart(30, (index + 1) * 20, 8, value,

例如。 jsfiddle