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 座標操作。