jqPlot - 当图例项较多时，饼图图例太高

Question

我正在使用jqPlot创建带有图例的饼图。我的jqPlot饼图选项的一部分如下所示:

seriesDefaults: {
    renderer: $.jqplot.PieRenderer,
    rendererOptions: {
        padding: 10,
        showDataLabels: true,
        dataLabelFormatString: '%.2f%%',
        sliceMargin: 2,
        startAngle: -90
    }
},
legend: {
    show: true,
    location: 'e',
    placement: 'outside',
    xoffset: 1,
    fontSize: '11px',
    rowSpacing: '10px',
    textColor: '#222222',
    fontFamily: 'Lucida Grande, Lucida Sans, Arial, sans-serif'
}

最近我遇到了一个问题，图例项太多（例如21个），导致我的图例框太高。 我想知道是否有一种方法可以：

1. 在图例框内垂直滚动
2. 以多列显示图例项（首选）

我尝试设置以下属性：

• numberRows
• numberColumns

我从这个页面上找到了这些属性：

$.jqplot.PieRenderer options

然而，它们似乎没有做出任何更改。

是否有人能够为我提供解决这个问题的好方法？

- jpen

Answer 1

尽量使用提供的列/行设置。我亲自检查过这些设置是有效的。只需确保在图例中设置rendererOptions内的numberColumns或numberRows，例如：

legend: { 
  show: true, 
  location: 'ne',
  rendererOptions: {numberColumns: 2}
}

如果这个方法不起作用，那么我必须说你的代码里可能隐藏了其他的 bug，请让我们查看代码，一起找到并解决这个 bug :)

- Boro

---

它奏效了！我真傻啊，在渲染选项之外添加了“numberColumns”。谢谢你的帮助！非常感激。 - jpen

没关系。我也犯过同样的错误。现在我总是会仔细检查文档和示例以确保无误。在这种特殊情况下，从文档本身来看，您认为它应该放在图例下面 :) - Boro

只是为了测试！如果需要限制行数，则该属性为numberRows：图例: { show: true, location: 'ne', rendererOptions: {numberRows: 20} } - ChoCho