1

我正在使用谷歌图表 API 并在其中使用图表编辑器。我看到很少有示例能够将其添加到我的网页中，但是，数据 url 是硬编码的，我希望用户提供数据 url，我尝试了一些方法，但似乎都不起作用。

HTML 代码片段

<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(); 设置
但看起来init函数在页面加载时由google.setOnLoadCallback（init）调用；
无论如何我可以改变它。
在此代码中，我没有进行任何更改，因为我想提供一个工作代码

4

1 回答 1

0

我猜想调用 init() 不是 onLoad 使用谷歌 API，而是在一个必需的事件上有所帮助

于 2012-10-17T08:35:48.610 回答