Question

我正在使用高级图表，即如何使图例与更多列垂直对齐图例（而不是导航图例），js 小提琴

https://jsfiddle.net/aarthi_101/ruw8t3p9/6/

legend: {
      layout: 'vertical',
      align: 'right',
      verticalAlign: 'top'
      itemMarginBottom: 5
    }

Answer 1

您可以通过一些技巧来实现图例的外观。将图例的类型更改为floating并设置spacingRight以创建图例的空间。请注意，它是使用默认的水平 layout完成的。 legend.width和legend.itemWidth使您可以确保使用2列（width / itemWidth必须大于或等于2且小于3）。 legend.x调整整个图例的位置。

  chart: {
    marginRight: 200,
    (...)
  },

  legend: {
    floating: true,
    align: 'right',
    itemMarginBottom: 5,
    width: 180,
    x: 25,
    itemWidth: 90
  },

实时演示： https://jsfiddle.net/BlackLabel/avo0cgnt/

API参考： https://api.highcharts.com/highcharts/

用两列在高图中垂直对齐图例

1 个答案: