The issue has been closed

【v5】图例上 hover 一下后，style cursor 就失效了 #5533

Deathsteps posted onGitHub

问题描述

没法截图，手动交互一下，比较明显

.style('cursor', 'pointer') 手形在，hover 图例区后，再 hover 在柱子上，就不出手形了

期望结果

图例不影响 style cursor 效果

如何重现

官方代码修改

import { Chart } from '@antv/g2';

const chart = new Chart({
  container: 'container',
  autoFit: true,
});

chart
  .interval()
  .data([
    { name: 'MODIFY', value: 138, washaway: 0.21014492753623193 },
    { name: 'PRERELEASE', value: 109, washaway: 0.5596330275229358 },
    { name: 'RELEASING', value: 48, washaway: 0 },
  ])
  .encode('x', 'name')
  .encode('y', 'value')
  .encode('color', 'name')
  .encode('size', 80)
  .style('radiusTopLeft', 10)
  .style('radiusTopRight', 20)
  .style('radiusBottomRight', 30)
  .style('radiusBottomLeft', 40)
  .style('cursor', 'pointer');

chart.render();

额外信息

G2 5.1.1 版本

这个原因应该是 cursor 是一个 canvas 的全局属性，移除图例会设置为默认的 cusor，更好的做法是还原之前的 cusor。

posted by pearmini over 1 year ago

感兴趣来修复一下这个 bug 吗？大概就是修改一下 src/interaction/utils.ts 里面的 setCursor 和 restoreCursor。一种思路如下：

function useCursor() {
  // ...
  const originCursor = dom.style.cursor;
 // ...
  const setCursor = () => {};
  const restoreCursor = () => {dom.style.cursor = originCursor};
  return [setCursor, restoreCursor];
}

posted by pearmini over 1 year ago

感兴趣来修复一下这个 bug 吗？大概就是修改一下 src/interaction/utils.ts 里面的 setCursor 和 restoreCursor。一种思路如下：
function useCursor() {
  // ...
  const originCursor = dom.style.cursor;
 // ...
  const setCursor = () => {};
  const restoreCursor = () => {dom.style.cursor = originCursor};
  return [setCursor, restoreCursor];
}

这两天我试试？:sweat_smile:

posted by Deathsteps over 1 year ago

Fund this Issue

$0.00

Funded

Pull requests

【v5】图例上 hover 一下后，style cursor 就失效了 #5533

问题描述

期望结果

如何重现

额外信息

Company

Community

Support

Connect