问题描述
我在Chart JS中遇到一个奇怪的间歇性问题( http://www.chartjs.org/)在html5 IOS应用中.
I'm having a strange intermittent issue with Chart JS (http://www.chartjs.org/) within a html5 IOS app.
我已经定义了我的画布,如下所示-
I have defined my canvas as listed here -
<canvas id="overallChart" height="270" width="270" style="height:270px!important; width:270px!important;"></canvas>
页面中有多个图表-图表是通过基本的图表js设置触发的-
There are multiple charts in a page - the charts are triggered via a basic chart js settings -
var lineData = {
labels : ["Jan","Feb","March","April","May"],
datasets : [
{
fillColor : "rgba(255,128,38,0.9)",
strokeColor : "rgba(225,225,225,1)",
pointColor : "rgba(225,225,225,1)",
pointStrokeColor : "#fff",
data : [65,59,90,81,56]
},
{
fillColor : "rgba(119,62,20,0.9)",
strokeColor : "rgba(225,225,225,1)",
pointColor : "rgba(225,225,225,1)",
pointStrokeColor : "#fff",
data : [28,48,40,19,96]
}
]
}
var lineChart = new Chart(document.getElementById("lineChart").getContext("2d")).Line(lineData)
尽管采用内联重要"样式,但画布会随机绘制出巨大的图表版本并更改高度/宽度值.
Despite the inline Important style - the canvas randomly draws out a huge version of the chart and alters the height /width values.
还有其他人经历过这种行为吗?有什么建议可以解决吗?
Has anyone else experienced this behaviour? Any suggestions to fix?
推荐答案
我遇到了相同/相似的问题,并找到了解决方案:在以前使用的画布上重新绘制(重新绘制以合并新用户)时出现了问题-输入数据,或绘制其他类型的图表(例如).在新鲜"画布上绘图永远不会引起缩放问题.
I have encountered the same/similar problem and found a solution: the problem arose when re-drawing on a previously used canvas (re-drawing to incorporate new user-input data, or drawing a different type of chart, for example). Drawing on a 'fresh' canvas never caused scaling issues.
因此,解决方案是在绘制之前,将用过的画布替换为新的画布.在jQuery中:
Therefore, the solution is to replace the used canvas with a new one, before drawing on it. In jQuery:
$("#overallChart").replaceWith("<canvas id='overallChart' height='270' width='270'></canvas>");
var lineChart = new Chart(document.getElementById("overallChart").getContext("2d")).Line(lineData);
这篇关于画布调整大小-IOS HTML5应用-(图表JS)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!