I found the solution...! I used google chrome with the inspection mode. The
two first functions was not used correcty... here is the solution:
google.charts.load('visualization', '1', {packages: ['controls',
'charteditor']});
google.charts.setOnLoadCallback(drawChart);
The "charts" was missing...!
I hope this will be useful for somebody!
Thanks!
Le vendredi 3 mars 2017 10:27:56 UTC+1, g-trema a écrit :
>
> 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/22498b05-4cc2-4d1b-8aed-a1ea4a355476%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
