剑道 UI 图表没有调整大小？答案

【问题标题】：Kendo UI chart not resizing?剑道 UI 图表没有调整大小？
【发布时间】：2014-08-01 17:40:33
【问题描述】：

我有一个 Kendo ui 图表，它显示来自动态数据源的柱形图。但有时，图表会打开可用空间大小的一半。当我单击某些链接或更改日期时，它会自行调整大小。知道为什么会导致它吗？

在数据源更改事件中，当它显示此行为时，它将容器 div 的宽度显示为 0。如果需要，我可以提供更多详细信息

我尝试了其中一个答案中给出的刷新方法，但它没有帮助

【问题讨论】：

这个问题请做一个JSfiddel或者一个JSbin。还要确保购物车所在的容器的宽度设置为 100%。
请分享更多信息或创建 jsfiddle 以便我们可以看到...通常 $("#chart").data("kendoChart").redraw() 工作正常，但分享您的代码..

标签： kendo-ui

【解决方案1】：

当您在动画窗口中打开图表时，通常会发生这种情况。

我的建议是在您确定所有内容都已加载并完全打开时重新绘制图表。

$("#myChart").data("kendoChart").redraw();

如果您没有禁用动画，您可能希望在此之前执行此操作并在之后重新启用它们。

$("#myChart").data("kendoChart").options.transitions = false;

【讨论】：

【解决方案2】：

当您在控制器中获得所有必要的数据后，您可以调用 Javascript 回调函数，在该函数中您可以将转换设置为 false，然后重绘图表并将转换设置为 true，您也可以默认隐藏图表并使其在 Javascript 回调函数中可见

【讨论】：

【解决方案3】：

试试这个

var chart=$("#chart").data("kendoChart");
//to check the chart exist or not if exist then redraw it..
if(chart)
{
chart.redraw();
}

谢谢

【讨论】：

【解决方案4】：

这是我用于图表的：

if($("#areaChart").data("kendoChart")) {
    $("#areaChart svg").width(Number($('.k-content').width()));
    $("#areaChart svg").height(Number($('.k-content').height()));

    $("#areaChart").data("kendoChart").refresh();
}

取自here

您检查过resize() 方法吗？

【讨论】：

您不想使用 .refresh() 方法，因为它会再次调用图表的读取传输然后重绘。 .redraw() 只会重新显示图表数据源中的当前数据。

【解决方案5】：

我在调用 CreateChart() 函数后添加了一个小延迟来修复它，如下所示：

CreateChart(this.id, this.id + " this week", "week", null);
    sleep(1000);

现在可以正常使用了

【讨论】：

【解决方案6】：

$("#divSensingData").kendoChart({ 图表区域：{ 宽度：900，身高：500 },

【讨论】：