Google Visualization Column Chart将查询中的数据列设置为角色:" Style"

时间:2016-02-29 17:07:14

标签: google-apps-script google-visualization

我从查询中获得了Google Visualization柱形图,效果很好。我可以使用下面的代码片段在查询后设置带有样式角色的列。它为查询数据添加了一个新列,并将角色设置为" Style"。这会相应地为每个柱形图条形图着色。但我希望能够使用我的一个查询列" C"例如作为颜色代码,之后不必添加它。我似乎无法让这个工作。有任何想法吗?我在代码段下方发布了更多代码,以便您可以看到我来自哪里。非常感谢你们给予的任何帮助。布兰登

  var data = response.getDataTable();

            data.addColumn({type: "string", role: "style" });
            data.setCell(0,2,'red');
            data.setCell(1,2,'orange');
            data.setCell(2,2,'green');
            data.setCell(3,2,'yellow');
// More code above this, but I ommited it.  

function drawDashboard() {
         var query = new google.visualization.Query(
         'URL');


     query.setQuery('SELECT A, B, C');
     query.send(handleQueryResponse);
      }

      function handleQueryResponse(response) {
        if (response.isError()) {
          alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage());
          return;
        }

  var data = response.getDataTable();

            data.addColumn({type: "string", role: "style" });
            data.setCell(0,2,'red');
            data.setCell(1,2,'orange');
            data.setCell(2,2,'green');
            data.setCell(3,2,'yellow');

        // Create a dashboard.

        var dashboard = new google.visualization.Dashboard(
            document.getElementById('dashboard_div'));

        // Create a range slider, passing some options
        var scoreSlider = new google.visualization.ControlWrapper({
            controlType: 'NumberRangeFilter',
            containerId: 'filter_div',
            options: {
            filterColumnLabel: 'Class AVG'
               }
        });

        var ClassFilter = new google.visualization.ControlWrapper({
            controlType: 'CategoryFilter', 
            containerId: 'Classfilter_div',
            options: {
            'filterColumnLabel': 'Teacher Name','ui': { 'labelStacking': 'veClasscal','allowTyping': true,'allowMultiple': true
               }
        }});

        // Create a Column Bar chart, passing some options
        var columnChart = new google.visualization.ChartWrapper({
            chartType: 'ColumnChart',
            containerId: 'chart_div',
            options: {
                title: 'Math Proficiency by Class',
                height: 320,
                width: 500,
                chartArea:{left:"10%",top:"10%",width:"80%",height:"60%"},
                hAxis: {textStyle: {fontSize:14}, title: 'Teacher Name', titleTextStyle: {fontSize:14}, textStyle: {fontSize:14}},
                vAxis: {minValue: 0, maxValue: 100, title: 'Math Proficiency AVG', titleTextStyle: {fontSize:14}, textStyle: {fontSize:14}},
                legend: {position: 'none'},
                animation: {duration:1500, easing:'out'},
                colors: ['#a4c2f4','#3c78d8']
            },
               view: {columns: [0, 1, 2]}
        });

        // Define a table
        var table = new google.visualization.ChartWrapper({
          chartType: 'Table',
          dataTable: data,
          containerId: 'table_div',
          options: {
          width: '400px'
               },
                 view: {columns: [0, 1,]}
         });

        // Establish dependencies, declaring that 'filter' drives 'ColumnChart',
        // so that the column chart will only display entries that are let through
        // given the chosen slider range.

        dashboard.bind([scoreSlider], [table, columnChart]);
        dashboard.bind([ClassFilter], [table, columnChart]);

        // Draw the dashboard.
        dashboard.draw(data);

      }// More code below this, but I ommited it.

1 个答案:

答案 0 :(得分:1)

我不确定如何将其添加到查询中的列,但是......

使用带有计算列的DataView应该有效...

假设您要测试的值位于第二列 - 索引 plots <- replicate(16, ggplot(), simplify = FALSE)

1