I can't use the Java code to replicate your chart, I need to see what the
javascript looks like when sent to the browser (open the page in a browser,
view source, and paste the javascript here).
As far as the JSON goes, is that the whole string? If so, you are missing
quite a lot of information that needs to be present for the JSON to work.
On Wednesday, May 29, 2013 5:43:29 AM UTC-4, Amit Sharma wrote:
>
> One more thing: I think my JSON string from Ajax response is not supported
> to the chart. Here is my response Json String
> :
> {"c":[{"v":"Date(2013,3,27,5,38)","f":"Sat 04/27/2013
> 00:38"},{"v":1200.0},{"v":1001.0},{"v":0.0},{"v":0.0},{"v":-199.0},{"v":0.0}]},
> {"c":[{"v":"Date(2013,3,28,5,38)","f":"Sun 04/28/2013
> 00:38"},{"v":1001.0},{"v":1100.0},{"v":0.0},{"v":0.0},{"v":99.0},{"v":0.0}]},
> {"c":[{"v":"Date(2013,3,29,5,38)","f":"Mon 04/29/2013
> 00:38"},{"v":1100.0},{"v":1700.0},{"v":0.0},{"v":0.0},{"v":600.0},{"v":0.0}]},
> {"c":[{"v":"Date(2013,3,30,5,38)","f":"Tue 04/30/2013
> 00:38"},{"v":1700.0},{"v":1500.0},{"v":0.0},{"v":0.0},{"v":-200.0},{"v":0.0}]}]}
>
>
> Where first column is of *dataTime *and rest *number *type format.
>
>
> On Wed, May 29, 2013 at 1:25 PM, Amit <[email protected]
> <javascript:>>wrote:
>
>> Here is a sample code: But please update me all different cause of this
>> error
>>
>> =========
>> package com.Syner.client;
>>
>> import com.google.gwt.core.client.EntryPoint;
>> import com.google.gwt.core.client.JavaScriptObject;
>> import com.google.gwt.user.cellview.client.Column;
>> import com.google.gwt.user.client.Element;
>> import com.google.gwt.user.client.Window;
>> import com.google.gwt.user.client.ui.RootPanel;
>> import com.google.gwt.visualization.client.VisualizationUtils;
>> import com.google.gwt.visualization.client.visualizations.MotionChart;
>> import com.google.gwt.visualization.client.visualizations.Table;
>> import
>> com.google.gwt.visualization.client.visualizations.corechart.ColumnChart;
>> import
>> com.google.gwt.visualization.client.visualizations.corechart.PieChart;
>> import com.sencha.gxt.core.client.util.Margins;
>> import com.sencha.gxt.widget.core.client.ContentPanel;
>> import com.sencha.gxt.widget.core.client.container.BorderLayoutContainer;
>> import
>> com.sencha.gxt.widget.core.client.container.BorderLayoutContainer.BorderLayoutData;
>> import com.sencha.gxt.widget.core.client.container.SimpleContainer;
>>
>> public class PopUpGrid implements EntryPoint {
>>
>> private ContentPanel chartContainer;
>> private JavaScriptObject dashboard;
>> private JavaScriptObject control;
>> private JavaScriptObject chart;
>> private JavaScriptObject data;
>>
>> public void onModuleLoad() {
>> VisualizationUtils.loadVisualizationApi(new Runnable() {
>>
>> @Override
>> public void run() {
>> chartContainer = new ContentPanel();
>> chartContainer.setHeaderVisible(false);
>> chartContainer.setId("dashboard");
>> BorderLayoutContainer chartBorderPanel = new BorderLayoutContainer();
>> SimpleContainer chartPortion = new SimpleContainer();
>> chartPortion.setStyleName("chartBackground");
>> chartPortion.setId("chart");
>> SimpleContainer rangeControlPortion = new SimpleContainer();
>> rangeControlPortion.setId("control");
>> rangeControlPortion.setStyleName("chartBackground");
>> BorderLayoutData southData = new BorderLayoutData(50);
>> southData.setMargins(new Margins(0));
>> chartBorderPanel.setSouthWidget(rangeControlPortion, southData);
>> chartBorderPanel.setCenterWidget(chartPortion);
>> chartContainer.add(chartBorderPanel);
>> chart = getChart();
>> data = getData();// DataTable.create(getData());//getJSObject(getData())
>> if (control == null) {
>> control = getControl();
>> }
>> dashboard = getDashboard(chartContainer.getElement());
>> bindChartControl(dashboard, control, chart);
>> drawChart(dashboard, data);
>> RootPanel.get("charts").add(chartContainer);
>> }
>> },PieChart.PACKAGE, Table.PACKAGE,"controls");
>>
>> }
>> //----------------------------------
>> private native JavaScriptObject getDashboard(Element elem)/*-{
>> var dashboard = new $wnd.google.visualization.Dashboard(elem);
>> return dashboard;
>> }-*/;
>> //----------------------------------
>> private native void drawChart(JavaScriptObject dashboard,
>> JavaScriptObject data)/*-{
>> dashboard.draw(data);
>> }-*/;
>> //----------------------------------
>> private native void bindChartControl(JavaScriptObject dashboard,
>> JavaScriptObject control, JavaScriptObject chart)/*-{
>> dashboard.bind(control, chart);
>> }-*/;
>> //----------------------------------
>> private native JavaScriptObject getChart()/*-{
>> var chart = new $wnd.google.visualization.ChartWrapper({
>> chartType : 'ComboChart',
>> containerId : 'chart',
>> options : {
>> // Use the same chart area width as the control for axis alignment.
>> backgroundColor : 'transparent',
>> seriesType : "bars",
>> //'chartArea' : {
>> //'height' : '80%',
>> //'width' : '90%'
>> //},
>> tooltip : {
>> textStyle : {
>> fontName : 'Arial',
>> fontSize : 11,
>> color : '#909091'
>> }
>> },
>> hAxis : {
>> slantedText : false,
>> textStyle : {
>> fontName : 'Arial',
>> fontSize : 11
>> }
>> },
>> vAxes : {
>> textStyle : {
>> fontName : 'Arial',
>> fontSize : 11
>> },
>> 0 : {
>> title : 'Volume',
>> textStyle : {
>> fontName : 'Arial',
>> fontSize : 11
>> }
>> },
>> 1 : {
>> title : 'Variance',
>> textStyle : {
>> fontName : 'Arial',
>> fontSize : 11,
>> color : '#D9281E'
>> }
>> }
>> },
>> series : {
>> 0 : {
>> type : "bars",
>> targetAxisIndex : 0,
>> color : "#33CC66"
>> },
>> 1 : {
>> type : "bars",
>> targetAxisIndex : 0,
>> color : "#6E4C7A"
>> },
>> 2 : {
>> type : "bars",
>> targetAxisIndex : 0,
>> color : "#F0D330"
>> },
>> 3 : {
>> type : "bars",
>> targetAxisIndex : 0,
>> color : "#115FA6"
>> },
>> 4 : {
>> type : "line",
>> targetAxisIndex : 1,
>> color : "#D9281E"
>> },
>> 5 : {
>> type : "line",
>> targetAxisIndex : 0,
>> color : "#07ABAD"
>> }
>> },
>> legend : {
>> position : 'top'
>> }
>> },
>> // Convert the first column from 'date' to 'string'.
>> 'view' : {
>> 'columns' : [ {
>> 'calc' : function(dataTable, rowIndex) {
>> return dataTable.getFormattedValue(rowIndex, 0);
>> },
>> 'type' : 'string'
>> }, 1, 2, 3, 4, 5, 6 ]
>> }
>> });
>> return chart;
>> }-*/;
>> //-----------------------------------
>> private native JavaScriptObject getControl()/*-{
>> var control = new $wnd.google.visualization.ControlWrapper({
>> 'controlType' : 'ChartRangeFilter',
>> 'containerId' : 'control',
>> 'options' : {
>> // Filter by the date axis.
>> 'backgroundColor' : 'transparent',
>> 'filterColumnIndex' : 0,
>> 'ui' : {
>> 'chartType' : 'LineChart',
>> 'chartOptions' : {
>> //'chartArea' : {
>> //'width' : '90%'
>> //},
>> 'hAxis' : {
>> 'baselineColor' : 'none'
>> }
>> },
>> // Display a single series that shows the closing value of the stock.
>> // Thus, this view has two columns: the date (axis) and the stock value
>> (line series).
>> 'chartView' : {
>> 'columns' : [ 0, 3 ]
>> },
>> // 1 day in milliseconds = 24 * 60 * 60 * 1000 = 86,400,000
>> 'minRangeSize' : 86400000
>> }
>> },
>> // Initial range: 2012-02-09 to 2012-03-20.
>> // 'state' : {
>> // 'range' : {
>> // 'start' : new Date(2012, 1, 9),
>> // 'end' : new Date(2012, 2, 20)
>> // }
>> // }
>> });
>> return control;
>> }-*/;
>> //-------------------------------------------------------
>> private native JavaScriptObject getData()/*-{
>> var geoData = new $wnd.google.visualization.DataTable();
>> geoData.addColumn("string", "City");
>> geoData.addColumn("string", "Name");
>> geoData.addColumn("boolean", "Food");
>> geoData.addRows(3);
>> geoData.setCell(0, 0, "London");
>> geoData.setCell(1, 0, "Paris");
>> geoData.setCell(2, 0, "Moscow");
>> geoData.setCell(0, 1, "Cinematics London");
>> geoData.setCell(1, 1, "Cinematics Paris");
>> geoData.setCell(2, 1, "Cinematics Moscow");
>> geoData.setCell(0, 2, true);
>> geoData.setCell(1, 2, true);
>> geoData.setCell(2, 2, false);
>> return geoData;
>> }-*/;
>> //--------------------------------------------------------
>> private native JavaScriptObject getJSObject(String jsonStr)/*-{
>> var myObject = JSON.parse(jsonStr);
>> return myObject;
>> }-*/;
>>
>>
>>
>> On Wed, May 29, 2013 at 1:12 PM, Amit <[email protected]
>> <javascript:>>wrote:
>>
>>> Hi ,I cant' provide any link.But can you plz help me to understand the
>>> error scenario .What are the possible reasons for such errors???
>>>
>>>
>>> On Tue, May 28, 2013 at 7:56 PM, asgallant
>>> <[email protected]<javascript:>
>>> > wrote:
>>>
>>>> If you can post a link to the page so I can test this out, I'll take a
>>>> look and see what might be the problem.
>>>>
>>>>
>>>> On Tuesday, May 28, 2013 10:10:00 AM UTC-4, Amit Sharma wrote:
>>>>>
>>>>> Hi ,
>>>>> I am creating a chart from Google visualization library. Populating
>>>>> chart from JSON.
>>>>> Everything works fine except when I am populating chart data table
>>>>> using reverse ajax.Its showing updated JSON string to my DataTable but
>>>>> not
>>>>> refresh the chart and
>>>>> it shows the error "One or more Participants failed to draw(); " on
>>>>> the chart. If I manually refresh chart on click of refresh button it
>>>>> update
>>>>> the chart with no error.How can I dynamically refresh this chart.
>>>>> 1. I tried refreshing ChartWrapper instead of refreshing Dashboard
>>>>> every time.
>>>>> 2. I checked the data type its datetime and number only.
>>>>>
>>>>> what could be the possible reason for this error message ?
>>>>>
>>>>> Problem for me is I have updated data table after reverse ajax which
>>>>> not refreshing chart dynamically and I have to do that manually.Quick
>>>>> response will be helpful.
>>>>>
>>>> --
>>>> You received this message because you are subscribed to a topic in the
>>>> Google Groups "Google Visualization API" group.
>>>> To unsubscribe from this topic, visit
>>>> https://groups.google.com/d/topic/google-visualization-api/g9qmlvBqkIo/unsubscribe?hl=en
>>>> .
>>>> To unsubscribe from this group and all its topics, send an email to
>>>> [email protected] <javascript:>.
>>>> To post to this group, send email to
>>>> [email protected]<javascript:>
>>>> .
>>>> Visit this group at
>>>> http://groups.google.com/group/google-visualization-api?hl=en.
>>>> For more options, visit https://groups.google.com/groups/opt_out.
>>>>
>>>>
>>>>
>>>
>>>
>>
>
--
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
http://groups.google.com/group/google-visualization-api?hl=en.
For more options, visit https://groups.google.com/groups/opt_out.
