Updated code snippet... Attached is the output. Many thanks for continued support.
tdata.addColumn('string', data[0][0]);
for (var i = 0; i < cols; i++)
{
tdata.addColumn('number', data[0][i]);
}
tdata.addRows(data.length);
for (var i = 1; i < data.length; i++)
{
tdata.setCell(i, 0, data[i][0]);
for (var j = 1; j < cols; j++) {
var value = parseInt(data[i][j]);
tdata.setCell(i, j, value);
}
}
On Monday, July 16, 2012 4:04:56 PM UTC-4, asgallant wrote:
>
> I'm not familiar with MVC either, but I can hazard a guess that the
> problem might lie with the loop to set the columns:
>
> var cols = data[0].length;
>
> tdata.addColumn('string', data[0][0]);
> for (var i = 0; i < cols; i++)
> {
> tdata.addColumn('number', data[0][i]);
> }
>
> You end up adding the 'month' column twice, the first time as type
> 'string' and the second time as type 'number'. This would cause a mismatch
> between number of columns in the DataTable and the number of columns you
> feed the DataTable. Start i at 1 instead of 0 to fix.
>
> On Monday, July 16, 2012 12:09:28 PM UTC-4, Yuval Ronen wrote:
>>
>> And what do you actually see?
>> Can you post a simple page that demonstrates the problem? I have no
>> experience with MVC, so if it's a problem with MVC configuration, I can't
>> really help. If you can reproduce the problem using the javascript API,
>> we'll be happy to help.
>>
>> On Mon, Jul 16, 2012 at 6:37 PM, DRAY <[email protected]> wrote:
>>
>>> I expected to see a set of the following given that I am using a set of
>>> its data.
>>>
>>>
>>> https://code.google.com/apis/ajax/playground/?type=visualization#area_chart
>>>
>>>
>>> On Monday, July 16, 2012 7:52:16 AM UTC-4, Yuval Ronen wrote:
>>>>
>>>> What's the outcome of this code, and how is it different from what you
>>>> expect?
>>>>
>>>> On Sat, Jul 14, 2012 at 10:34 PM, DRAY <[email protected]>wrote:
>>>>
>>>>> I've been using Google Drive to store a lot of data in in Google
>>>>> Spreadsheets so that I can quickly build graphs and such. Piece of cake.
>>>>> Now, I want to move that data to a database and build a little MVC 4 web
>>>>> app to serve that data. Piece of cake. Adding Google Charts was also a
>>>>> piece of cake until I tried to use the AreaChart. Not sure if I have the
>>>>> data in the right format or what, but I am stumped and need some help.
>>>>> Here
>>>>> is my code. Perhaps I'm making it too difficult on myself and there's an
>>>>> easier way. Many thanks.
>>>>>
>>>>> *ChartController method*
>>>>> public JsonResult GetAreaChartData()
>>>>> {
>>>>> List<string[]> data = new List<string[]>();
>>>>> data.Add(new[] { "Month", "Bolivia", "Ecuador", "Madagascar",
>>>>> "Papua New Guinea", "Rwanda" });
>>>>> data.Add(new[] { "2004/05", "165", "938", "522", "998", "450" });
>>>>> data.Add(new[] { "2005/06", "135", "1120", "599", "1268", "288" });
>>>>>
>>>>> return Json(data);
>>>>> }
>>>>>
>>>>> *Chart.cshtml*
>>>>> <script type="text/javascript" src="/Scripts/jquery-1.5.1.**
>>>>> min.js"></script>
>>>>> <script type="text/javascript"
>>>>> src="https://www.google.com/**jsapi<https://www.google.com/jsapi>"></script>
>>>>> <script type="text/javascript">// <![CDATA[
>>>>> google.load("visualization", "1", { packages: ["corechart"] });
>>>>> google.setOnLoadCallback(**drawChart);
>>>>>
>>>>> function drawChart() {
>>>>>
>>>>> $.post('/ChartController/**GetAreaChartData', {},
>>>>> function (data) {
>>>>> var tdata = new google.visualization.**DataTable();
>>>>> var rows = data.length;
>>>>> var cols = data[0].length;
>>>>>
>>>>>
>>>>> tdata.addColumn('string', data[0][0]);
>>>>> for (var i = 0; i < cols; i++)
>>>>> {
>>>>> tdata.addColumn('number', data[0][i]);
>>>>> }
>>>>>
>>>>> tdata.addRows(data.length);
>>>>> for (var i = 1; i < data.length; i++)
>>>>> {
>>>>> tdata.setCell(i, 0, data[i][0]);
>>>>> for (var j = 1; j < cols; j++) {
>>>>> var value = parseInt(data[i][j]);
>>>>> alert(value);
>>>>> // Fails ???
>>>>> tdata.setCell(i, j, data[i][j]);
>>>>> }
>>>>> }
>>>>>
>>>>> var options = {
>>>>> title: 'Some Text',
>>>>> isStacked: true,
>>>>> width: 900,
>>>>> height: 500,
>>>>> vAxis: {title: "More Text"},
>>>>> hAxis: {title: "Date"}
>>>>> };
>>>>> var chart = new google.visualization.**AreaChart(document.**
>>>>> getElementById('chart_div'));
>>>>> chart.draw(tdata, options);
>>>>> });
>>>>>
>>>>> }
>>>>> // ]]></script>
>>>>>
>>>>> <div id="chart_div" style="width: 900px; height: 500px;"></div>
>>>>>
>>>>> --
>>>>> You received this message because you are subscribed to the Google
>>>>> Groups "Google Visualization API" group.
>>>>> To view this discussion on the web visit https://groups.google.com/d/*
>>>>> *msg/google-visualization-api/-**/XPIZRTkD3rUJ<https://groups.google.com/d/msg/google-visualization-api/-/XPIZRTkD3rUJ>
>>>>> .
>>>>> To post to this group, send email to google-visualization-api@**
>>>>> googlegroups.com <[email protected]>.
>>>>> To unsubscribe from this group, send email to
>>>>> google-visualization-api+**[email protected]<google-visualization-api%[email protected]>
>>>>> .
>>>>> For more options, visit this group at http://groups.google.com/**
>>>>> group/google-visualization-**api?hl=en<http://groups.google.com/group/google-visualization-api?hl=en>
>>>>> .
>>>>>
>>>>
>>>> --
>>> You received this message because you are subscribed to the Google
>>> Groups "Google Visualization API" group.
>>> To view this discussion on the web visit
>>> https://groups.google.com/d/msg/google-visualization-api/-/NbyOx5Ntj90J.
>>> To post to this group, send email to
>>> [email protected].
>>> To unsubscribe from this group, send email to
>>> [email protected].
>>> For more options, visit this group at
>>> http://groups.google.com/group/google-visualization-api?hl=en.
>>>
>>
>>
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To view this discussion on the web visit
https://groups.google.com/d/msg/google-visualization-api/-/GNbmpJufxPgJ.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/google-visualization-api?hl=en.
<<attachment: chart.png>>
