1
我正在使用google圖表API並使用圖表編輯器。我看到一些例子能夠將其添加到我的網頁中,但是,數據url是一種硬編碼,我希望用戶給出數據url,我嘗試了一些東西,但似乎沒有任何工作。使用Google chart api:圖表編輯器
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 Script代碼
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)調用;
有反正我可以改變它。
在這段代碼,因爲我想給一個工作代碼