Hopefully a simple question that someone can answer. I'm trying to create a google charts graph that takes the 2-column results of a SQL server query and plots them on an X-Y axis.
The first column (the x values on my graph) are dates that are in the following format: 4/5/2014 12:00:00 AM and the second column (the y values) are a standard float. I convert these results into a json-formatted string required for google charts with the following asp.net parser:
DataTable dt = new DataTable();
{
conn.Open();
using (SqlDataAdapter adapter = new SqlDataAdapter("select game_date, fb_avg_velo, cb_avg_velo, ch_avg_velo, sl_avg_velo, oth_avg_velo from pitching_speed where player_code = 'bjones' order by game_date asc", conn))
{
adapter.Fill(dt);
List<string> rowsList = new List<string>();
foreach (DataRow row in dt.Rows)
{
rowsList.Add("[" + row["game_date"] + ", " + row["fb_avg_velo"] + "]");
}
rows = String.Join(", ", rowsList);
}
}
I then use the following javascript function to populate a datatable to create my graph:
function drawChart() {
var data1 = new google.visualization.DataTable()
data1.addColumn('date', 'Date');
data1.addColumn('number', 'Velocity');
data1.addRows([@Html.Raw(rows)]);
var chart = new google.visualization.ScatterChart(document.getElementById('chart_div'));
chart.draw(data1, {
title: 'Fast Ball Speed by Date',
});
The issue is I don't think google charts recognizes my date format so the graph doesn't render. I know there is a Date() function in javascript but I don't know how to implement it in this case.
