我已经尝试了很多东西(修改css,将内联css添加到画布,将内联css添加到画布的包装div)但我仍然无法使图表正确地适合面板。
这是HTML
<section class="panel">
<header class="panel-heading">
Temp
</header>
<canvas id="tempChart"></canvas>
</section>
这是js代码
<script>
var data = {
labels: ["January", "Aary", "March", "April", "May", "June"],
datasets: [{
label: "My First dataset",
fillColor: 'rgba(220,220,220,0)',
strokeColor: "rgba(220,220,220,1)",
pointColor: 'red',
pointStrokeColor: "#fff",
pointHighlightFill: "#fff",
pointHighlightStroke: "rgba(220,220,220,1)",
data: [65, 59, 80, 81, 56, 55, 40]
} ]
};
var option = {
responsive: true,
};
var ctx = $("#tempChart").get(0).getContext("2d");
var myLineChart = new Chart(ctx).Line(data, option);
CSS中的类面板仅包含图形内容,例如边框背景颜色等。 顺便说一下,我正在使用Bootstrap网格。 谢谢你的帮助。
答案 0 :(得分:0)
您是否尝试使用默认值设置所有图表:Chart.defaults.global.responsive = true;
你设置的全局synthax似乎是正确的
var options = { responsive:true }
然而;这是一个很小的细节,但你真的加了一个昏迷。 我建议删除它。
正如@brian建议的那样;请;告诉我们lib的版本。 添加jsfindle甚至更好答案 1 :(得分:0)
感谢所有回复。问题是我正在使用的lib版本。更新解决了问题。