DC.js - 图例

图例是一种可附加的屏幕自定义功能。它可以添加到其他 DC 图表中以呈现水平图例标签。本章详细介绍了图例。

图例方法

图例支持以下重要方法。让我们详细了解一下每个方法。

autoItemWidth( [width])

此方法用于设置图例项的自动宽度开启或关闭。如果为真，则忽略 itemWidth。其定义如下：

legend.autoItemWidth = function (width) {
   if (!arguments.length) {
      return _width;
   }
}

gap( [gap])

此方法用于设置或获取图例项之间的间隙。其定义如下：

legend.gap = function (gap) {
   if (!arguments.length) {
      return _gap;
   }
}

horizontal( [h])

此方法用于水平定位图例，其定义如下。

_legend.horizontal = function (h) {
   if (!arguments.length) {
      return _h;
   }
};

itemHeight( [itemHeight])

此方法用于设置或获取图例项的高度。

legend.itemHeight = function (itemHeight) {
   if (!arguments.length) {
      return _itemHeight;
   }
};

itemWidth( [itemWidth])

此方法用于设置或获取水平图例的图例项宽度。

_legend.itemWidth = function (itemWidth) {
   if (!arguments.length) {
      return _itemWidth;
   }
};

legendText( [text])

此方法用于设置或获取图例文本函数。图例组件使用此函数来呈现每个项目的图例文本。如果未指定函数，则图例组件将显示与每个组关联的名称。下面显示了一个简单的示例：

legend.legendText(dc.pluck('name'))

maxItems( [items])

此方法用于显示最大数量的图例项。

x( [x])

它用于设置或获取图例组件的 x 坐标，其定义如下：

legend.x = function (x) {
   if (!arguments.length) {
      return _x;
   }
};

类似地，您还可以执行 y 坐标操作。