Feature: coarse pointer tolerance

[Ovilia]

Brief Information

This pull request is in the type of:

• bug fixing
• new feature
• others

What does this PR do?

This PR is intended to increase elements' responsive size on mobile devices so that elements can be touched more easily.

The idea is inspired by Understanding Success Criterion 2.5.5: Target Size.

Fixed issues

Details

Before: What was the problem?

Small elements are hard to touch precisely on mobile devices in cases like scatter charts with small bubbles.

After: How is it fixed in this PR?

Touch position in increased by "pointer size" (default value is 44px) so that elements are easier to be touched.

Misc

• The API has been changed (apache/echarts-doc#xxx).
• This PR depends on ZRender changes (Feature: coarse pointer tolerance ecomfe/zrender#918).

Related test cases or examples to use the new APIs

• test/coarse-pointer.html

I added an option to set useCoarsePointer to be true in the visual test framework, which forces increasing clicking area even for PC charts. The full visual test result is at Google Drive. I checked the failed cases, they are because we increased clicking area.

API Changes

By default, only mobile devices will use this new feature. But if a developer decide to enable this for all platforms, one can set useCoarsePointer to be true when initializing ECharts.

echarts.init(dom, null, {
  useCoarsePointer: true,
  pointerSize: 44,
  ...
});

• useCoarsePointer ('auto' | true | false): whether to enable thie feature. If set to be 'auto', it's turned on only for mobile devices.
• pointerSize (number): touch position is increased by this pointer size in diameter. Default value is 44.

Charts that with large scale enabled will disable this feature.

Others

Merging options

• Please squash the commits into a single one when merging.

Other information

[echarts-bot]

Thanks for your contribution!
The community will review it ASAP. In the meanwhile, please checkout the coding standard and Wiki about How to make a pull request.

The pull request is marked to be PR: author is committer because you are a committer of this project.

Document changes are required in this PR. Please also make a PR to apache/echarts-doc for document changes and update the issue id in the PR description. When the doc PR is merged, the maintainers will remove the PR: awaiting doc label.

This PR depends on ZRender changes. Please update the ZRender dependency to the latest nightly version including this change, which takes place everyday at 8:00 UTC (16:00 Beijing Time).
You can use npm i zrender@npm:zrender-nightly@dev to update package.json.
If you have any question about this, please leave a comment and we will give you extra help on this.

[echarts-bot]

To reviewers: If this PR is going to be described in the changelog in the future release, please make sure this PR has one of the following labels: PR: doc ready, PR: awaiting doc, PR: doc unchanged

This message is shown because the PR description doesn't contain the document related template.

[plainheart]

Looks good to me for now.

[echarts-bot]

Congratulations! Your PR has been merged. Thanks for your contribution! 👍