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

Pie chart doesnt render first time on IOS #196

Open
RafaelCENG opened this issue Aug 27, 2024 · 2 comments
Open

Pie chart doesnt render first time on IOS #196

RafaelCENG opened this issue Aug 27, 2024 · 2 comments

Comments

@RafaelCENG
Copy link

For some reason, my pie chart doesn't render the first time on my view. I have to change the tab for example and come back to show it. This is happening only on IOS and for some reason only on the specific chart. (I have other pie,line etc working perfectly.)

RPReplay_Final1724767099.MP4
@zhiqingchen
Copy link
Member

It's hard to think of the possible reason. You can add a log to observe the difference between iOS and Android.
Is there any corresponding error?
Does clicking on a blank area change anything?

@RafaelCENG
Copy link
Author

Good morning. Clicking on blank area doesn't do anything.
I also have other pies and they are working on IOS except the specific one for some reason on the initial render here is my code for it.

  const pieData = useMemo(() => {
    return sortedStatistics.map((stat, index) => ({
      value: values[index],
      name: stat.positionType,
    }))
  }, [sortedStatistics])

  const pieRef = useRef<any>(null)
  useEffect(() => {
    const PieOptions = {
      series: [
        {
          name: "Positions",
          type: "pie",
          radius: ["20%", "70%"],
          label: {
            show: false,
            position: "center",
          },
          center: ["40%", "50%"],
          data: pieData,
          color: pieChartColors,
        },
      ],
    }
    let chart: any
    if (pieRef.current) {
      chart = echarts.init(pieRef.current, "light", {
        renderer: "svg",
        width: 200,
        height: 250,
      })
      chart.setOption(PieOptions)
      chart.on("mousemove", (params: any) => {
        setPositionName(params.name)
        setValue(params.value)
      })
    }
    return () => chart?.dispose()
  }, [pieData])
  

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

2 participants