需要注册交互:
registerInteraction('ellipsis-text', {
start: [
{
trigger: 'legend-item-name:mousemove',
action: 'ellipsis-text:show',
throttle: { wait: 50, leading: true, trailing: false },
},
{
trigger: 'legend-item-name:touchstart',
action: 'ellipsis-text:show',
throttle: { wait: 50, leading: true, trailing: false },
},
{
trigger: 'axis-label:mousemove',
action: 'ellipsis-text:show',
throttle: { wait: 50, leading: true, trailing: false },
},
{
trigger: 'axis-label:touchstart',
action: 'ellipsis-text:show',
throttle: { wait: 50, leading: true, trailing: false },
},
],
end: [
{ trigger: 'legend-item-name:mouseleave', action: 'ellipsis-text:hide' },
{ trigger: 'legend-item-name:touchend', action: 'ellipsis-text:hide' },
{ trigger: 'axis-label:mouseleave', action: 'ellipsis-text:hide' },
{ trigger: 'axis-label:touchend', action: 'ellipsis-text:hide' },
],
});
内置没有为 legend-item-value 注册交互,复写一下这个交互就行,如下:
registerInteraction('ellipsis-text', {
start: [
{
trigger: 'legend-item-name:mousemove',
action: 'ellipsis-text:show',
throttle: { wait: 50, leading: true, trailing: false },
},
{
trigger: 'legend-item-name:touchstart',
action: 'ellipsis-text:show',
throttle: { wait: 50, leading: true, trailing: false },
},
{
trigger: 'legend-item-value:mousemove',
action: 'ellipsis-text:show',
throttle: { wait: 50, leading: true, trailing: false },
},
{
trigger: 'legend-item-value:touchstart',
action: 'ellipsis-text:show',
throttle: { wait: 50, leading: true, trailing: false },
},
{
trigger: 'axis-label:mousemove',
action: 'ellipsis-text:show',
throttle: { wait: 50, leading: true, trailing: false },
},
{
trigger: 'axis-label:touchstart',
action: 'ellipsis-text:show',
throttle: { wait: 50, leading: true, trailing: false },
},
],
end: [
{ trigger: 'legend-item-name:mouseleave', action: 'ellipsis-text:hide' },
{ trigger: 'legend-item-name:touchend', action: 'ellipsis-text:hide' },
{ trigger: 'legend-item-value:mouseleave', action: 'ellipsis-text:hide' },
{ trigger: 'legend-item-value:touchend', action: 'ellipsis-text:hide' },
{ trigger: 'axis-label:mouseleave', action: 'ellipsis-text:hide' },
{ trigger: 'axis-label:touchend', action: 'ellipsis-text:hide' },
],
});