javascript - Highcharts.js 在光滑的滑块中不起作用

Question

起初工作

然后它打破

我在 slick carousal 中使用 high charts.js，它仅适用于第一个实例，它隐藏了聊天，然后又在第三个实例中显示。

            Highcharts.chart('pie7', {
                series: [{
                        data: [{
                                name: 'Chrome',
                                y: 61.41,
                                sliced: true,
                                selected: true
                            }, {
                                name: 'Internet Explorer',
                                y: 11.84
                            }, {
                                name: 'Other',
                                y: 7.05
                            }]
                    }]
            });


                           $('.chartslick').slick({
                   dots: false,
                   slidesToShow: 6,
                   slidesToScroll: 1,
                   autoplay: true,
                   autoplaySpeed: 2000,
               });

例子

https://jsfiddle.net/v6s0nbhu/4/

标签： javascriptjqueryhighchartsslick.js

Answer 1

与infinite:true. 将其更改为 false 并检查。

          $('.chartslick').slick({
               dots: false,
               slidesToShow: 6,
               slidesToScroll: 1,
               autoplay: true,
               autoplaySpeed: 2000,
               infinite: false
           });

您为图表添加了 id。无限是复制所有没有id的滑块。所以 hightchart 无法在第二步初始化。

您需要使用无限错误或将饼图更改id为class

将 HighCharts 渲染到类而不是 id？