Click here to Skip to main content
15,881,864 members
Please Sign up or sign in to vote.
1.00/5 (1 vote)
I want to change the color of my line chart.I should I do it? Please help.


C#
namespace OrthopedicSystem
{
    public partial class WebForm5 : System.Web.UI.Page
    {
        StringBuilder str = new StringBuilder();
        SqlConnection conn = new SqlConnection("Data Source=lakshi;Initial Catalog=orthopedics;Integrated Security=True");
        protected void Page_Load(object sender, EventArgs e)
        {
            if(!IsPostBack)
            {
                chart_bind();
            }
        }
        private DataTable GetData()
        {
            DataTable dt = new DataTable();
            conn.Open();
            string cmd = "Select * from score";
            SqlDataAdapter adp = new SqlDataAdapter(cmd, conn);
            adp.Fill(dt);
            conn.Close();
            return dt;
        }
        private void chart_bind()
        {
            DataTable dt = new DataTable();
            try
            {
                dt = GetData();

                str.Append(@"<script type=*text/javascript*> google.load( *visualization*, *1*, {packages:[*corechart*]}); 
google.setOnLoadCallback(drawChart);
            function drawChart() {
            var data = new google.visualization.DataTable();
            data.addColumn('string', 'Year');
            data.addColumn('number', 'score');
         
 
            data.addRows(" + dt.Rows.Count + ");");
 
            for (int i = 0; i <= dt.Rows.Count - 1; i++)
            {
                str.Append("data.setValue( " + i + "," + 0 + "," + "'" + dt.Rows[i]["visit_date"].ToString() + "');");
                str.Append("data.setValue(" + i + "," + 1 + "," + dt.Rows[i]["score"].ToString() + ") ;");
            }
           
            str.Append("   var chart = new google.visualization.LineChart(document.getElementById('chart_div'));");           
            str.Append(" chart.draw(data, {width: 660, height: 300, title: 'Company Performance',");           
            str.Append("hAxis: {title: 'Year', titleTextStyle: {color: 'green'}}");
            str.Append("}); }");
            str.Append("</script>");
            lt.Text = str.ToString().Replace('*', '"');   

            }
            catch { }
        }
    }
}
Posted
Updated 12-Nov-15 1:59am
v2

You need to set the series with the colors & values specifying in it.
JavaScript
var options = {
          legend: 'none',
          series: {
            0: { color: '#e2431e' },
            1: { color: '#e7711b' },
          }
        };

And provide this options for chart like yourChart.draw(yourData, options).
Read the Google documentation: Customizing Lines[^]

-KR
 
Share this answer
 
Comments
uglsa 13-Nov-15 10:27am    
Thank you so much :) . I have a doubt where to use 'options'.Now its clear.
Krunal Rohit 13-Nov-15 10:29am    
Glad I could help.

-KR
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900