const spec = {
type: 'common',
seriesField: 'color',
data: [
{
id: 'id0',
values: [
{ x: 'Monday', type: 'breakfast', y: 15 },
{ x: 'Monday', type: 'lunch', y: 25 },
{ x: 'Tuesday', type: 'breakfast', y: 12 },
{ x: 'Tuesday', type: 'lunch', y: 30 },
{ x: 'Wednesday', type: 'breakfast', y: 15 },
{ x: 'Wednesday', type: 'lunch', y: 24 },
{ x: 'Thursday', type: 'breakfast', y: 10 },
{ x: 'Thursday', type: 'lunch', y: 25 },
{ x: 'Friday', type: 'breakfast', y: 13 },
{ x: 'Friday', type: 'lunch', y: 20 },
{ x: 'Saturday', type: 'breakfast', y: 10 },
{ x: 'Saturday', type: 'lunch', y: 22 },
{ x: 'Sunday', type: 'breakfast', y: 12 },
{ x: 'Sunday', type: 'lunch', y: 19 }
]
},
{
id: 'id1',
values: [
{ x: 'Monday', type: 'drinks', y: 22 },
{ x: 'Tuesday', type: 'drinks', y: 43 },
{ x: 'Wednesday', type: 'drinks', y: 33 },
{ x: 'Thursday', type: 'drinks', y: 22 },
{ x: 'Friday', type: 'drinks', y: 10 },
{ x: 'Saturday', type: 'drinks', y: 30 },
{ x: 'Sunday', type: 'drinks', y: 46 }
]
}
],
markLine: [
{
relativeSeriesIndex: 1,
coordinates: [
{
x: 'Friday',
y: 0
},
{
x: 'Friday',
y: 30,
}
],
label: {
text: 'aaa',
},
// 加了这两个属性,就不能随便设置:
// chart?.setLegendSelectedDataById(
// legendId,
// finalNewSelectedList,
// );
// 会报错:TypeError: Cannot read properties of undefined (reading 'y')
connectDirection: 'top',
type: "type-step",
},
],
series: [
{
type: 'bar',
id: 'bar',
dataIndex: 0,
seriesField: 'type',
xField: ['x', 'type'],
yField: 'y',
animationAppear: {
bar: {
type: 'moveIn',
options: { direction: 'x' },
duration: 1000
}
}
},
{
type: 'line',
id: 'line',
dataIndex: 1,
seriesField: 'type',
xField: 'x',
yField: 'y',
stack: false,
animationAppear: {
// 点图元动画配置
point: {
type: 'moveIn',
options: { direction: 'y' },
easing: 'bounceOut',
duration: 1000
},
// 线图元动画配置
line: {
duration: 1500,
delay: 1000,
easing: 'cubicOut'
}
}
}
],
axes: [{ orient: 'left' }, { orient: 'bottom', label: { visible: true }, type: 'band' }],
legends: [
{
visible: true,
orient: 'bottom',
seriesId: ['bar', 'line'],
pager: {
animationDuration: 150,
},
}
]
};
const vchart = new VChart(spec, { dom: CONTAINER_ID });
vchart.renderSync();
// Just for the convenience of console debugging, DO NOT COPY!
window['vchart'] = vchart;
vchart.setLegendSelectedDataByIndex(0,['breakfast'])
- OS:
- Browser:
- Framework:
Version
2.0.5
Link to Minimal Reproduction
null
Steps to Reproduce
Current Behavior
Expected Behavior
no error
Environment
Any additional comments?
No response