fontFamily | String | "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif" | Font family inherited from global configuration
padding | Number | 10 | Padding between rows of colored boxes
generateLabels: | Function | `function(chart) { }` | Generates legend items for each thing in the legend. Default implementation returns the text + styling for the color box. See [Legend Item](#chart-configuration-legend-item-interface) for details.
+filter | Function | null | Filters legend items out of the legend. Receives 2 parameters, a [Legend Item](#chart-configuration-legend-item-interface) and the chart data
usePointStyle | Boolean | false | Label style will match corresponding point style (size is based on fontSize, boxWidth is not used in this case).
#### Legend Item Interface
beforeBuildLabels: noop,
buildLabels: function() {
var me = this;
- me.legendItems = me.options.labels.generateLabels.call(me, me.chart);
+ var labelOpts = me.options.labels;
+ var legendItems = labelOpts.generateLabels.call(me, me.chart);
+
+ if (labelOpts.filter) {
+ legendItems = legendItems.filter(function(item) {
+ return labelOpts.filter(item, me.chart.data);
+ });
+ }
+
if (me.options.reverse) {
- me.legendItems.reverse();
+ legendItems.reverse();
}
+
+ me.legendItems = legendItems;
},
afterBuildLabels: noop,
}]);
});
+ it('should filter items', function() {
+ var chart = window.acquireChart({
+ type: 'bar',
+ data: {
+ datasets: [{
+ label: 'dataset1',
+ backgroundColor: '#f31',
+ borderCapStyle: 'butt',
+ borderDash: [2, 2],
+ borderDashOffset: 5.5,
+ data: []
+ }, {
+ label: 'dataset2',
+ hidden: true,
+ borderJoinStyle: 'miter',
+ data: [],
+ legendHidden: true
+ }, {
+ label: 'dataset3',
+ borderWidth: 10,
+ borderColor: 'green',
+ pointStyle: 'crossRot',
+ data: []
+ }],
+ labels: []
+ },
+ options: {
+ legend: {
+ labels: {
+ filter: function(legendItem, data) {
+ var dataset = data.datasets[legendItem.datasetIndex];
+ return !dataset.legendHidden;
+ }
+ }
+ }
+ }
+ });
+
+ expect(chart.legend.legendItems).toEqual([{
+ text: 'dataset1',
+ fillStyle: '#f31',
+ hidden: false,
+ lineCap: 'butt',
+ lineDash: [2, 2],
+ lineDashOffset: 5.5,
+ lineJoin: undefined,
+ lineWidth: undefined,
+ strokeStyle: undefined,
+ pointStyle: undefined,
+ datasetIndex: 0
+ }, {
+ text: 'dataset3',
+ fillStyle: undefined,
+ hidden: false,
+ lineCap: undefined,
+ lineDash: undefined,
+ lineDashOffset: undefined,
+ lineJoin: undefined,
+ lineWidth: 10,
+ strokeStyle: 'green',
+ pointStyle: 'crossRot',
+ datasetIndex: 2
+ }]);
+ });
+
it('should draw correctly', function() {
var chart = window.acquireChart({
type: 'bar',