谷歌图表添加注释后图表不显示问题

Question

以下是创建图表的代码，在添加

之前图表将正确显示

google.visualization.DataView之后只会有一列;实际上y轴上有两列值。

我可以知道确切的原因以及如何解决这个问题？

<script type="text/javascript">

        function drawVisualization1(dataValues, chartTitle, columnNames, categoryCaption) {
            var data = new google.visualization.DataTable();
            data.addColumn('string', 'Subject');
            data.addColumn('number', 'Child Pecentage');
            data.addColumn('number', 'Subject Pecentage');


            for (var i = 0; i < dataValues.length; i++) {
                data.addRow([dataValues[i].ColumnName,( dataValues[i].Value1/100),( dataValues[i].Value2/100)]);

            }
            var formatter = new google.visualization.NumberFormat({ pattern: '####%' });
            formatter.format(data, 1);
            formatter.format(data, 2);

            var view = new google.visualization.DataView(data);
            view.setColumns([0, 1,
                       { calc: "stringify",
                           sourceColumn: 1,
                           type: "string",
                           role: "annotation"
                       },
                       2, { calc: "stringify",
                           sourceColumn: 2,
                           type: "string",
                           role: "annotation"
                       }]);

            var categoryPicker = new google.visualization.ControlWrapper({
                'controlType': 'CategoryFilter',
                'containerId': 'CategoryPickerContainer1',
                'options': {
                    'filterColumnLabel': 'Subject',
                    'ui': {
                        'labelStacking': 'horizontal',
                        'allowTyping': false,
                        'allowMultiple': false,
                        'caption': categoryCaption,
                        'label': 'Subject'
                    }
                }
            });
            var pie1 = new google.visualization.ChartWrapper({
                'chartType': 'ColumnChart',
                'containerId': 'PieChartContainer1',
                dataTable: data,
                'options': {
                    'width': 600,
                    'height': 350,
                    'legend': 'right',
                    'title': 'Topic Performance',
                    'chartArea': { 'left': 70, 'top': 55, 'right': 50, 'bottom': 20 },
                    'hAxis': { title: 'Subject', titleTextStyle: { color: 'red' }, format: '####%'
                    },
                    'vAxis': { format: '####%', 'minValue': 0,

                        'maxValue': 1.2
                    },
                    'bar': { groupWidth: '25%' }

                },
                'view': { 'columns': [0, 1, 2] }
            });

            new google.visualization.Dashboard(document.getElementById('PieChartExample1')).bind([categoryPicker], [pie1]).draw(view);
            // Define a table

        }


    </script>