Chart.js在iOS上没有响应

时间:2017-11-07 15:24:03

标签: javascript iphone

我已经复制了来自这个JSFiddle的代码:https://jsfiddle.net/jyxcodrq/1/尝试获取图表来压缩/响应Safari for iOS。

<div class="container" style="display: none;">
<div class="row" style="margin-bottom: 1px;">
<div class="col s12 l7">
<div style="padding: 10px; padding-left: 0;">
<div style="padding: 10px;">
<canvas id="cloudformation-status-chart" width="200" height="128"></canvas>
</div>
<p style="font-weight: bold; text-align: center; margin-bottom: 1px;">Event duration (in seconds)</p>
</div>
</div>
</div>
</div>

$(document).ready(function(){
 new Chart($('#cloudformation-status-chart'), {
            type: 'line',

            options: {
                legend: {
                    display: false
                },

                //responsive: false    /* works with this */
            },

            data: {
                labels: ['a', 'b', 'c', 'd'],
                datasets: [
                    {
                        label: 'Stack creation',
                        fill: true,
                        lineTension: 0.3,
                        backgroundColor: "rgba(75,192,192,0.4)",
                        borderColor: "rgba(75,192,192,1)",
                        borderCapStyle: 'butt',
                        borderDash: [],
                        borderDashOffset: 0.0,
                        borderJoinStyle: 'miter',
                        pointBorderColor: "rgba(75,192,192,1)",
                        pointBackgroundColor: "#fff",
                        pointBorderWidth: 1,
                        pointHoverRadius: 5,
                        pointHoverBackgroundColor: "rgba(75,192,192,1)",
                        pointHoverBorderColor: "rgba(220,220,220,1)",
                        pointHoverBorderWidth: 2,
                        pointRadius: 3,
                        pointHitRadius: 10,
                        data: [30, 40, 20, 50]
                    }
                ]
            }
        });



        $('div.container').fadeIn();
});

以下是它的外观截图:

正如您在iOS的Safari中所看到的那样,图表不会压缩并响应,如响应式设计模式预览所示,这是您想要的。

任何人都可以帮助我这样做吗?

0 个答案:

没有答案