Passing chart type parameter to custom function as

问题:

Currently i am creating chart using google chart. for this i have created one custom function called myJchart as below.

    function myJChart(ChartPackage,ChartType,ChartData,ChartTitel,ChartSubtitle,Chart3D,ChartHeight,ChartWidth,ChartDivID){

        google.load("visualization", "1", {packages:[ChartPackage]});
        google.setOnLoadCallback(drawChart);
        function drawChart() {
            var data = google.visualization.arrayToDataTable(ChartData);
            var options = {
                title: ChartTitel,
                subtitle: ChartSubtitle,
                is3D: true,
                height: ChartHeight,
                width: ChartWidth               
                };


        var chart = new google.visualization.PieChart(document.getElementById(ChartDivID));
            chart.draw(data, options);
      }

    }

And Calling function

myJChart('corechart','PieChart',<?php echo $jsonTable;?>,'test','test again',true,'600','800','chart_div'); 

this above function is working good. now the problem is that when i pass the ChartType parameter to google google.visualization.ChartType i am getting below error message

Uncaught TypeError: google.visualization.ChartType is not a function

i used [ChartType] but i got this error Unexpected token [ any suggestion will help.

回答1:

I would suggest using the ChartWrapper Class for this...

mainly because you only want to call google.load once.

ChartWrapper will dynamically load what it needs depending on the chart type.

google.load("visualization", "1.1", {packages:["controls"]});
google.setOnLoadCallback(googleLoaded);

// test data
var rowData1 = [['Month', 'Bolivia', 'Ecuador', 'Madagascar', 'Papua  Guinea','Rwanda', 'Average'],
                ['2004/05', 165, 938, 522, 998, 450, 114.6],
                ['2005/06', 135, 1120, 599, 1268, 288, 382],
                ['2006/07', 157, 1167, 587, 807, 397, 623],
                ['2007/08', 139, 1110, 615, 968, 215, 409.4],
                ['2008/09', 136, 691, 629, 1026, 366, 569.6]];

function googleLoaded() {
    myJChart('corechart', 'BarChart', rowData1, 'test', 'test again', true, 600, 800, 'chart_div');
}

function myJChart(ChartPackage, ChartType, ChartData, ChartTitel, ChartSubtitle, Chart3D, ChartHeight, ChartWidth, ChartDivID){
    chart = new google.visualization.ChartWrapper({
        chartType: ChartType,
        containerId: ChartDivID,
        dataTable: google.visualization.arrayToDataTable(ChartData),
        options: {
            title: ChartTitel,
            subtitle: ChartSubtitle,
            is3D: Chart3D,
            height: ChartHeight,
            width: ChartWidth
        }
    });

    chart.draw();
}

<script src="https://www.google.com/jsapi"></script>
<div id="chart_div"></div>