(kendoUI图表)可以使用调整大小窗口重新调整其大小?

soz*_*hen 5 javascript css highcharts kendo-ui

以下是饼图的设置:

function createChart(chartDataSource) {
    $("#chart").kendoChart({
        theme:$(document).data("kendoSkin") || "black",
        title:{
            text:"Efficiency"
        },
        legend:{
            position:"bottom"
        },
        dataSource:chartDataSource,
        series:[
            {
                type:"pie",
                field:"val",
                categoryField:"status"
            }
        ],
        tooltip:{
            visible:true,
            template:"${category} - #= kendo.format('{0:P}', percentage)#"
        }
    });
Run Code Online (Sandbox Code Playgroud)

CSS风格:

#chart {
    width: 50%;
    height: 50%;
    }
Run Code Online (Sandbox Code Playgroud)

我知道Highcharts有reflowboolean(StackOverflow中的reflow示例)完全符合我的要求.

我不确定kendoUI图表是否具有相同的回流设置,或者我应该使用CSS样式.如果去CSS,如何进行此类设置?

谢谢

Mar*_*ark 9

在链接的帖子中应用我的想法,只需挂钩窗口调整大小事件并重绘图表:

$(window).resize(function() 
{    
    var chart = $("#chart").data("kendoChart");
    chart.refresh();
});
Run Code Online (Sandbox Code Playgroud)

在这里工作小提琴.

  • $(window).resize(function(){kendo.resize($(".k-chart"));}); 将在不刷新图表的情况下完成工作. (5认同)