Line Graph - Want to add vertical line at the 0 position

[Shailendra S. Sengar]

Hi,

I want to add vertical line as shown in the attached image.
I googled a lot but could not get the solution, please help.

Thanks,
Shailendra

[Shailendra S. Sengar]

Draw Function:

function drawChart() {
    var jsonData = $.ajax({
        url: "getData_json.php",
        dataType:"json",
        async: false
    }).responseText;
    // Create our data table out of JSON data loaded from server.
    var data = new google.visualization.DataTable(jsonData);
    var options = {
        width:         800,
        height:     480,
        hAxis:         {title: 'Time Remaining (year, month)', titleTextStyle: {italic: false}},
        vAxis:      {title: 'Amount outstanding', titleTextStyle: {italic: false}, ticks: [0,50,100,150,200,250], gridlines: {color: 'transparent'}}
    };
    var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
    chart.draw(data, options);
}

JSON:

{
    "cols": [       
        {"label":"year","type":"string"},
        {"label":"Current Mortgage","type":"number"},
        {"label":"year","type":"string", "role":"tooltip"},
        {"label":"With Overpayments","type":"number"},
        {"label":"year","type":"string", "role":"tooltip"}
    ],
    "rows": [       
        {"c":[{"v":"5"},{"v":250},{"v":"$800K in our first year!"},{"v":250},{"v":"$600K in our first year!"}]},
        {"c":[{"v":"10"},{"v":200},{"v":"$800K in our first year!"},{"v":230},{"v":"$600K in our first year!"}]},
        {"c":[{"v":"15"},{"v":150},{"v":"$800K in our first year!"},{"v":180},{"v":"$600K in our first year!"}]},
        {"c":[{"v":"20"},{"v":100},{"v":"$800K in our first year!"},{"v":130},{"v":"$600K in our first year!"}]},
        {"c":[{"v":"25"},{"v":0},{"v":"$800K in our first year!"},{"v":100},{"v":"$600K in our first year!"}]},
        {"c":[{"v":"30"},{"v":"undefined"},{"v":"$800K in our first year!"},{"v":0},{"v":"$600K in our first year!"}]}
    ]

[Daniel LaLiberte]

Hi Shailendra,

The reason you see no vertical gridlines, which are for the horizontal axis, is that the type of your first column of data used for the horizontal axis is 'string'.  You'll have to convert those strings back to numbers, and then, if you want to hide all the gridlines except for the baseline, you can do something like what you did for the vertical axis and make the gridlines color be transparent.  Hope that helps.

--
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 google-visualizati...@googlegroups.com.
To post to this group, send email to google-visua...@googlegroups.com.
Visit this group at http://groups.google.com/group/google-visualization-api.
For more options, visit https://groups.google.com/groups/opt_out.

--

Daniel LaLiberte  - 978-394-1058

dlaliberte@Google.com   5CC, Cambridge MA

daniel.laliberte@GMail.com 9 Juniper Ridge Road, Acton MA

[Shailendra Singh]

Hi Daniel,

Thank you very much for your help. Its working.

You Rocks!.

Thanks,

Shailendra

--
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/zhsuODMvamE/unsubscribe.
To unsubscribe from this group and all its topics, send an email to google-visualizati...@googlegroups.com.

To post to this group, send email to google-visua...@googlegroups.com.
Visit this group at http://groups.google.com/group/google-visualization-api.
For more options, visit https://groups.google.com/groups/opt_out.

--
Best Regards,
Shailendra Singh