javascript - 如何缩小 KendoUI 饼图的大小?

标签 javascript asp.net jquery-plugins telerik kendo-ui

如何缩小KendoUI饼图的大小?我正在使用以下配置使用饼图。我已将边距设置为 1 个像素,将填充设置为 1 个像素,但它似乎对饼图的呈现方式没有任何影响。我没有标题,但仍有标题空间。我希望能够减少图表顶部之间的空间以及图例和实际图表之间的空间。

我的配置:

jQuery("#chart").kendoChart({
//              theme: jQuery(document).data("kendoSkin") || "Metro",
            legend: {
                position: "bottom",
                padding: 1,
                margin: 1
            },
            seriesDefaults: {
                labels: {
                    visible: true,
                    template: "${ value }%"
                }
            },
            dataSource: {
                data: <%=ChartData%>
            },
            series: [{
                type: "pie",
                field: "percentage",
                categoryField: "source",
                explodeField: "explode"
            }],
            tooltip: {
                visible: false,
                template: "${ category } - ${ value }%"
            },
            title: { padding: 1, margin: 1 },
            seriesColors: ["#d15400", "#19277e", "#e2935e", "#d2d2d2"],
            chartArea: { margin: 1 },
            plotArea: { margin: 1 }
        });

最佳答案

饼图默认有 60px padding。如果您需要减少饼图周围的空间,则需要更改该填充。

...
series: [{
    type: "pie",
    field: "percentage",
    categoryField: "source",
    explodeField: "explode",
    padding: 0
}]
...

关于javascript - 如何缩小 KendoUI 饼图的大小?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8791831/

相关文章:

javascript - Ubergallery 和 ajax

c# - SignalR 不调用 jQuery 函数

asp.net - jQuery:使用 AJAX 加载外部页面,然后调用 insertAfter() 到表行

jquery - $(function (){}) 和 (function ($){}) 之间的区别

javascript - 自定义拖放实现

javascript - 悬停时如何在chart.js中的特定点添加水平线?

javascript - Angular.js 嵌套指令继承

javascript - Bootstrap标签输入

javascript - 使用 jQUery UI 库的拆分器

javascript - 使用 jquery 插件删除内联样式