Hello,
I try to use the ControlWrapper. For now nothing is displayed.
How do you do to debug a chart and to understand where's the problem coming
from?
By the way, here's the code, maybe the problem is easy to find for you!?
<script type="text/javascript">
google.load('visualization', '1', {packages: ['controls', 'charteditor']});
google.setOnLoadCallback(drawChart);
function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('number', 'X');
data.addColumn('number', 'axeX');
data.addColumn('number', 'axeY');
data.addColumn('number', 'axeZ');
data.addRows([
[0,0.649,8.423,-0.134],
[5,0.548,7.564,-0.092],
[10,0.51,6.779,-0.111],
[15,0.515,6.123,-0.085],
[20,0.446,5.539,-0.124],
[25,0.414,5.004,-0.122],
[30,0.431,4.493,-0.211],
[35,0.422,4.08,-0.216],
[40,0.376,3.635,-0.194],
[45,0.321,3.246,-0.201],
[50,0.319,2.956,-0.217],
[55,0.293,2.656,-0.219],
[60,0.238,2.379,-0.212],
[65,0.21,2.139,-0.195],
[70,0.167,1.921,-0.251],
[75,0.123,1.714,-0.206]
]);
var dash = new
google.visualization.Dashboard(document.getElementById('dashboard0'));
var control = new google.visualization.ControlWrapper({
controlType: 'ChartRangeFilter',
containerId: 'control_div0',
options: {
filterColumnIndex: 0,
ui: {
chartOptions: {
height: 50,
width: 600,
chartArea: {
width: '80%'
}
},
chartView: {
columns: [0, 1]
}
}
}
});
var chart = new google.visualization.ChartWrapper({
chartType: 'LineChart',
containerId: 'chart_div0'
});
function setOptions (wrapper) {
// sets the options on the chart wrapper so that it draws correctly
wrapper.setOption('height', 400);
wrapper.setOption('width', 600);
wrapper.setOption('chartArea.width', '80%');
// the chart editor automatically enables animations, which doesn't look
right with the ChartRangeFilter
wrapper.setOption('animation.duration', 0);
}
setOptions(chart);
document.getElementById('edit0').onclick = function () {
var editor = new google.visualization.ChartEditor();
google.visualization.events.addListener(editor, 'ok', function () {
chart = editor.getChartWrapper();
setOptions(chart);
dash.bind([control], [chart]);
dash.draw(data);
});
editor.openDialog(chart);
};
dash.bind([control], [chart]);
dash.draw(data);
}
</script>
<input type="button" id="edit0" value="Edit Chart" />
<div id="dashboard0">
<div id="chart_div0" style="height:500px"></div>
<div id="control_div0"></div>
</div>
Thank you very much!
G.
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit
https://groups.google.com/d/msgid/google-visualization-api/f31a6ae5-4ec6-42f7-8519-328d02852a8c%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
