Làm thế nào để giảm kích thước của Biểu đồ hình tròn KendoUI?

Question

Làm thế nào để bạn giảm kích thước của biểu đồ tròn KendoUI? Tôi đang sử dụng biểu đồ hình tròn bằng cách sử dụng cấu hình sau. Tôi đã đặt lề thành 1 pixel và đệm thành 1 pixel nhưng dường như không ảnh hưởng đến cách biểu đồ tròn được hiển thị. Tôi không có tiêu đề nhưng vẫn còn không gian cho một tiêu đề. Tôi muốn có thể giảm không gian giữa đầu biểu đồ và khoảng cách giữa truyền thuyết và biểu đồ thực tế.

cấu hình của tôi:

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 } 
     }); 

Answer 1

Biểu đồ hình tròn có 60px padding theo mặc định. Nếu bạn cần giảm khoảng trống xung quanh biểu đồ hình tròn, bạn cần thay đổi phần đệm đó.

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

Answer 2

$("#chart").kendoChart({ 
    theme: $(document).data("kendoSkin") || "default", 
    title: { 
     text: "Samplet" 
    }, 
    seriesDefaults: { 
     labels: { 
      template: "#= kendo.format('{0:P}', percentage)#", 
      visible: true 
     } 
    },chartArea: { 
    width: 300, 
    height: 300 
}, 
    series: [{ 
     type: "pie", 
     data: [{ 
      category: "Quality", 
      value: 80}, 
     { 
      category: "Time", 
      value: 20}, 
     { 
      category: "Cost", 
      value: 40}]}], 
    tooltip: { 
     visible: true, 
     template: "#= kendo.format('{0:P}', percentage)#" 
    } 

}); 

đây chúng ta định nghĩa một tài sản trong chartarea để thay đổi kích thước biểu đồ pie ..