in src/component/legend/LegendView.ts [188:315]
each(legendModel.getData(), function (legendItemModel, dataIndex) {
const name = legendItemModel.get('name');
// Use empty string or \n as a newline string
if (!this.newlineDisabled && (name === '' || name === '\n')) {
const g = new Group();
// @ts-ignore
g.newline = true;
contentGroup.add(g);
return;
}
// Representitive series.
const seriesModel = ecModel.getSeriesByName(name)[0] as
SeriesModel<SeriesOption & SymbolOptionMixin>;
if (legendDrawnMap.get(name)) {
// Have been drawn
return;
}
// Legend to control series.
if (seriesModel) {
const data = seriesModel.getData();
const lineVisualStyle = data.getVisual('legendLineStyle') || {};
const legendIcon = data.getVisual('legendIcon');
/**
* `data.getVisual('style')` may be the color from the register
* in series. For example, for line series,
*/
const style = data.getVisual('style');
const itemGroup = this._createItem(
seriesModel, name, dataIndex,
legendItemModel, legendModel, itemAlign,
lineVisualStyle, style, legendIcon, selectMode, api
);
itemGroup.on('click', curry(dispatchSelectAction, name, null, api, excludeSeriesId))
.on('mouseover', curry(dispatchHighlightAction, seriesModel.name, null, api, excludeSeriesId))
.on('mouseout', curry(dispatchDownplayAction, seriesModel.name, null, api, excludeSeriesId));
if (ecModel.ssr) {
itemGroup.eachChild(child => {
const ecData = getECData(child);
ecData.seriesIndex = seriesModel.seriesIndex;
ecData.dataIndex = dataIndex;
ecData.ssrType = 'legend';
});
}
if (triggerEvent) {
itemGroup.eachChild(child => {
this.packEventData(child, legendModel, seriesModel, dataIndex, name);
});
}
legendDrawnMap.set(name, true);
}
else {
// Legend to control data. In pie and funnel.
ecModel.eachRawSeries(function (seriesModel) {
// In case multiple series has same data name
if (legendDrawnMap.get(name)) {
return;
}
if (seriesModel.legendVisualProvider) {
const provider = seriesModel.legendVisualProvider;
if (!provider.containName(name)) {
return;
}
const idx = provider.indexOfName(name);
let style = provider.getItemVisual(idx, 'style') as PathStyleProps;
const legendIcon = provider.getItemVisual(idx, 'legendIcon');
const colorArr = parse(style.fill as ColorString);
// Color may be set to transparent in visualMap when data is out of range.
// Do not show nothing.
if (colorArr && colorArr[3] === 0) {
colorArr[3] = 0.2;
// TODO color is set to 0, 0, 0, 0. Should show correct RGBA
style = zrUtil.extend(zrUtil.extend({}, style), { fill: stringify(colorArr, 'rgba') });
}
const itemGroup = this._createItem(
seriesModel, name, dataIndex,
legendItemModel, legendModel, itemAlign,
{}, style, legendIcon, selectMode, api
);
// FIXME: consider different series has items with the same name.
itemGroup.on('click', curry(dispatchSelectAction, null, name, api, excludeSeriesId))
// Should not specify the series name, consider legend controls
// more than one pie series.
.on('mouseover', curry(dispatchHighlightAction, null, name, api, excludeSeriesId))
.on('mouseout', curry(dispatchDownplayAction, null, name, api, excludeSeriesId));
if (ecModel.ssr) {
itemGroup.eachChild(child => {
const ecData = getECData(child);
ecData.seriesIndex = seriesModel.seriesIndex;
ecData.dataIndex = dataIndex;
ecData.ssrType = 'legend';
});
}
if (triggerEvent) {
itemGroup.eachChild(child => {
this.packEventData(child, legendModel, seriesModel, dataIndex, name);
});
}
legendDrawnMap.set(name, true);
}
}, this);
}
if (__DEV__) {
if (!legendDrawnMap.get(name)) {
console.warn(
name + ' series not exists. Legend data should be same with series name or data name.'
);
}
}
}, this);