Question

 <script type="text/javascript">
        function drawVisualization2(dataValues, chartTitle, columnNames, categoryCaption) {
            if (dataValues.length < 1)
                return;
            var data = new google.visualization.DataTable();
            data.addColumn('string', columnNames.split(',')[0]);
            data.addColumn('string', columnNames.split(',')[1]);
            data.addColumn('string', columnNames.split(',')[2]);
            data.addColumn('number', columnNames.split(',')[3]);
            data.addColumn('number', columnNames.split(',')[4]);
            data.addColumn('number', columnNames.split(',')[5]);
            data.addColumn('button', 'test');


            for (var i = 0; i < dataValues.length; i++) {
                data.addRow([dataValues[i].Value1, dataValues[i].Value2, dataValues[i].Value3, dataValues[i].Value4, dataValues[i].Value5, dataValues[i].Value6, '<input type="button" value="test" />']);
            }

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

            var categoryPicker2 = new google.visualization.ControlWrapper({
                'controlType': 'CategoryFilter',
                'containerId': 'Container1',
                'options': {
                    'filterColumnLabel': columnNames.split(',')[1],
                    'ui': {
                        'labelStacking': 'horizontal',
                        'allowTyping': false,
                        'allowMultiple': false,
                        'caption': categoryCaption,
                        'label': columnNames.split(',')[2]
                    }
                }
            });


            var table2 = new google.visualization.ChartWrapper({
                'chartType': 'Table',
                'containerId': 'TableContainer2',

                'options': {
                    'width': '895px',
                    'page': 'enable',
                    'pageSize': 5

                }
            });

            new google.visualization.Dashboard(document.getElementById('PieChartExample2')).bind([categoryPicker2], [table2]).draw(data);
            visualization.draw(data, { allowHtml: true });
        }



     </script>

绘制表格图表的简要代码;正常的表格图表正确;但是当我添加按钮时它出错了。想把表格图表添加到按钮，我无法做到这一点。任何人都可以帮我这么做...谢谢......任何建议或链接。

Answer 1

向Google展示的表格图表添加按钮：

    var buttonColumnIndex=data.addColumn('string','ButtonColumn');

您可以通过以下方式将按钮添加到该列中的特定单元格：

    data.setCell(rowIndex,buttonColumnIndex,'<input type="button" value="test"/>');

为此， allowHtml 应设置为true。

Answer 2

您声明和插入按钮的方式就是问题。

声明：

data.addColumn('string', ''); //对于按钮列

插入：

{v:'ButtonName', f:'<input type="button" value="test" />'}

因此，在您的情况下，完整插入如下，

data.addRow([dataValues[i].Value1, dataValues[i].Value2, dataValues[i].Value3, dataValues[i].Value4, dataValues[i].Value5, dataValues[i].Value6, {v:'ButtonName', f:'<input type="button" value="test" />'}]);

请参阅DataTable

了解更多详情

在谷歌图表添加按钮的表格图表

2 个答案: