166 lines
4.6 KiB
JavaScript
166 lines
4.6 KiB
JavaScript
'use strict';
|
|
|
|
function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
|
|
|
|
var constants = require('./constants');
|
|
var utils = require('./utils');
|
|
require('echarts/lib/chart/funnel');
|
|
var Core = _interopDefault(require('./core'));
|
|
|
|
function getFunnelTooltip(dataType, digit) {
|
|
return {
|
|
trigger: 'item',
|
|
formatter: function formatter(item) {
|
|
var tpl = [];
|
|
tpl.push(constants.itemPoint(item.color));
|
|
tpl.push(item.name + ': ' + utils.getFormated(item.data.realValue, dataType, digit));
|
|
return tpl.join('');
|
|
}
|
|
};
|
|
}
|
|
|
|
function getFunnelLegend(args) {
|
|
var data = args.data,
|
|
legendName = args.legendName;
|
|
|
|
return {
|
|
data: data,
|
|
formatter: function formatter(name) {
|
|
return legendName[name] != null ? legendName[name] : name;
|
|
}
|
|
};
|
|
}
|
|
|
|
function getFunnelSeries(args) {
|
|
var dimension = args.dimension,
|
|
metrics = args.metrics,
|
|
rows = args.rows,
|
|
sequence = args.sequence,
|
|
ascending = args.ascending,
|
|
label = args.label,
|
|
labelLine = args.labelLine,
|
|
itemStyle = args.itemStyle,
|
|
filterZero = args.filterZero,
|
|
useDefaultOrder = args.useDefaultOrder;
|
|
|
|
var series = { type: 'funnel' };
|
|
var innerRows = rows.sort(function (a, b) {
|
|
return sequence.indexOf(a[dimension]) - sequence.indexOf(b[dimension]);
|
|
});
|
|
|
|
if (filterZero) {
|
|
innerRows = innerRows.filter(function (row) {
|
|
return row[metrics];
|
|
});
|
|
}
|
|
|
|
var falseFunnel = false;
|
|
innerRows.some(function (row, index) {
|
|
if (index && row[metrics] > innerRows[index - 1][metrics]) {
|
|
falseFunnel = true;
|
|
return true;
|
|
}
|
|
});
|
|
|
|
var step = 100 / innerRows.length;
|
|
|
|
if (falseFunnel && !useDefaultOrder) {
|
|
series.data = innerRows.slice().reverse().map(function (row, index) {
|
|
return {
|
|
name: row[dimension],
|
|
value: (index + 1) * step,
|
|
realValue: row[metrics]
|
|
};
|
|
});
|
|
} else {
|
|
series.data = innerRows.map(function (row) {
|
|
return {
|
|
name: row[dimension],
|
|
value: row[metrics],
|
|
realValue: row[metrics]
|
|
};
|
|
});
|
|
}
|
|
|
|
if (ascending) series.sort = 'ascending';
|
|
if (label) series.label = label;
|
|
if (labelLine) series.labelLine = labelLine;
|
|
if (itemStyle) series.itemStyle = itemStyle;
|
|
return series;
|
|
}
|
|
|
|
var funnel$1 = function funnel$$1(outerColumns, outerRows, settings, extra) {
|
|
var columns = outerColumns.slice();
|
|
var rows = outerRows.slice();
|
|
var _settings$dataType = settings.dataType,
|
|
dataType = _settings$dataType === undefined ? 'normal' : _settings$dataType,
|
|
_settings$dimension = settings.dimension,
|
|
dimension = _settings$dimension === undefined ? columns[0] : _settings$dimension,
|
|
_settings$sequence = settings.sequence,
|
|
sequence = _settings$sequence === undefined ? rows.map(function (row) {
|
|
return row[dimension];
|
|
}) : _settings$sequence,
|
|
_settings$digit = settings.digit,
|
|
digit = _settings$digit === undefined ? 2 : _settings$digit,
|
|
ascending = settings.ascending,
|
|
label = settings.label,
|
|
labelLine = settings.labelLine,
|
|
_settings$legendName = settings.legendName,
|
|
legendName = _settings$legendName === undefined ? {} : _settings$legendName,
|
|
itemStyle = settings.itemStyle,
|
|
filterZero = settings.filterZero,
|
|
useDefaultOrder = settings.useDefaultOrder;
|
|
var tooltipVisible = extra.tooltipVisible,
|
|
legendVisible = extra.legendVisible;
|
|
|
|
var metrics = void 0;
|
|
if (settings.metrics) {
|
|
metrics = settings.metrics;
|
|
} else {
|
|
var metricsTemp = columns.slice();
|
|
metricsTemp.splice(columns.indexOf(dimension), 1);
|
|
metrics = metricsTemp[0];
|
|
}
|
|
|
|
var tooltip = tooltipVisible && getFunnelTooltip(dataType, digit);
|
|
var legend = legendVisible && getFunnelLegend({ data: sequence, legendName: legendName });
|
|
var series = getFunnelSeries({
|
|
dimension: dimension,
|
|
metrics: metrics,
|
|
rows: rows,
|
|
sequence: sequence,
|
|
ascending: ascending,
|
|
label: label,
|
|
labelLine: labelLine,
|
|
itemStyle: itemStyle,
|
|
filterZero: filterZero,
|
|
useDefaultOrder: useDefaultOrder
|
|
});
|
|
var options = { tooltip: tooltip, legend: legend, series: series };
|
|
return options;
|
|
};
|
|
|
|
var _extends = Object.assign || function (target) {
|
|
for (var i = 1; i < arguments.length; i++) {
|
|
var source = arguments[i];
|
|
|
|
for (var key in source) {
|
|
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
target[key] = source[key];
|
|
}
|
|
}
|
|
}
|
|
|
|
return target;
|
|
};
|
|
|
|
var index = _extends({}, Core, {
|
|
name: 'VeFunnel',
|
|
data: function data() {
|
|
this.chartHandler = funnel$1;
|
|
return {};
|
|
}
|
|
});
|
|
|
|
module.exports = index;
|