Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

折线图平移:拖动图表事件未定义 Event is not defined #1980

Open
WangShuXian6 opened this issue Jun 28, 2024 · 0 comments
Open

Comments

@WangShuXian6
Copy link

我使用 taro3 开发微信小程序,使用 domisooo/taro-f2-react 来作为 taro 和 f2的兼容层,经过 taro-f2-react 作者的测试,该问题是@antv/f2 5.x 版本的问题。请求官方修复!

这是 该问题在taro-f2-react的issues:
domisolo/taro-f2-react#21

  • F2 Version:^5.5.1
  • Platform:微信小程序,Taro实现版本
  • Mini Showcase(like screenshots):
  • CodeSandbox Link:

image
image

版本

"@antv/f2": "^5.5.1",
"@tarojs/taro": "3.6.25",
"react": "^18.0.0",
 "taro-f2-react": "^1.2.0",

使用 ScrollBar 组件时,左右拖动图表时会报错,图表也无法左右滑动。

错误详情:

ReferenceError: Event is not defined
    at FederatedPointerEvent.define.push../node_modules/@antv/g-lite/dist/index.esm.js.FederatedEvent.preventDefault (._node_modules_@antv_g-lite_dist_index.esm.js:8614)
    at ScrollBar.Zoom._doXPan (._node_modules_@antv_f2_es_components_zoom_index.js:384)
    at ._node_modules_@antv_f2_es_components_zoom_index.js:70
    at each (._node_modules_@antv_util_esm_lodash_each.js:11)
    at Rect.Zoom._this.onPan (._node_modules_@antv_f2_es_components_zoom_index.js:68)
    at EventService.define.push../node_modules/@antv/g-lite/dist/index.esm.js.EventService.notifyListeners (._node_modules_@antv_g-lite_dist_index.esm.js:10006)
    at EventService.define.push../node_modules/@antv/g-lite/dist/index.esm.js.EventService.notifyTarget (._node_modules_@antv_g-lite_dist_index.esm.js:9991)
    at EventService.define.push../node_modules/@antv/g-lite/dist/index.esm.js.EventService.propagate (._node_modules_@antv_g-lite_dist_index.esm.js:9726)
    at EventService.define.push../node_modules/@antv/g-lite/dist/index.esm.js.EventService.dispatchEvent (._node_modules_@antv_g-lite_dist_index.esm.js:9697)
    at Rect.define.push../node_modules/@antv/g-lite/dist/index.esm.js.EventTarget.dispatchEvent (._node_modules_@antv_g-lite_dist_index.esm.js:8981)(env: macOS,mp,1.06.2405020; lib: 2.25.3)

这是官方示例:

折线图平移
https://f2.antv.antgroup.com/examples/line/line/#pan

这是我的测试代码

index.tsx

import React, { useCallback, useRef } from 'react'
import { View, Text, Button, Image } from '@tarojs/components'
import F2Canvas from 'taro-f2-react'

import { Chart, Line, Point, Axis, ScrollBar } from '@antv/f2'
import { data } from './data/demo'
import styles from './index.module.scss'

const Index = () => {
  return (
    <View style={{ width: '100%', height: '260px' }}>
      <F2Canvas>
      <Chart data={data}>
          <Axis field="release" tickCount={5} nice={false} />
          <Axis field="count" />
          <Line x="release" y="count" />
          <Point x="release" y="count" />
          <ScrollBar mode="x" range={[0.1, 0.3]} />
        </Chart>
      </F2Canvas>
    </View>
  )
}

export default Index
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant