如何在饼图中创建动态值

时间:2018-03-21 16:04:42

标签: javascript jquery

这里我使用饼图,我给出静态值意味着它工作正常,但我想要动态值而不是静态

  1. ['单人占用的旅行',2845]而不是我必须给['单人占用的旅行',40], 因为employeeTraveld 1表示total_Trip是40 像这样我必须给剩下的四个值
  2.   

    我尝试过这样但是没有骚扰

                var res=jQuery.parseJSON(result);// convert the json
            console.log(res);
    
    
                $.each( res['data'], function( key, value ) { 
                    var employeeTraveld = value.employeeTraveld;
                    var total_Trip = value.total_Trip;
                    console.log(employeeTraveld + " = "+ total_Trip);
    
                    {
                      "status": "success",
                      "data": [
                        {
                          "employeeTraveld": "1",
                          "total_Trip": "40"
                        },
                        {
                          "employeeTraveld": "2",
                          "total_Trip": "19"
                        },
                        {
                          "employeeTraveld": "3",
                          "total_Trip": "26"
                        },
                        {
                          "employeeTraveld": "4",
                          "total_Trip": "21"
                        }
                      ]
                    }
    
    
                    var data = google.visualization.arrayToDataTable([
                          ['Task', 'Hours per Day'],
                          ['Trip With Single Occupancy',     if(employeeTraveld == 1){total_Trip}],
                          ['Trip With Two Occupancy',      if(employeeTraveld == 2){total_Trip}],
                          ['Trip With Three Occupancy',  if(employeeTraveld == 3){total_Trip}],
                          ['Trip With Four Occupancy', if(employeeTraveld == 4){total_Trip}]
                        ]);
                });
    

    google.setOnLoadCallback(drawChart);
          function drawChart() {
    
    				var result =	{
    					  "status": "success",
    					  "data": [
    						{
    						  "employeeTraveld": "1",
    						  "total_Trip": "40"
    						},
    						{
    						  "employeeTraveld": "2",
    						  "total_Trip": "19"
    						},
    						{
    						  "employeeTraveld": "3",
    						  "total_Trip": "26"
    						},
    						{
    						  "employeeTraveld": "4",
    						  "total_Trip": "21"
    						}
    					  ]
    					}
    					
    					//console.log(result);
    			
    			 var data = google.visualization.arrayToDataTable([
    					  ['Task', 'Hours per Day'],
    					  ['Trip With Single Occupancy',     2845],
    					  ['Trip With Two Occupancy',      2717],
    					  ['Trip With Three Occupancy',  5369],
    					  ['Trip With Four Occupancy', 1723]
    					]); 
    					
    					var options = {
    				  title: 'My Daily Activities'
    				};
    
    				var chart = new google.visualization.PieChart(document.getElementById('piechart'));
    
    				chart.draw(data, options);
    			
    		}
    <script type="text/javascript" src="https://www.google.com/jsapi?autoload={'modules':[{'name':'visualization','version':'1.1','packages':['corechart']}]}"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
           <div id="piechart" style="width: 900px; height: 500px;"></div>

0 个答案:

没有答案