@alicloud/cloud-charts
Version:

206 lines (174 loc) • 8.31 kB
JavaScript
import _extends from "@babel/runtime/helpers/extends";
/** 计算每个legend的统计数据 */
export function getStatistics(chart, statistics, legendField) {
// @ts-ignore
var data = [].concat(chart.filteredData);
chart === null || chart === void 0 ? void 0 : chart.views.map(function (view) {
// @ts-ignore
data = [].concat(data, view.filteredData);
}); // 将每类数据分类
var items = {};
data.forEach(function (item) {
var legendName = item[legendField];
if (!(legendName in items)) {
items[legendName] = [];
}
items[legendName].push(item);
});
var res = {};
Object.keys(items).forEach(function (name) {
var yValues = items[name].map(function (item) {
return item.y;
});
var statisticsRes = {};
statistics.forEach(function (statistic) {
if (statistic === 'min') {
statisticsRes.min = Math.min.apply(Math, yValues);
} else if (statistic === 'max') {
statisticsRes.max = Math.max.apply(Math, yValues);
} else if (statistic === 'avg') {
statisticsRes.avg = yValues.reduce(function (pre, cur) {
return pre + cur;
}, 0) / yValues.length;
} else {
statisticsRes.current = yValues[yValues.length - 1];
}
});
res[name] = statisticsRes;
});
return res;
}
/** 过滤legend */
function _filterLegend(chart, condition, legendField) {
var views = [].concat(chart === null || chart === void 0 ? void 0 : chart.views, [chart]);
views.forEach(function (view) {
var _view$getComponents;
view === null || view === void 0 ? void 0 : (_view$getComponents = view.getComponents()) === null || _view$getComponents === void 0 ? void 0 : _view$getComponents.forEach(function (co) {
if (co.type === 'legend') {
var items = co.component.getItems();
items.forEach(function (item) {
if (condition(item.id || item.name)) {
co.component.setItemState(item, 'checked', true);
co.component.setItemState(item, 'unchecked', false);
} else {
co.component.setItemState(item, 'checked', false);
co.component.setItemState(item, 'unchecked', true);
}
});
}
});
view.filter(legendField, condition);
});
chart.render();
}
/** 高亮legend */
export { _filterLegend as filterLegend };
function _highlightLegend(chart, condition, legendField) {
var views = [].concat(chart === null || chart === void 0 ? void 0 : chart.views, [chart]);
views.forEach(function (view) {
var _view$getComponents2;
view === null || view === void 0 ? void 0 : (_view$getComponents2 = view.getComponents()) === null || _view$getComponents2 === void 0 ? void 0 : _view$getComponents2.forEach(function (co) {
if (co.type === 'legend') {
var items = co.component.getItems();
items.forEach(function (item) {
if (condition(item.id || item.name)) {
co.component.setItemState(item, 'active', true);
co.component.setItemState(item, 'inactive', false);
} else {
co.component.setItemState(item, 'active', false);
co.component.setItemState(item, 'inactive', true);
}
});
}
});
view.getElements().forEach(function (element) {
var _data$legendField, _data$;
var data = element.getData();
var name = (_data$legendField = data === null || data === void 0 ? void 0 : data[legendField]) !== null && _data$legendField !== void 0 ? _data$legendField : data === null || data === void 0 ? void 0 : (_data$ = data[0]) === null || _data$ === void 0 ? void 0 : _data$[legendField];
if (condition(name)) {
element.setState('active', true);
} else {
element.setState('inactive', true);
}
});
});
}
/** 清除高亮 */
export { _highlightLegend as highlightLegend };
function _clearHighlight(chart) {
var views = [].concat(chart === null || chart === void 0 ? void 0 : chart.views, [chart]);
views.forEach(function (view) {
var _view$getComponents3;
view === null || view === void 0 ? void 0 : (_view$getComponents3 = view.getComponents()) === null || _view$getComponents3 === void 0 ? void 0 : _view$getComponents3.forEach(function (co) {
if (co.type === 'legend') {
var items = co.component.getItems();
items.forEach(function (item) {
co.component.setItemState(item, 'active', false);
co.component.setItemState(item, 'inactive', false);
});
}
});
view.getElements().forEach(function (element) {
element.clearStates();
});
});
}
/** 通过chartRef对外暴露的函数 */
export { _clearHighlight as clearHighlight };
var getFunctions = function getFunctions(base, config) {
return {
/** 获取chart实例 */
getChart: function getChart() {
return base.chart;
},
/** 获取legend信息,包括名称、颜色及改列数据统计信息 */
getLegendItems: function getLegendItems(statistics) {
var _base$chart, _base$chart$options, _base$chart$options$l;
if (statistics === void 0) {
statistics = [];
}
var chart = base.chart,
_base$legendField = base.legendField,
legendField = _base$legendField === void 0 ? 'type' : _base$legendField;
var statisticsRes = getStatistics(chart, statistics, legendField); // 对线柱图、线点图等配置了items的情况,直接读取items
if (base !== null && base !== void 0 && (_base$chart = base.chart) !== null && _base$chart !== void 0 && (_base$chart$options = _base$chart.options) !== null && _base$chart$options !== void 0 && (_base$chart$options$l = _base$chart$options.legends) !== null && _base$chart$options$l !== void 0 && _base$chart$options$l.items) {
var _base$chart2, _base$chart2$options, _base$chart2$options$;
return base === null || base === void 0 ? void 0 : (_base$chart2 = base.chart) === null || _base$chart2 === void 0 ? void 0 : (_base$chart2$options = _base$chart2.options) === null || _base$chart2$options === void 0 ? void 0 : (_base$chart2$options$ = _base$chart2$options.legends) === null || _base$chart2$options$ === void 0 ? void 0 : _base$chart2$options$.items.map(function (item) {
var _item$marker, _item$marker$style, _item$marker2, _item$marker2$style;
return _extends({
name: item.id || item.name,
color: (item === null || item === void 0 ? void 0 : (_item$marker = item.marker) === null || _item$marker === void 0 ? void 0 : (_item$marker$style = _item$marker.style) === null || _item$marker$style === void 0 ? void 0 : _item$marker$style.fill) || (item === null || item === void 0 ? void 0 : (_item$marker2 = item.marker) === null || _item$marker2 === void 0 ? void 0 : (_item$marker2$style = _item$marker2.style) === null || _item$marker2$style === void 0 ? void 0 : _item$marker2$style.stroke)
}, statisticsRes[item.id || item.name]);
});
}
return Object.keys(statisticsRes).map(function (name, index) {
var color = typeof (config === null || config === void 0 ? void 0 : config.colors) === 'function' ? config === null || config === void 0 ? void 0 : config.colors(name) : config === null || config === void 0 ? void 0 : config.colors[index % config.colors.length];
return _extends({
name: name,
color: color
}, statisticsRes[name]);
});
},
/** 过滤数据 */
filterLegend: function filterLegend(condition) {
var _base$legendField2 = base.legendField,
legendField = _base$legendField2 === void 0 ? 'type' : _base$legendField2;
_filterLegend(base.chart, condition, legendField);
},
/** 高亮元素 */
highlightLegend: function highlightLegend(condition) {
var _base$legendField3 = base.legendField,
legendField = _base$legendField3 === void 0 ? 'type' : _base$legendField3;
_highlightLegend(base.chart, condition, legendField);
},
/** 清除所有高亮状态 */
clearHighlight: function clearHighlight() {
_clearHighlight(base.chart);
}
};
};
export default (function (base, config) {
var ctx = {};
Object.assign(ctx, getFunctions(base, config));
return ctx;
});