图表响应

Question

我有折线图。但我的图表没有响应。我怎样才能使其响应？ 这是我的脚本代码：

$(document).ready(function(){

 var data = <?php echo json_encode($data) ?>;


        var id = [];
        var akim = [];

        for(var i in data) {
            id.push(data[i].id);
            akim.push(data[i].akim);
        }

        var chartdata = {
            labels: id,
            datasets: [
                {
                    label: "akim",
                    fill: false,
                    lineTension: 0.1,
                    backgroundColor: "rgba(211, 72, 54, 1)",
                    borderColor: "rgba(211, 72, 54, 1)",
                    pointHoverBackgroundColor: "rgba(211, 72, 54, 1)",
                    pointHoverBorderColor: "rgba(211, 72, 54, 1)",
                    data: akim
                }
            ]
        };

        var ctx = $("#mycanvas");

        var LineGraph = new Chart(ctx, {
            type: 'line',
            data: chartdata
        });
});

这是我的绘图代码：

<div class="box box-primary">
        <div class="box-header with-border">
          <i class="fa fa-bar-chart-o"></i>

          <h3 class="box-title">Dakikalık Gösterim</h3>

          <div class="box-tools pull-right">
            <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i>
            </button>
            <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>
          </div>
        </div>
        <div class="box-body">
          <div class="chart-container">
        <canvas id="mycanvas"></canvas>
    </div>
        </div>
        <!-- /.box-body-->
      </div>

但是它显示了这样。

我该怎么做才能使其响应？

Answer 1

我的CSS代码是像素格式。我改变了这很正常。

<style>.chart-container {width: 100%;height: auto;}</style>