@visactor/vmind
Version:
<div align="center"> <a href="https://github.com/VisActor#gh-light-mode-only" target="_blank"> <img alt="VisActor Logo" width="200" src="https://github.com/VisActor/.github/blob/main/profile/logo_500_200_light.svg"/> </a> <a href="https://githu
224 lines (210 loc) • 6.07 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: !0
}), exports.pipelineRankingBar = exports.rankingBarLabel = exports.customMark = exports.rankingBarAxis = exports.rankingBarField = exports.colorDynamicBar = exports.sequenceData = void 0;
const dataTable_1 = require("../../../../utils/dataTable"), constants_1 = require("../constants"), cartesian_1 = require("./cartesian"), sequenceData = context => {
const {dataTable: dataTable, cell: cell, totalTime: totalTime, spec: spec} = context, timeField = cell.time, latestData = (0,
dataTable_1.isValidDataTable)(dataTable) ? dataTable : [];
spec.timeField = timeField;
const timeArray = [], contentMap = {};
latestData.forEach((element => {
if (!element[timeField]) return;
const time = element[timeField].toString();
timeArray.includes(time) || (timeArray.push(time), contentMap[time] = []), contentMap[time].push(element);
}));
const valueField = cell.y;
for (const time in contentMap) {
contentMap[time].sort((function(a, b) {
return b[valueField] - a[valueField];
}));
}
const dataSpecs = Object.keys(contentMap).map((year => ({
data: [ {
id: "id",
values: contentMap[year]
}, {
id: "year",
values: [ {
year: year
} ]
} ]
})));
spec.data = dataSpecs.length > 0 ? dataSpecs[0].data : [];
const duration = totalTime ? totalTime / (dataSpecs.length ? dataSpecs.length : 1) : 1e3;
return spec.player = {
type: "continuous",
orient: "bottom",
auto: !0,
loop: !0,
dx: 0,
position: "middle",
interval: duration,
specs: dataSpecs,
slider: {
railStyle: {
visible: !1,
height: 6
},
trackStyle: {
visible: !1
},
handlerStyle: {
visible: !1
}
},
controller: {
backward: {
style: {
visible: !1,
size: 12
}
},
forward: {
style: {
visible: !1,
size: 12
}
},
start: {
style: {
visible: !1
},
order: 1,
position: "end"
},
pause: {
style: {
visible: !1
}
}
}
}, spec.animationUpdate = {
bar: [ {
type: "update",
options: {
excludeChannels: [ "x", "y" ]
},
duration: duration,
easing: "linear"
}, {
channel: [ "x", "y" ],
options: {
excludeChannels: [ "width" ]
},
duration: duration,
easing: "linear"
} ],
axis: {
duration: duration,
easing: "linear"
}
}, {
spec: spec
};
};
exports.sequenceData = sequenceData;
const colorDynamicBar = context => {
const {colors: colors, spec: spec} = context, colorThemes = constants_1.COLOR_THEMES.default;
return colors && colors.length > 0 ? spec.color = colors : spec.color = colorThemes.map((c => ({
gradient: "linear",
x0: 1,
y0: .01,
x1: .01,
y1: .01,
stops: [ {
offset: 0,
color: `#${c.split("#")[1]}FF`
}, {
offset: 1,
color: `#${c.split("#")[1]}00`
} ]
}))), {
spec: spec
};
};
exports.colorDynamicBar = colorDynamicBar;
const rankingBarField = context => {
const {cell: cell, spec: spec} = context;
return spec.xField = cell.y, spec.yField = cell.x, cell.color ? spec.seriesField = cell.color : spec.seriesField = spec.yField,
spec.direction = "horizontal", {
spec: spec
};
};
exports.rankingBarField = rankingBarField;
const rankingBarAxis = context => {
const {spec: spec} = context;
return spec.axes = [ {
animation: !0,
orient: "bottom",
type: "linear",
visible: !0,
title: {
visible: !1,
style: {}
},
label: {
style: {}
},
grid: {
visible: !0
}
}, {
animation: !0,
id: "axis-left",
orient: "left",
tick: {
visible: !1
},
title: {
visible: !1,
style: {}
},
label: {
style: {}
},
type: "band"
} ], {
spec: spec
};
};
exports.rankingBarAxis = rankingBarAxis;
const customMark = context => {
const {spec: spec} = context;
return spec.customMark = [ {
type: "text",
dataId: "year",
style: {
textBaseline: "bottom",
fontSize: 130,
textAlign: "right",
fontFamily: "PingFang SC",
fontWeight: 600,
text: datum => datum.year,
x: () => 700,
y: () => 430,
fill: "grey",
fillOpacity: .5
}
} ], {
spec: spec
};
};
exports.customMark = customMark;
const rankingBarLabel = context => {
const {spec: spec} = context;
return spec.label = {
visible: !0,
style: {
fill: "#FFFFFF",
stroke: null
},
animation: {
duration: spec.animationUpdate.axis.duration,
easing: "linear"
}
}, {
spec: spec
};
};
exports.rankingBarLabel = rankingBarLabel, exports.pipelineRankingBar = [ exports.sequenceData, exports.colorDynamicBar, exports.rankingBarField, exports.rankingBarAxis, cartesian_1.seriesField, exports.customMark, exports.rankingBarLabel ];
//# sourceMappingURL=rankingBar.js.map