如何在html和servlet或jsp中创建分层饼图？

Question

我想创建一个显示百分比的分层饼图吗？如何在Java中使用d3创建分层饼图？

它应该是这样的：http://yhnavein.github.io/d3-hierarchical-pie/

请给我提供的代码中使用JSP，AJAX，JSON和servlet来创建。

Answer 1

if ($('#Start_date').val().length==0) { 
     alert("Please Select Start Date"); 
    }else if($('#end_date').val().length==0){ 
      alert("Please Select End Date"); 
    } 
    else{ 

$('#chart-container-OTAType').text(); 
var graphData; 
var data = { 
    action: "getOTATypeByDate", 
    fromDate: fromDate, 
    toDate: toDate 
}; 
var dataString = 'MainJson=' + JSON.stringify(data); 
$.ajax({ 
    type: 'POST', 
    url: './OTAServlet', 
    data: dataString, 
    dataType: 'text', 
    async: false, 
    success: function (result) { 
     var responseData = $.trim(result); 
     graphData = JSON.parse(responseData); 
     if (FusionCharts('OTAType-Pie-chart')) { 
      FusionCharts('OTAType-Pie-chart').dispose(); 
     } 
     $("#divOTATypeGraph").text(''); 

      var chart = new FusionCharts({  
      type: 'pie2d', 
      renderAt: 'divOTATypeGraph', 
      id: 'OTAType-Pie-chart', 
      width: '650', 
      height: '500', 
      dataFormat: 'json', 
      dataSource: { 
       "chart": { 
        "caption": "Report for OTA", 
        "showvalues": "1", 
        "showpercentvalues": "1", 
        "showpercentintooltip": "0", 
        "bgcolor": "#FFFFFF", 
        "basefontcolor": "#400D1B", 
        "showshadow": "0", 
        "animation": "0", 
        "showborder": "0", 
        "paletteColors": '#9B609B,#AACB47,#1A9494,#BE6F71, #AACB47', 
       }, 
       "data": graphData 
      }, 
      "events": { 
       "dataPlotClick": function (eventObj, dataObj) { 
        var text = dataObj.categoryLabel; 
        if(text == 'OTA') { 
         otaStatus = 1; 
        } 


        if (otaStatus > 0) { 
         getBrandStatusByDate(otaStatus); 
        } 
       } 
      } 


     }); 
     chart.render(); 
    }