表格图表给出链接按钮

时间:2014-05-26 08:40:12

标签: javascript charts google-visualization

 <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('string', 'Email');


            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, 'www.google.in']);
            }

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

            var formatter = new google.visualization.PatternFormat('<a href="{6}">{4}</a>');
            formatter.format(data, [4, 6]); 

            var view = new google.visualization.DataView(data);
            view.setColumns([0,1,2,3,4,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(view, { allowHtml: true, showRowNumber: true });
            //visualization.draw(view, { allowHtml: true, showRowNumber: true });
        }

     </script>

我在表格图表上面临问题添加链接按钮;这是我的代码。第7列需要google;首先尝试使用简单的表格,它工作正常;但是在控件和仪表板的情况下;它不是我试过bur任何人都可以帮我解决。谢谢..

1 个答案:

答案 0 :(得分:0)

看起来很好。只需将表格allowHtml选项设置为true

即可
var table2 = new google.visualization.ChartWrapper({
    'chartType': 'Table',
    'containerId': 'TableContainer2',
    'options': {
        'width': '895px',
        'page': 'enable',
        'pageSize': 5,
        allowHtml: true
    }
});

此外,尝试在信息中心的draw调用中设置选项将不会执行任何操作,因此请删除第二个参数:

new google.visualization.Dashboard(document.getElementById('PieChartExample2')).bind([categoryPicker2], [table2]).draw(view);