Passing values to Javascript from code behind asp.net using Webmethod

Question

I'm trying to add values queried from a DB into a google charts bar chart. After googling around, I tried by making a web method.

First I made a class:

public class ChartDetails
{
    public string value_type { get; set; }
    public float threshold { get; set; }
}

Then the web method (not connected to DB yet)

[WebMethod]
    public static List<ChartDetails> GetChartData()
    {
        List<ChartDetails> dataList = new List<ChartDetails>();
        ChartDetails c1 = new ChartDetails();
        c1.threshold = 56;
        c1.value_type = "Observed";
        ChartDetails c2 = new ChartDetails();
        c2.threshold = 33;
        c2.value_type = "Forecast";

        dataList.Add(c1);
        dataList.Add(c2);
        return dataList;
    }

My script is added in the same form tag as the div with id="chartdiv":

script type="text/javascript">  
    $(function () {  
        $.ajax({  
            type: 'POST',  
            dataType: 'json',  
            contentType: 'application/json',  
            url: 'Page.aspx/GetChartData',  
            data: '{}',  
            success: function (response) {  
                drawchart(response.d); // calling method  
            },  

            error: function () {  
                alert("Error loading data! Please try again.");  
            }  
        });  
    })  

    function drawchart(dataValues) {    
        var data = new google.visualization.DataTable();  

        data.addColumn('string', 'Type of value'); 
        data.addColumn('float', 'Value');

        for (var i = 0; i < dataValues.length; i++)   
        {  
            data.addRow([dataValues[i].value_type, dataValues[i].threshold] );  
        }  

       var chart =  new google.visualization.ColumnChart(document.getElementById('chartdiv'));  

   chart.draw(data,  
     {  
         title: "Show Google Chart in Asp.net",  
         position: "top",  
         fontsize: "14px",  
         chartArea: { width: '50%' },  
     });  
    }  
</script>

When I run the page it doesn't even load it. As if the web method is not called at all. Clearly I'm missing something that I can't identify. I've also seen solutions of this type so I'll be trying that next. But it would be nice to figure out why this isn't working out yet.