Kendo ui 剑道UI图表不占用所有div宽度

Kendo ui 剑道UI图表不占用所有div宽度,kendo-ui,kendo-dataviz,Kendo Ui,Kendo Dataviz,我正在使用KendoUIDataViz开发我的应用程序,但是我在绘制图表时遇到了一个问题。当图表是渲染器时,它没有占用所有的div宽度,如下所示 我的JS代码: function creatChart() { $("#chart").kendoChart({ dataSource : { transport : { read : {

我正在使用KendoUIDataViz开发我的应用程序,但是我在绘制图表时遇到了一个问题。当图表是渲染器时,它没有占用所有的
div
宽度,如下所示

我的JS代码:

    function creatChart() {
        $("#chart").kendoChart({
            dataSource : {
                transport : {
                    read : {
                        url : "myUrl",
                        dataType : "json",
                    },
                }
            },
            legend : {
                position : "top"
            },
            series : [ {
                type : "area",
                field : "valor1",
                color : "#73c100",
                axis : "axes1"
            }, {
                type : "line",
                field : "valor2",
                color : "#007eff",
                position : "right",
                axis : "axes2"
            } ],
            valueAxes : [ {
                name : "axes1",
                color : "#73c100",
                min : 0,
                max : 150
            }, {
                name : "axes2",
                color : "#007eff",
                min : 0,
                max : 150
            } ],
            categoryAxis : {
                field : "data",
                labels : {
                    template : "#=$(this).formatDate(value)#",
                    rotation: -35
                }
            },
            tooltip : {
                visible : true,
                format : "{0}"
            }
        });
    }
我的HTML代码:

                           <div id="tabs-1">
                                <div class="row-fluid" style="padding-top: 45px">
                                    <div class="span2" style="padding-left: 15px; padding-top: 15px; padding-bottom: 15px">Selecione
                                    o período:
                                    </div>
                                    <div class="span3">
                                        <input type="text" class="dataInicio" readonly="readonly" style="margin-top: 15px;"/>
                                    </div>
                                    <div class="span1">
                                        <label style="margin-top: 15px;">à</label>
                                    </div>
                                    <div class="span5">
                                        <input type="text" class="dataFim" readonly="readonly" style="margin-top: 15px;"/>
                                         <button class="btn submit" style="margin-top: 10px;">Buscar</button>
                                    </div>
                                </div>
                                <div class="row-fluid">
                                    <div class="span12">
                                        <div id="chart"></div>
                                    </div>
                                </div>
                            </div>

孤岛
佩里奥多:
à
客车
我需要图表占据所有
div
宽度。有人能帮我吗?

请用电话线

chartArea: { margin: 0, padding: 0, height: (screen.height * 0.50), width: (screen.width * 0.35) },
plotArea: { margin: 0, padding: 0, height: (screen.height * 0.50), width: (screen.width * 0.35) },
找到下面的代码

$("#chartNo1").kendoChart({

    theme: $(document).data("kendoSkin") || "silver",


        title: {
            text: "Store Visits"
        },
        chartArea: { margin: 0, padding: 0, height: (screen.height * 0.50), width: (screen.width * 0.35) },
        plotArea: { margin: 0, padding: 0, height: (screen.height * 0.50), width: (screen.width * 0.35) },



        legend: {
            visible: false
        },
        seriesDefaults: {
            type: "bar"
        },
        series: [{
            name: "Total Visits",
            data: [56000, 63000, 74000, 91000, 117000, 138000]
        }, {
            name: "Unique visitors",
            data: [52000, 34000, 23000, 48000, 67000, 83000]
}],
            valueAxis: {
                max: 140000,
                line: {
                    visible: false
                },
                minorGridLines: {
                    visible: true
                }
            },
            categoryAxis: {
                categories: ["Jan", "Feb", "Mar", "Apr", "May", "Jun"],
                majorGridLines: {
                    visible: false
                }
            },
            tooltip: {
                visible: true,
                template: "#= series.name #: #= value #"
            }
        });

    };

使用浏览器的调试器确定是什么控制剑道控件的宽度,并对其进行适当设置。检查span12,row fluid,您好,谢谢您的回答,但我使用此代码
$(“#图表”).data(“kendoChart”).refresh()解决了问题,当我在选项卡中单击以访问我的图表时,执行了前面的代码,并调整了图表的大小。谢谢