Google图表排序与Google图表编辑器

时间:2015-05-28 16:44:05

标签: javascript charts google-visualization

请帮忙!我快要疯了!我有一个用于Google Chart的Javascript,可以在同一个数据集上构建表格和图表,当您对表格进行排序时,图表上的值也会被排序。我还有一个代码可以打开Goog​​le Charts Editor ...它可以构建自己的图表。我需要的是合并这两个功能。我需要构建一个表格和一个图表(当我对表格进行排序时会对其进行排序)当我打开编辑器时,我需要它来编辑这个图表(它仍将与表格中的排序相关联)并且不构建新的图表。

以下是我的两个功能:

function drawSort() {
    var data = new google.visualization.DataTable( <?= $jsonTable ?> );

    var formatter = new google.visualization.NumberFormat({
        prefix: '$'
    });
    formatter.format(data, 1); // Apply formatter to second column

    var view = new google.visualization.DataView(data);
    view.setColumns([0, 1]);

    var table = new google.visualization.Table(document.getElementById('table_s_div'));
    table.draw(view);

    var chart = new google.visualization.BarChart(document.getElementById('chart_s_div'));
    chart.draw(view);

    google.visualization.events.addListener(table, 'sort',

    function (event) {
        data.sort([{
            column: event.column,
            desc: !event.ascending
        }]);
        chart.draw(view);
    });
}

var chartEditor = null;

function loadEditor() {
    // Create the chart to edit.
    var data = new google.visualization.DataTable( <?= $jsonTable ?> );
    var wrapper = new google.visualization.ChartWrapper({
        chartType: 'LineChart',
        dataTable: data,
        options: {
            'title': 'Number of Newly Opened Roles per <?echo $_SESSION['
            Display ']?>',
                'legend': 'none',
        }
    });

    chartEditor = new google.visualization.ChartEditor();
    google.visualization.events.addListener(chartEditor, 'ok', redrawChart);
    chartEditor.openDialog(wrapper, {})
}

// On "OK" save the chart to a <div> on the page.
function redrawChart() {
    chartEditor.getChartWrapper().draw(document.getElementById('chart_s_div'));
}

0 个答案:

没有答案