Question

我正在使用谷歌图表API并在其中使用图表编辑器。我看到几个例子能够将它添加到我的网页，但是，数据网址是硬编码的，我希望用户提供数据网址，我尝试了一些东西，但似乎没有任何工作。

HTML code snippet

<div id="chartData" class="invisible">
    <div id="chartType">
        <div>Data</div>
        <div>Google Spreadsheet Url (Public)</div>
        <div>
            <input type="url" id="googleURL"/>
         </div>
         <div class="alignCenter">Or</div>
         <div>Enter your own data</div>
     </div>
</div>
<div id="googleChart" class="invisible">
   <input type='button' onclick='openEditor()' value='Open Editor'/>
    <div id='visualization' style="width:80%;height:50%;"> </div>
</div>

Java脚本代码

var wrapper;
function init() {
    wrapper = new google.visualization.ChartWrapper({
        containerId: 'visualization',
        dataSourceUrl: 'https://docs.google.com/spreadsheet/ccc?key=0AivgZyecjo7adDNOVTZEUWRoU1c2YXhuSXpEcVA1a3c#gid=0',
        chartType: 'LineChart'
    });
    wrapper.draw();
}

function openEditor() {
    closeAllDialogs();
    // Handler for the "Open Editor" button.
    var editor = new google.visualization.ChartEditor();
    google.visualization.events.addListener(editor, 'ok',
        function() {
            wrapper = editor.getChartWrapper();
            wrapper.setDataSourceUrl($('googeUrl').val());
            wrapper.draw(document.getElementById('visualization'));
            openGoogleChartDialog();
        });
    editor.openDialog(wrapper);
}
google.setOnLoadCallback(init);

所以我希望datasourceurl由$（'＃googleURL'）设置.val（）;
但看起来像google.setOnLoadCallback（init）在页面加载时调用了init函数;
无论如何我可以改变它。
在这段代码中，我没有做任何更改，因为我想提供一个有效的代码

Answer 1

我想使用谷歌API调用init（）而不是onLoad，但是在必要的事件帮助

使用Google chart api：图表编辑器

1 个答案: