开启 toolbox 的 dataZoom 区域缩放后，悬浮在图形元素上的鼠标样式可以修改为 pointer 吗

[shuangmianxiaoQ]

• [ ] I am using English in this issue. 在这个 Issue 中我使用了英文（强烈建议）。

General Questions

• [x] Required: I have read the document and examples and tried to solve it by myself. （必填）我读过了文档和教程，并且曾试图自己解决问题。
• [x] Required: I have searched for similar issues and that didn't help. （必填）我搜索过 issue 但是没有帮助。
• [x] Required: I have tried with the latest version of ECharts and still have this problem. （必填）我试过最新版本的 ECharts，还是存在这个问题。

In this issue, I have provided information with: 在这个 issue 中我提供了以下信息：

• [x] Required: issue type；（必填）issue 类型
• [x] Required: one sentence description in issue details；（必填）一句话的问题描述
• [x] Required: demo；（必填）能反映问题的例子（如果你想提问或报 bug）
• [x] Required: ECharts version；ECharts 版本

Issue Type

• [ ] I have a question to ask about how to use ECharts to ...；我想提问如何使用 ECharts 实现某功能
• [ ] I have a bug to report；我想要报 bug
• [ ] I have a feature to request, e.g.: I'd like a new feature that ...；我需要一个新功能
• [x] I have a feature to enhance, e.g.: The current feature should be improved in the way that ...；我希望改进某个功能
• [ ] There's something wrong with the documents；文档有些问题
• [ ] Others, or I'm not sure which issue types to choose here；其他，或我不知道应该选什么类型

Issue Details

我在使用了toolbox中的dataZoom区域缩放功能后，想要鼠标悬浮在图形元素上的cursor样式为默认的pointer，而不是crosshair。也尝试使用chart.getZr().setCursorStyle('pointer')来修改鼠标悬浮样式，但开启工具箱dataZoom功能后，源码中是让整个图表为crosshair效果，并不能达到我想要的效果，请问这个问题可以优化吗，或者我该如何解决呢？

Expected Behavior

Current Behavior

Online Example

源码中重置cursor函数：

function resetCursor(controller, e, localCursorPoint) {
    // Check active
    if (!controller._brushType) {
        return;
    }

    var zr = controller._zr;
    var covers = controller._covers;
    var currPanel = getPanelByPoint(controller, e, localCursorPoint);

    // Check whether in covers.
    if (!controller._dragging) {
        for (var i = 0; i < covers.length; i++) {
            var brushOption = covers[i].__brushOption;
            if (currPanel
                && (currPanel === true || brushOption.panelId === currPanel.panelId)
                && coverRenderers[brushOption.brushType].contain(
                    covers[i], localCursorPoint[0], localCursorPoint[1]
                )
            ) {
                // Use cursor style set on cover.
                return;
            }
        }
    }

    currPanel && zr.setCursorStyle('crosshair');
}

Topics

• [ ] Legend
• [ ] Tooltip
• [ ] Event
• [ ] Performance
• [ ] SVG
• [ ] Map
• [ ] ECharts GL
• [ ] Third-party libraries, e.g.: Vue.js, React
• [x] dataZoom

Anything Else We Need to Know

Environment

• ECharts version；ECharts 版本: 4.2.0-rc.2

• [ ] It happens only on certain browsers or operating systems. 对于特定浏览器或操作系统才会出现的问题，请提供相应环境信息：{BROWSER_VERSION_OR_OS_INFORMATION_HERE}

[wadrn]

遇到了一样的问题， 怎么解决的呢

[rds57826]

也是碰到了这样的问题，现在有一个做法，就是牺牲crosshair的样式，所有设置cursor:crosshair的都不生效，当然也可以加入一些其他的判断条件，这个主要看使用，方法就是改写setCursorStyle，例如下面的例子

const zr = instanceCharts.getZr();
if (zr && typeof zr.setCursorStyle === 'function') {
  const originFuncSetCursorStyle = zr.setCursorStyle.bind(zr);
  zr.setCursorStyle = (cursorStyle: string) => {
    if (cursorStyle !== 'crosshair') originFuncSetCursorStyle(cursorStyle);
  };
}

[zhoulujun]

框选，不应该拿pointer 款选的 交互设计的应该就是这个样子吧

[github-actions[bot]]

This issue has been automatically marked as stale because it did not have recent activity. It will be closed in 7 days if no further activity occurs. If you wish not to mark it as stale, please leave a comment in this issue.

[github-actions[bot]]

This issue has been automatically closed because it did not have recent activity. If this remains to be a problem with the latest version of Apache ECharts, please open a new issue and link this to it. Thanks!