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.

Sign up for GitHub

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

Jump to bottom

[Bug] When trigger resize , the Player component does not work correctly #241

Closed
kkxxkk2019 opened this issue Jul 20, 2023 · 1 comment · Fixed by #2227
Closed

[Bug] When trigger resize , the Player component does not work correctly #241

kkxxkk2019 opened this issue Jul 20, 2023 · 1 comment · Fixed by #2227
Assignees
@skie1997
Labels
bug Something isn't working

Comments

@kkxxkk2019
Copy link
Collaborator

Version

1.0.0

Link to Minimal Reproduction

none

Steps to Reproduce

  const data = [
    [
      { date: '2010', browserName: 'Chrome', value: 9.95 },
      { date: '2010', browserName: 'IE', value: 49.93 },
      { date: '2010', browserName: 'Firefox', value: 30.35 },
      { date: '2010', browserName: 'Safari', value: 4.93 },
      { date: '2010', browserName: 'Opera', value: 2.6 },
      { date: '2010', browserName: 'Android', value: 0.27 },
      { date: '2010', browserName: 'UC Browser', value: 0.03 },
      { date: '2010', browserName: 'Samsung Internet', value: 0 },
      { date: '2010', browserName: 'Edge Legacy', value: 0 },
      { date: '2010', browserName: 'Nokia', value: 0.48 },
      { date: '2010', browserName: 'Edge', value: 0 },
      { date: '2010', browserName: 'BlackBerry', value: 0.48 },
      { date: '2010', browserName: 'IEMobile', value: 0.01 },
      { date: '2010', browserName: 'NetFront', value: 0.1 },
      { date: '2010', browserName: 'Yandex Browser', value: 0 },
      { date: '2010', browserName: '360 Safe Browser', value: 0 },
      { date: '2010', browserName: 'Maxthon', value: 0.21 },
      { date: '2010', browserName: 'QQ Browser', value: 0 },
      { date: '2010', browserName: 'Sogou Explorer', value: 0 },
      { date: '2010', browserName: 'Sony PS3', value: 0.14 },
      { date: '2010', browserName: 'Chromium', value: 0 },
      { date: '2010', browserName: 'Silk', value: 0 },
      { date: '2010', browserName: 'Coc Coc', value: 0 },
      { date: '2010', browserName: 'Unknown', value: 0.01 },
      { date: '2010', browserName: 'Mozilla', value: 0.14 },
      { date: '2010', browserName: 'Puffin', value: 0 },
      { date: '2010', browserName: 'KaiOS', value: 0 },
      { date: '2010', browserName: 'Dolfin', value: 0 },
      { date: '2010', browserName: 'Sony PS4', value: 0 },
      { date: '2010', browserName: 'Samsung', value: 0.03 },
      { date: '2010', browserName: 'AOL', value: 0.1 },
      { date: '2010', browserName: 'Whale Browser', value: 0 },
      { date: '2010', browserName: 'SeaMonkey', value: 0.03 },
      { date: '2010', browserName: 'Openwave', value: 0.02 },
      { date: '2010', browserName: 'Phantom', value: 0 },
      { date: '2010', browserName: 'SonyEricsson', value: 0.01 },
      { date: '2010', browserName: 'Pale Moon', value: 0 },
      { date: '2010', browserName: 'Obigo', value: 0 },
      { date: '2010', browserName: 'Jasmine', value: 0 },
      { date: '2010', browserName: 'Instabridge', value: 0 },
      { date: '2010', browserName: 'Other', value: 0.19 }
    ],
    [
      { date: '2011', browserName: 'Chrome', value: 19.79 },
      { date: '2011', browserName: 'IE', value: 40.31 },
      { date: '2011', browserName: 'Firefox', value: 26.49 },
      { date: '2011', browserName: 'Safari', value: 6.36 },
      { date: '2011', browserName: 'Opera', value: 3.08 },
      { date: '2011', browserName: 'Android', value: 1.16 },
      { date: '2011', browserName: 'UC Browser', value: 0.12 },
      { date: '2011', browserName: 'Samsung Internet', value: 0 },
      { date: '2011', browserName: 'Edge Legacy', value: 0 },
      { date: '2011', browserName: 'Nokia', value: 0.94 },
      { date: '2011', browserName: 'Edge', value: 0 },
      { date: '2011', browserName: 'BlackBerry', value: 0.7 },
      { date: '2011', browserName: 'IEMobile', value: 0.02 },
      { date: '2011', browserName: 'NetFront', value: 0.21 },
      { date: '2011', browserName: 'Yandex Browser', value: 0 },
      { date: '2011', browserName: '360 Safe Browser', value: 0 },
      { date: '2011', browserName: 'Maxthon', value: 0.14 },
      { date: '2011', browserName: 'QQ Browser', value: 0 },
      { date: '2011', browserName: 'Sogou Explorer', value: 0 },
      { date: '2011', browserName: 'Sony PS3', value: 0.14 },
      { date: '2011', browserName: 'Chromium', value: 0.04 },
      { date: '2011', browserName: 'Silk', value: 0 },
      { date: '2011', browserName: 'Coc Coc', value: 0 },
      { date: '2011', browserName: 'Unknown', value: 0.02 },
      { date: '2011', browserName: 'Mozilla', value: 0.04 },
      { date: '2011', browserName: 'Puffin', value: 0 },
      { date: '2011', browserName: 'KaiOS', value: 0 },
      { date: '2011', browserName: 'Dolfin', value: 0.04 },
      { date: '2011', browserName: 'Sony PS4', value: 0 },
      { date: '2011', browserName: 'Samsung', value: 0.05 },
      { date: '2011', browserName: 'AOL', value: 0.02 },
      { date: '2011', browserName: 'Whale Browser', value: 0 },
      { date: '2011', browserName: 'SeaMonkey', value: 0.02 },
      { date: '2011', browserName: 'Openwave', value: 0.02 },
      { date: '2011', browserName: 'Phantom', value: 0 },
      { date: '2011', browserName: 'SonyEricsson', value: 0.02 },
      { date: '2011', browserName: 'Pale Moon', value: 0 },
      { date: '2011', browserName: 'Obigo', value: 0.04 },
      { date: '2011', browserName: 'Jasmine', value: 0.03 },
      { date: '2011', browserName: 'Instabridge', value: 0 },
      { date: '2011', browserName: 'Other', value: 0.19 }
    ],
    [
      { date: '2012', browserName: 'Chrome', value: 29.3 },
      { date: '2012', browserName: 'IE', value: 29.66 },
      { date: '2012', browserName: 'Firefox', value: 21.27 },
      { date: '2012', browserName: 'Safari', value: 9.04 },
      { date: '2012', browserName: 'Opera', value: 3.67 },
      { date: '2012', browserName: 'Android', value: 2.89 },
      { date: '2012', browserName: 'UC Browser', value: 0.85 },
      { date: '2012', browserName: 'Samsung Internet', value: 0 },
      { date: '2012', browserName: 'Edge Legacy', value: 0 },
      { date: '2012', browserName: 'Nokia', value: 1.14 },
      { date: '2012', browserName: 'Edge', value: 0 },
      { date: '2012', browserName: 'BlackBerry', value: 0.55 },
      { date: '2012', browserName: 'IEMobile', value: 0.07 },
      { date: '2012', browserName: 'NetFront', value: 0.4 },
      { date: '2012', browserName: 'Yandex Browser', value: 0 },
      { date: '2012', browserName: '360 Safe Browser', value: 0.11 },
      { date: '2012', browserName: 'Maxthon', value: 0.11 },
      { date: '2012', browserName: 'QQ Browser', value: 0.02 },
      { date: '2012', browserName: 'Sogou Explorer', value: 0.05 },
      { date: '2012', browserName: 'Sony PS3', value: 0.1 },
      { date: '2012', browserName: 'Chromium', value: 0.07 },
      { date: '2012', browserName: 'Silk', value: 0.06 },
      { date: '2012', browserName: 'Coc Coc', value: 0 },
      { date: '2012', browserName: 'Unknown', value: 0.04 },
      { date: '2012', browserName: 'Mozilla', value: 0.01 },
      { date: '2012', browserName: 'Puffin', value: 0 },
      { date: '2012', browserName: 'KaiOS', value: 0 },
      { date: '2012', browserName: 'Dolfin', value: 0.13 },
      { date: '2012', browserName: 'Sony PS4', value: 0 },
      { date: '2012', browserName: 'Samsung', value: 0.06 },
      { date: '2012', browserName: 'AOL', value: 0 },
      { date: '2012', browserName: 'Whale Browser', value: 0 },
      { date: '2012', browserName: 'SeaMonkey', value: 0.03 },
      { date: '2012', browserName: 'Openwave', value: 0.01 },
      { date: '2012', browserName: 'Phantom', value: 0.01 },
      { date: '2012', browserName: 'SonyEricsson', value: 0.02 },
      { date: '2012', browserName: 'Pale Moon', value: 0.02 },
      { date: '2012', browserName: 'Obigo', value: 0.04 },
      { date: '2012', browserName: 'Jasmine', value: 0.04 },
      { date: '2012', browserName: 'Instabridge', value: 0 },
      { date: '2012', browserName: 'Other', value: 0.23 }
    ],
    [
      { date: '2013', browserName: 'Chrome', value: 34.67 },
      { date: '2013', browserName: 'IE', value: 23.15 },
      { date: '2013', browserName: 'Firefox', value: 16.55 },
      { date: '2013', browserName: 'Safari', value: 10.94 },
      { date: '2013', browserName: 'Opera', value: 3.68 },
      { date: '2013', browserName: 'Android', value: 5.37 },
      { date: '2013', browserName: 'UC Browser', value: 1.68 },
      { date: '2013', browserName: 'Samsung Internet', value: 0 },
      { date: '2013', browserName: 'Edge Legacy', value: 0 },
      { date: '2013', browserName: 'Nokia', value: 1.12 },
      { date: '2013', browserName: 'Edge', value: 0 },
      { date: '2013', browserName: 'BlackBerry', value: 0.53 },
      { date: '2013', browserName: 'IEMobile', value: 0.25 },
      { date: '2013', browserName: 'NetFront', value: 0.39 },
      { date: '2013', browserName: 'Yandex Browser', value: 0.22 },
      { date: '2013', browserName: '360 Safe Browser', value: 0.21 },
      { date: '2013', browserName: 'Maxthon', value: 0.16 },
      { date: '2013', browserName: 'QQ Browser', value: 0.05 },
      { date: '2013', browserName: 'Sogou Explorer', value: 0.13 },
      { date: '2013', browserName: 'Sony PS3', value: 0.09 },
      { date: '2013', browserName: 'Chromium', value: 0.06 },
      { date: '2013', browserName: 'Silk', value: 0.14 },
      { date: '2013', browserName: 'Coc Coc', value: 0 },
      { date: '2013', browserName: 'Unknown', value: 0.08 },
      { date: '2013', browserName: 'Mozilla', value: 0.01 },
      { date: '2013', browserName: 'Puffin', value: 0.03 },
      { date: '2013', browserName: 'KaiOS', value: 0 },
      { date: '2013', browserName: 'Dolfin', value: 0.08 },
      { date: '2013', browserName: 'Sony PS4', value: 0 },
      { date: '2013', browserName: 'Samsung', value: 0.04 },
      { date: '2013', browserName: 'AOL', value: 0 },
      { date: '2013', browserName: 'Whale Browser', value: 0 },
      { date: '2013', browserName: 'SeaMonkey', value: 0.02 },
      { date: '2013', browserName: 'Openwave', value: 0.02 },
      { date: '2013', browserName: 'Phantom', value: 0.03 },
      { date: '2013', browserName: 'SonyEricsson', value: 0.01 },
      { date: '2013', browserName: 'Pale Moon', value: 0.03 },
      { date: '2013', browserName: 'Obigo', value: 0.02 },
      { date: '2013', browserName: 'Jasmine', value: 0.02 },
      { date: '2013', browserName: 'Instabridge', value: 0 },
      { date: '2013', browserName: 'Other', value: 0.21 }
    ],
    [
      { date: '2014', browserName: 'Chrome', value: 38.94 },
      { date: '2014', browserName: 'IE', value: 15.46 },
      { date: '2014', browserName: 'Firefox', value: 13.17 },
      { date: '2014', browserName: 'Safari', value: 13.77 },
      { date: '2014', browserName: 'Opera', value: 4 },
      { date: '2014', browserName: 'Android', value: 7.23 },
      { date: '2014', browserName: 'UC Browser', value: 2.83 },
      { date: '2014', browserName: 'Samsung Internet', value: 0 },
      { date: '2014', browserName: 'Edge Legacy', value: 0 },
      { date: '2014', browserName: 'Nokia', value: 1.09 },
      { date: '2014', browserName: 'Edge', value: 0 },
      { date: '2014', browserName: 'BlackBerry', value: 0.43 },
      { date: '2014', browserName: 'IEMobile', value: 0.62 },
      { date: '2014', browserName: 'NetFront', value: 0.38 },
      { date: '2014', browserName: 'Yandex Browser', value: 0.24 },
      { date: '2014', browserName: '360 Safe Browser', value: 0.44 },
      { date: '2014', browserName: 'Maxthon', value: 0.17 },
      { date: '2014', browserName: 'QQ Browser', value: 0.11 },
      { date: '2014', browserName: 'Sogou Explorer', value: 0.13 },
      { date: '2014', browserName: 'Sony PS3', value: 0.05 },
      { date: '2014', browserName: 'Chromium', value: 0.07 },
      { date: '2014', browserName: 'Silk', value: 0.17 },
      { date: '2014', browserName: 'Coc Coc', value: 0.03 },
      { date: '2014', browserName: 'Unknown', value: 0.13 },
      { date: '2014', browserName: 'Mozilla', value: 0.02 },
      { date: '2014', browserName: 'Puffin', value: 0.06 },
      { date: '2014', browserName: 'KaiOS', value: 0 },
      { date: '2014', browserName: 'Dolfin', value: 0.07 },
      { date: '2014', browserName: 'Sony PS4', value: 0.01 },
      { date: '2014', browserName: 'Samsung', value: 0.02 },
      { date: '2014', browserName: 'AOL', value: 0 },
      { date: '2014', browserName: 'Whale Browser', value: 0 },
      { date: '2014', browserName: 'SeaMonkey', value: 0.01 },
      { date: '2014', browserName: 'Openwave', value: 0.04 },
      { date: '2014', browserName: 'Phantom', value: 0.03 },
      { date: '2014', browserName: 'SonyEricsson', value: 0.02 },
      { date: '2014', browserName: 'Pale Moon', value: 0.02 },
      { date: '2014', browserName: 'Obigo', value: 0.01 },
      { date: '2014', browserName: 'Jasmine', value: 0.01 },
      { date: '2014', browserName: 'Instabridge', value: 0 },
      { date: '2014', browserName: 'Other', value: 0.22 }
    ],
    [
      { date: '2015', browserName: 'Chrome', value: 44.87 },
      { date: '2015', browserName: 'IE', value: 11.24 },
      { date: '2015', browserName: 'Firefox', value: 10.51 },
      { date: '2015', browserName: 'Safari', value: 13.06 },
      { date: '2015', browserName: 'Opera', value: 5 },
      { date: '2015', browserName: 'Android', value: 6.31 },
      { date: '2015', browserName: 'UC Browser', value: 5.37 },
      { date: '2015', browserName: 'Samsung Internet', value: 0 },
      { date: '2015', browserName: 'Edge Legacy', value: 0.28 },
      { date: '2015', browserName: 'Nokia', value: 0.42 },
      { date: '2015', browserName: 'Edge', value: 0 },
      { date: '2015', browserName: 'BlackBerry', value: 0.34 },
      { date: '2015', browserName: 'IEMobile', value: 0.73 },
      { date: '2015', browserName: 'NetFront', value: 0.15 },
      { date: '2015', browserName: 'Yandex Browser', value: 0.28 },
      { date: '2015', browserName: '360 Safe Browser', value: 0.18 },
      { date: '2015', browserName: 'Maxthon', value: 0.15 },
      { date: '2015', browserName: 'QQ Browser', value: 0.16 },
      { date: '2015', browserName: 'Sogou Explorer', value: 0.13 },
      { date: '2015', browserName: 'Sony PS3', value: 0.02 },
      { date: '2015', browserName: 'Chromium', value: 0.09 },
      { date: '2015', browserName: 'Silk', value: 0.12 },
      { date: '2015', browserName: 'Coc Coc', value: 0.07 },
      { date: '2015', browserName: 'Unknown', value: 0.09 },
      { date: '2015', browserName: 'Mozilla', value: 0.02 },
      { date: '2015', browserName: 'Puffin', value: 0.05 },
      { date: '2015', browserName: 'KaiOS', value: 0 },
      { date: '2015', browserName: 'Dolfin', value: 0.04 },
      { date: '2015', browserName: 'Sony PS4', value: 0.04 },
      { date: '2015', browserName: 'Samsung', value: 0.01 },
      { date: '2015', browserName: 'AOL', value: 0 },
      { date: '2015', browserName: 'Whale Browser', value: 0 },
      { date: '2015', browserName: 'SeaMonkey', value: 0.02 },
      { date: '2015', browserName: 'Openwave', value: 0.02 },
      { date: '2015', browserName: 'Phantom', value: 0.03 },
      { date: '2015', browserName: 'SonyEricsson', value: 0.02 },
      { date: '2015', browserName: 'Pale Moon', value: 0.02 },
      { date: '2015', browserName: 'Obigo', value: 0.01 },
      { date: '2015', browserName: 'Jasmine', value: 0.01 },
      { date: '2015', browserName: 'Instabridge', value: 0 },
      { date: '2015', browserName: 'Other', value: 0.19 }
    ],
    [
      { date: '2016', browserName: 'Chrome', value: 49.08 },
      { date: '2016', browserName: 'IE', value: 6.25 },
      { date: '2016', browserName: 'Firefox', value: 7.97 },
      { date: '2016', browserName: 'Safari', value: 13.31 },
      { date: '2016', browserName: 'Opera', value: 5.47 },
      { date: '2016', browserName: 'Android', value: 3.96 },
      { date: '2016', browserName: 'UC Browser', value: 7.77 },
      { date: '2016', browserName: 'Samsung Internet', value: 2.33 },
      { date: '2016', browserName: 'Edge Legacy', value: 1.42 },
      { date: '2016', browserName: 'Nokia', value: 0.11 },
      { date: '2016', browserName: 'Edge', value: 0 },
      { date: '2016', browserName: 'BlackBerry', value: 0.26 },
      { date: '2016', browserName: 'IEMobile', value: 0.62 },
      { date: '2016', browserName: 'NetFront', value: 0.07 },
      { date: '2016', browserName: 'Yandex Browser', value: 0.28 },
      { date: '2016', browserName: '360 Safe Browser', value: 0.09 },
      { date: '2016', browserName: 'Maxthon', value: 0.1 },
      { date: '2016', browserName: 'QQ Browser', value: 0.09 },
      { date: '2016', browserName: 'Sogou Explorer', value: 0.08 },
      { date: '2016', browserName: 'Sony PS3', value: 0.01 },
      { date: '2016', browserName: 'Chromium', value: 0.08 },
      { date: '2016', browserName: 'Silk', value: 0.01 },
      { date: '2016', browserName: 'Coc Coc', value: 0.14 },
      { date: '2016', browserName: 'Unknown', value: 0.07 },
      { date: '2016', browserName: 'Mozilla', value: 0.02 },
      { date: '2016', browserName: 'Puffin', value: 0.07 },
      { date: '2016', browserName: 'KaiOS', value: 0 },
      { date: '2016', browserName: 'Dolfin', value: 0.02 },
      { date: '2016', browserName: 'Sony PS4', value: 0.07 },
      { date: '2016', browserName: 'Samsung', value: 0 },
      { date: '2016', browserName: 'AOL', value: 0 },
      { date: '2016', browserName: 'Whale Browser', value: 0 },
      { date: '2016', browserName: 'SeaMonkey', value: 0.01 },
      { date: '2016', browserName: 'Openwave', value: 0.01 },
      { date: '2016', browserName: 'Phantom', value: 0.03 },
      { date: '2016', browserName: 'SonyEricsson', value: 0.02 },
      { date: '2016', browserName: 'Pale Moon', value: 0.02 },
      { date: '2016', browserName: 'Obigo', value: 0 },
      { date: '2016', browserName: 'Jasmine', value: 0 },
      { date: '2016', browserName: 'Instabridge', value: 0 },
      { date: '2016', browserName: 'Other', value: 0.15 }
    ],
    [
      { date: '2017', browserName: 'Chrome', value: 53.96 },
      { date: '2017', browserName: 'IE', value: 3.95 },
      { date: '2017', browserName: 'Firefox', value: 6.19 },
      { date: '2017', browserName: 'Safari', value: 14.51 },
      { date: '2017', browserName: 'Opera', value: 3.84 },
      { date: '2017', browserName: 'Android', value: 2.39 },
      { date: '2017', browserName: 'UC Browser', value: 8.25 },
      { date: '2017', browserName: 'Samsung Internet', value: 3.3 },
      { date: '2017', browserName: 'Edge Legacy', value: 1.85 },
      { date: '2017', browserName: 'Nokia', value: 0.07 },
      { date: '2017', browserName: 'Edge', value: 0 },
      { date: '2017', browserName: 'BlackBerry', value: 0.13 },
      { date: '2017', browserName: 'IEMobile', value: 0.34 },
      { date: '2017', browserName: 'NetFront', value: 0.02 },
      { date: '2017', browserName: 'Yandex Browser', value: 0.27 },
      { date: '2017', browserName: '360 Safe Browser', value: 0.05 },
      { date: '2017', browserName: 'Maxthon', value: 0.06 },
      { date: '2017', browserName: 'QQ Browser', value: 0.12 },
      { date: '2017', browserName: 'Sogou Explorer', value: 0.07 },
      { date: '2017', browserName: 'Sony PS3', value: 0.01 },
      { date: '2017', browserName: 'Chromium', value: 0.07 },
      { date: '2017', browserName: 'Silk', value: 0 },
      { date: '2017', browserName: 'Coc Coc', value: 0.13 },
      { date: '2017', browserName: 'Unknown', value: 0.04 },
      { date: '2017', browserName: 'Mozilla', value: 0.02 },
      { date: '2017', browserName: 'Puffin', value: 0.06 },
      { date: '2017', browserName: 'KaiOS', value: 0 },
      { date: '2017', browserName: 'Dolfin', value: 0.01 },
      { date: '2017', browserName: 'Sony PS4', value: 0.09 },
      { date: '2017', browserName: 'Samsung', value: 0 },
      { date: '2017', browserName: 'AOL', value: 0 },
      { date: '2017', browserName: 'Whale Browser', value: 0 },
      { date: '2017', browserName: 'SeaMonkey', value: 0.01 },
      { date: '2017', browserName: 'Openwave', value: 0 },
      { date: '2017', browserName: 'Phantom', value: 0.03 },
      { date: '2017', browserName: 'SonyEricsson', value: 0.01 },
      { date: '2017', browserName: 'Pale Moon', value: 0.01 },
      { date: '2017', browserName: 'Obigo', value: 0 },
      { date: '2017', browserName: 'Jasmine', value: 0 },
      { date: '2017', browserName: 'Instabridge', value: 0 },
      { date: '2017', browserName: 'Other', value: 0.14 }
    ],
    [
      { date: '2018', browserName: 'Chrome', value: 59.12 },
      { date: '2018', browserName: 'IE', value: 3 },
      { date: '2018', browserName: 'Firefox', value: 5.21 },
      { date: '2018', browserName: 'Safari', value: 14.43 },
      { date: '2018', browserName: 'Opera', value: 3.52 },
      { date: '2018', browserName: 'Android', value: 1.49 },
      { date: '2018', browserName: 'UC Browser', value: 6.66 },
      { date: '2018', browserName: 'Samsung Internet', value: 2.77 },
      { date: '2018', browserName: 'Edge Legacy', value: 1.95 },
      { date: '2018', browserName: 'Nokia', value: 0.04 },
      { date: '2018', browserName: 'Edge', value: 0 },
      { date: '2018', browserName: 'BlackBerry', value: 0.05 },
      { date: '2018', browserName: 'IEMobile', value: 0.17 },
      { date: '2018', browserName: 'NetFront', value: 0.01 },
      { date: '2018', browserName: 'Yandex Browser', value: 0.25 },
      { date: '2018', browserName: '360 Safe Browser', value: 0.03 },
      { date: '2018', browserName: 'Maxthon', value: 0.05 },
      { date: '2018', browserName: 'QQ Browser', value: 0.28 },
      { date: '2018', browserName: 'Sogou Explorer', value: 0.06 },
      { date: '2018', browserName: 'Sony PS3', value: 0.01 },
      { date: '2018', browserName: 'Chromium', value: 0.07 },
      { date: '2018', browserName: 'Silk', value: 0 },
      { date: '2018', browserName: 'Coc Coc', value: 0.11 },
      { date: '2018', browserName: 'Unknown', value: 0.03 },
      { date: '2018', browserName: 'Mozilla', value: 0.02 },
      { date: '2018', browserName: 'Puffin', value: 0.09 },
      { date: '2018', browserName: 'KaiOS', value: 0.33 },
      { date: '2018', browserName: 'Dolfin', value: 0 },
      { date: '2018', browserName: 'Sony PS4', value: 0.07 },
      { date: '2018', browserName: 'Samsung', value: 0 },
      { date: '2018', browserName: 'AOL', value: 0 },
      { date: '2018', browserName: 'Whale Browser', value: 0.01 },
      { date: '2018', browserName: 'SeaMonkey', value: 0.01 },
      { date: '2018', browserName: 'Openwave', value: 0 },
      { date: '2018', browserName: 'Phantom', value: 0.02 },
      { date: '2018', browserName: 'SonyEricsson', value: 0.01 },
      { date: '2018', browserName: 'Pale Moon', value: 0.01 },
      { date: '2018', browserName: 'Obigo', value: 0 },
      { date: '2018', browserName: 'Jasmine', value: 0 },
      { date: '2018', browserName: 'Instabridge', value: 0 },
      { date: '2018', browserName: 'Other', value: 0.13 }
    ],
    [
      { date: '2019', browserName: 'Chrome', value: 63.31 },
      { date: '2019', browserName: 'IE', value: 2.24 },
      { date: '2019', browserName: 'Firefox', value: 4.57 },
      { date: '2019', browserName: 'Safari', value: 15.86 },
      { date: '2019', browserName: 'Opera', value: 2.57 },
      { date: '2019', browserName: 'Android', value: 0.86 },
      { date: '2019', browserName: 'UC Browser', value: 3.3 },
      { date: '2019', browserName: 'Samsung Internet', value: 3.45 },
      { date: '2019', browserName: 'Edge Legacy', value: 2.14 },
      { date: '2019', browserName: 'Nokia', value: 0.01 },
      { date: '2019', browserName: 'Edge', value: 0 },
      { date: '2019', browserName: 'BlackBerry', value: 0.02 },
      { date: '2019', browserName: 'IEMobile', value: 0.08 },
      { date: '2019', browserName: 'NetFront', value: 0 },
      { date: '2019', browserName: 'Yandex Browser', value: 0.25 },
      { date: '2019', browserName: '360 Safe Browser', value: 0.02 },
      { date: '2019', browserName: 'Maxthon', value: 0.04 },
      { date: '2019', browserName: 'QQ Browser', value: 0.25 },
      { date: '2019', browserName: 'Sogou Explorer', value: 0.06 },
      { date: '2019', browserName: 'Sony PS3', value: 0 },
      { date: '2019', browserName: 'Chromium', value: 0.08 },
      { date: '2019', browserName: 'Silk', value: 0 },
      { date: '2019', browserName: 'Coc Coc', value: 0.12 },
      { date: '2019', browserName: 'Unknown', value: 0.02 },
      { date: '2019', browserName: 'Mozilla', value: 0.04 },
      { date: '2019', browserName: 'Puffin', value: 0.13 },
      { date: '2019', browserName: 'KaiOS', value: 0.35 },
      { date: '2019', browserName: 'Dolfin', value: 0 },
      { date: '2019', browserName: 'Sony PS4', value: 0.06 },
      { date: '2019', browserName: 'Samsung', value: 0 },
      { date: '2019', browserName: 'AOL', value: 0 },
      { date: '2019', browserName: 'Whale Browser', value: 0.07 },
      { date: '2019', browserName: 'SeaMonkey', value: 0 },
      { date: '2019', browserName: 'Openwave', value: 0 },
      { date: '2019', browserName: 'Phantom', value: 0 },
      { date: '2019', browserName: 'SonyEricsson', value: 0 },
      { date: '2019', browserName: 'Pale Moon', value: 0.01 },
      { date: '2019', browserName: 'Obigo', value: 0 },
      { date: '2019', browserName: 'Jasmine', value: 0 },
      { date: '2019', browserName: 'Instabridge', value: 0 },
      { date: '2019', browserName: 'Other', value: 0.1 }
    ],
    [
      { date: '2020', browserName: 'Chrome', value: 64.6 },
      { date: '2020', browserName: 'IE', value: 1.35 },
      { date: '2020', browserName: 'Firefox', value: 4.22 },
      { date: '2020', browserName: 'Safari', value: 17.84 },
      { date: '2020', browserName: 'Opera', value: 1.99 },
      { date: '2020', browserName: 'Android', value: 0.51 },
      { date: '2020', browserName: 'UC Browser', value: 1.74 },
      { date: '2020', browserName: 'Samsung Internet', value: 3.35 },
      { date: '2020', browserName: 'Edge Legacy', value: 1.38 },
      { date: '2020', browserName: 'Nokia', value: 0 },
      { date: '2020', browserName: 'Edge', value: 1.45 },
      { date: '2020', browserName: 'BlackBerry', value: 0.01 },
      { date: '2020', browserName: 'IEMobile', value: 0.02 },
      { date: '2020', browserName: 'NetFront', value: 0 },
      { date: '2020', browserName: 'Yandex Browser', value: 0.26 },
      { date: '2020', browserName: '360 Safe Browser', value: 0.25 },
      { date: '2020', browserName: 'Maxthon', value: 0.03 },
      { date: '2020', browserName: 'QQ Browser', value: 0.28 },
      { date: '2020', browserName: 'Sogou Explorer', value: 0.06 },
      { date: '2020', browserName: 'Sony PS3', value: 0 },
      { date: '2020', browserName: 'Chromium', value: 0.04 },
      { date: '2020', browserName: 'Silk', value: 0 },
      { date: '2020', browserName: 'Coc Coc', value: 0.09 },
      { date: '2020', browserName: 'Unknown', value: 0.02 },
      { date: '2020', browserName: 'Mozilla', value: 0.09 },
      { date: '2020', browserName: 'Puffin', value: 0.12 },
      { date: '2020', browserName: 'KaiOS', value: 0.08 },
      { date: '2020', browserName: 'Dolfin', value: 0 },
      { date: '2020', browserName: 'Sony PS4', value: 0.05 },
      { date: '2020', browserName: 'Samsung', value: 0 },
      { date: '2020', browserName: 'AOL', value: 0 },
      { date: '2020', browserName: 'Whale Browser', value: 0.11 },
      { date: '2020', browserName: 'SeaMonkey', value: 0 },
      { date: '2020', browserName: 'Openwave', value: 0 },
      { date: '2020', browserName: 'Phantom', value: 0 },
      { date: '2020', browserName: 'SonyEricsson', value: 0 },
      { date: '2020', browserName: 'Pale Moon', value: 0.01 },
      { date: '2020', browserName: 'Obigo', value: 0 },
      { date: '2020', browserName: 'Jasmine', value: 0 },
      { date: '2020', browserName: 'Instabridge', value: 0 },
      { date: '2020', browserName: 'Other', value: 0.03 }
    ],
    [
      { date: '2021', browserName: 'Chrome', value: 64.45 },
      { date: '2021', browserName: 'IE', value: 0.62 },
      { date: '2021', browserName: 'Firefox', value: 3.62 },
      { date: '2021', browserName: 'Safari', value: 18.9 },
      { date: '2021', browserName: 'Opera', value: 2.24 },
      { date: '2021', browserName: 'Android', value: 0.62 },
      { date: '2021', browserName: 'UC Browser', value: 1.21 },
      { date: '2021', browserName: 'Samsung Internet', value: 3.11 },
      { date: '2021', browserName: 'Edge Legacy', value: 0.22 },
      { date: '2021', browserName: 'Nokia', value: 0 },
      { date: '2021', browserName: 'Edge', value: 3.59 },
      { date: '2021', browserName: 'BlackBerry', value: 0 },
      { date: '2021', browserName: 'IEMobile', value: 0 },
      { date: '2021', browserName: 'NetFront', value: 0 },
      { date: '2021', browserName: 'Yandex Browser', value: 0.24 },
      { date: '2021', browserName: '360 Safe Browser', value: 0.29 },
      { date: '2021', browserName: 'Maxthon', value: 0.02 },
      { date: '2021', browserName: 'QQ Browser', value: 0.26 },
      { date: '2021', browserName: 'Sogou Explorer', value: 0.05 },
      { date: '2021', browserName: 'Sony PS3', value: 0 },
      { date: '2021', browserName: 'Chromium', value: 0.02 },
      { date: '2021', browserName: 'Silk', value: 0 },
      { date: '2021', browserName: 'Coc Coc', value: 0.04 },
      { date: '2021', browserName: 'Unknown', value: 0.02 },
      { date: '2021', browserName: 'Mozilla', value: 0.08 },
      { date: '2021', browserName: 'Puffin', value: 0.08 },
      { date: '2021', browserName: 'KaiOS', value: 0.08 },
      { date: '2021', browserName: 'Dolfin', value: 0 },
      { date: '2021', browserName: 'Sony PS4', value: 0.04 },
      { date: '2021', browserName: 'Samsung', value: 0 },
      { date: '2021', browserName: 'AOL', value: 0 },
      { date: '2021', browserName: 'Whale Browser', value: 0.12 },
      { date: '2021', browserName: 'SeaMonkey', value: 0 },
      { date: '2021', browserName: 'Openwave', value: 0 },
      { date: '2021', browserName: 'Phantom', value: 0 },
      { date: '2021', browserName: 'SonyEricsson', value: 0 },
      { date: '2021', browserName: 'Pale Moon', value: 0.01 },
      { date: '2021', browserName: 'Obigo', value: 0 },
      { date: '2021', browserName: 'Jasmine', value: 0 },
      { date: '2021', browserName: 'Instabridge', value: 0 },
      { date: '2021', browserName: 'Other', value: 0.02 }
    ],
    [
      { date: '2022', browserName: 'Chrome', value: 64.78 },
      { date: '2022', browserName: 'IE', value: 0.37 },
      { date: '2022', browserName: 'Firefox', value: 3.38 },
      { date: '2022', browserName: 'Safari', value: 18.93 },
      { date: '2022', browserName: 'Opera', value: 2.23 },
      { date: '2022', browserName: 'Android', value: 0.72 },
      { date: '2022', browserName: 'UC Browser', value: 0.86 },
      { date: '2022', browserName: 'Samsung Internet', value: 2.83 },
      { date: '2022', browserName: 'Edge Legacy', value: 0.09 },
      { date: '2022', browserName: 'Nokia', value: 0 },
      { date: '2022', browserName: 'Edge', value: 4.18 },
      { date: '2022', browserName: 'BlackBerry', value: 0 },
      { date: '2022', browserName: 'IEMobile', value: 0 },
      { date: '2022', browserName: 'NetFront', value: 0 },
      { date: '2022', browserName: 'Yandex Browser', value: 0.23 },
      { date: '2022', browserName: '360 Safe Browser', value: 0.24 },
      { date: '2022', browserName: 'Maxthon', value: 0.01 },
      { date: '2022', browserName: 'QQ Browser', value: 0.23 },
      { date: '2022', browserName: 'Sogou Explorer', value: 0.04 },
      { date: '2022', browserName: 'Sony PS3', value: 0 },
      { date: '2022', browserName: 'Chromium', value: 0.01 },
      { date: '2022', browserName: 'Silk', value: 0 },
      { date: '2022', browserName: 'Coc Coc', value: 0.08 },
      { date: '2022', browserName: 'Unknown', value: 0.03 },
      { date: '2022', browserName: 'Mozilla', value: 0.07 },
      { date: '2022', browserName: 'Puffin', value: 0.09 },
      { date: '2022', browserName: 'KaiOS', value: 0.06 },
      { date: '2022', browserName: 'Dolfin', value: 0 },
      { date: '2022', browserName: 'Sony PS4', value: 0.03 },
      { date: '2022', browserName: 'Samsung', value: 0 },
      { date: '2022', browserName: 'AOL', value: 0 },
      { date: '2022', browserName: 'Whale Browser', value: 0.11 },
      { date: '2022', browserName: 'SeaMonkey', value: 0 },
      { date: '2022', browserName: 'Openwave', value: 0 },
      { date: '2022', browserName: 'Phantom', value: 0 },
      { date: '2022', browserName: 'SonyEricsson', value: 0 },
      { date: '2022', browserName: 'Pale Moon', value: 0.01 },
      { date: '2022', browserName: 'Obigo', value: 0 },
      { date: '2022', browserName: 'Jasmine', value: 0 },
      { date: '2022', browserName: 'Instabridge', value: 0.35 },
      { date: '2022', browserName: 'Other', value: 0.02 }
    ],
    [
      { date: '2023', browserName: 'Chrome', value: 65.09 },
      { date: '2023', browserName: 'IE', value: 0.25 },
      { date: '2023', browserName: 'Firefox', value: 2.93 },
      { date: '2023', browserName: 'Safari', value: 19.2 },
      { date: '2023', browserName: 'Opera', value: 2.34 },
      { date: '2023', browserName: 'Android', value: 0.73 },
      { date: '2023', browserName: 'UC Browser', value: 0.89 },
      { date: '2023', browserName: 'Samsung Internet', value: 2.59 },
      { date: '2023', browserName: 'Edge Legacy', value: 0.04 },
      { date: '2023', browserName: 'Nokia', value: 0 },
      { date: '2023', browserName: 'Edge', value: 4.5 },
      { date: '2023', browserName: 'BlackBerry', value: 0 },
      { date: '2023', browserName: 'IEMobile', value: 0.01 },
      { date: '2023', browserName: 'NetFront', value: 0 },
      { date: '2023', browserName: 'Yandex Browser', value: 0.23 },
      { date: '2023', browserName: '360 Safe Browser', value: 0.29 },
      { date: '2023', browserName: 'Maxthon', value: 0.01 },
      { date: '2023', browserName: 'QQ Browser', value: 0.21 },
      { date: '2023', browserName: 'Sogou Explorer', value: 0.04 },
      { date: '2023', browserName: 'Sony PS3', value: 0 },
      { date: '2023', browserName: 'Chromium', value: 0.01 },
      { date: '2023', browserName: 'Silk', value: 0 },
      { date: '2023', browserName: 'Coc Coc', value: 0.16 },
      { date: '2023', browserName: 'Unknown', value: 0.02 },
      { date: '2023', browserName: 'Mozilla', value: 0.07 },
      { date: '2023', browserName: 'Puffin', value: 0.08 },
      { date: '2023', browserName: 'KaiOS', value: 0.07 },
      { date: '2023', browserName: 'Dolfin', value: 0 },
      { date: '2023', browserName: 'Sony PS4', value: 0.02 },
      { date: '2023', browserName: 'Samsung', value: 0 },
      { date: '2023', browserName: 'AOL', value: 0 },
      { date: '2023', browserName: 'Whale Browser', value: 0.11 },
      { date: '2023', browserName: 'SeaMonkey', value: 0 },
      { date: '2023', browserName: 'Openwave', value: 0 },
      { date: '2023', browserName: 'Phantom', value: 0 },
      { date: '2023', browserName: 'SonyEricsson', value: 0 },
      { date: '2023', browserName: 'Pale Moon', value: 0 },
      { date: '2023', browserName: 'Obigo', value: 0 },
      { date: '2023', browserName: 'Jasmine', value: 0 },
      { date: '2023', browserName: 'Instabridge', value: 0.06 },
      { date: '2023', browserName: 'Other', value: 0.02 }
    ]
  ];

  const createData = () => {
    return data.map(values => {
      return {
        data: {
          id: 'browser',
          values: values
        }
      };
    });
  };

  const specs = createData();

  const spec = {
    type: 'common',
    player: {
      auto: true,
      loop: true,
      alternate: true,
      interval: 500,
      width: 500,
      position: 'middle',
      type: 'discrete',
      specs: specs
    },
    series: [
      {
        type: 'pie',
        data: specs[0].data,
        dataKey: 'browserName',
        outerRadius: 0.81,
        innerRadius: 0.5,
        label: {
          visible: true,
          position: 'outside',
          line: {
            visible: false
          }
        },
        valueField: 'value',
        seriesField: 'browserName'
      }
    ]
  };

  const cs = new VChart(spec, {
    dom: document.getElementById('chart') as HTMLElement,
    mode: isMobile ? 'mobile-browser' : 'desktop-browser'
    // animation: false
  });
  console.time('renderTime');
  cs.renderAsync().then(() => {
    console.timeEnd('renderTime');
  });

Current Behavior

2023-07-20 15-51-56 2023-07-20 15_52_26

Expected Behavior

The player's size should match the canvas.

Environment

- OS:
- Browser:
- Framework:

Any additional comments?

No response
@kkxxkk2019 kkxxkk2019 added the bug Something isn't working label Jul 20, 2023
@youngwinds
Copy link
Contributor

Record an optimization item.

Optimize the player event enum when fix the bug.

@xile611 xile611 assigned skie1997 and unassigned youngwinds Dec 15, 2023
@skie1997 skie1997 mentioned this issue Feb 6, 2024
Merged
20 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@skie1997 skie1997

Labels
bug Something isn't working
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Fix/player orient VisActor/VChart
3 participants
@skie1997 @youngwinds @kkxxkk2019