无法使图表js响应 [英] Can't make chart js responsive

问题描述

抱歉，如果我错过任何解决问题的方法，我已经阅读并尝试了许多解决方案，而且没有任何解决方案适应问题。

sorry if I missed anything to fix my issue, I've read and tried many solutions without any of them being adapted to the problem.

我有几个图表（来自chart.js）在一个页面上，但我不能成功地使它们响应，尽管：

I have several charts (from chart.js) on a single page, but I can't succeed to make them responsive, despite :

responsive: true,

我可以获得的最佳响应显示是在放大画布宽度和高度时，但在桌面上版本图表显示在整个屏幕上。

The best responsive display I could get was when enlarging canvas width and height, but on the desktop version charts were displayed the entire screen.

这是 fiddle.net

有人帮我吗？非常感谢。

Anybody to help me ? Thank you very much.

推荐答案

答案是：

<强> 1。在画布周围添加div

例如：

<div class="wrapper">
    <canvas width="600" height="250"></canvas>
</div>

2。在CSS中为div类添加高度

.wrapper {
height: 500px !important;
}

（根据您的意愿调整高度）

(adjust height as you wish the responsive rendering)

这篇关于无法使图表js响应的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！