Sign Up

Have an account? Sign In Now

Sign In

Forgot Password?

Don't have account, Sign Up Here

Forgot Password

Lost your password? Please enter your email address. You will receive a link and will create a new password via email.

Have an account? Sign In Now

You must login to ask question.

Forgot Password?

Need An Account, Sign Up Here

You must login to add post.

Forgot Password?

Need An Account, Sign Up Here

Please briefly explain why you feel this question should be reported.

Please briefly explain why you feel this answer should be reported.

Passionable Logo Passionable Logo
Sign InSign Up

Passionable

Passionable Navigation

  • Home
  • About Us
  • Blog
  • Contact Us
Search
Ask A Question

Mobile menu

Close
Ask a Question
  • Home
  • Add group
  • Groups page
  • Feed
  • User Profile
  • Communities
  • Questions
  • Polls
  • Tags
  • Badges
  • Buy Points
  • Users
  • Help
  • New Questions
  • Trending Questions
  • Must read Questions
  • Hot Questions
Home/ Questions/Q 8985
In Process
Alek Richter
  • 0
Alek RichterEnlightened
Asked: January 11, 20222022-01-11T10:37:50+00:00 2022-01-11T10:37:50+00:00

how to set start value as “0” in chartjs?

  • 0

here is my code. i need to set initial value as “0” in both x and y axis scales. I have tried latest version scales option.

graphOptions = {               
            ///Boolean - Whether grid lines are shown across the chart
            scaleShowGridLines: false,    
            tooltipTitleTemplate: "<%= label%>",
            //String - Colour of the grid lines
            scaleGridLineColor: "rgba(0,0,0,.05)",
            //Number - Width of the grid lines
            scaleGridLineWidth: 1,
            //Boolean - Whether to show horizontal lines (except X axis)
            scaleShowHorizontalLines: true,
            //Boolean - Whether to show vertical lines (except Y axis)
            scaleShowVerticalLines: true,
            //Boolean - Whether the line is curved between points
            bezierCurve: true,
            //Number - Tension of the bezier curve between points
            bezierCurveTension: 0.4,
            //Boolean - Whether to show a dot for each point
            pointDot: true,
            //Number - Radius of each point dot in pixels
            pointDotRadius: 4,
            //Number - Pixel width of point dot stroke
            pointDotStrokeWidth: 1,               
            pointHitDetectionRadius: 20,               
            datasetStroke: true,
            datasetStrokeWidth: 2,
            datasetFill: true,               
            legendTemplate: "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<datasets.length; i++){%><li><span style=\"background-color:<%=datasets[i].strokeColor%>\"></span><%if(datasets[i].label){%><%=datasets[i].label%><%}%></li><%}%></ul>"
        };
        var LineChart = new Chart(ctx).Line(graphData, graphOptions);
   }     
  • 1 1 Answer
  • 3 Views
  • 0 Followers
  • 0
    • Report
  • Share
    Share
    • Share on Facebook
    • Share on Twitter
    • Share on LinkedIn
    • Share on WhatsApp

1 Answer

  • Voted
  • Oldest
  • Recent
  • Random
  1. Alek Richter Enlightened
    2022-01-11T10:38:07+00:00Added an answer on January 11, 2022 at 10:38 am

    For Chart.js 2.*, the option for the scale to begin at zero is listed under the configuration options of the linear scale. This is used for numerical data, which should most probably be the case for your y-axis. So, you need to use this:

    options: {
    scales: {
    yAxes: [{
    ticks: {
    beginAtZero: true
    }
    }]
    }
    }

    A sample line chart is also available here where the option is used for the y-axis. If your numerical data is on the x-axis, use xAxes instead of yAxes. Note that an array (and plural) is used for yAxes (or xAxes), because you may as well have multiple axes.

    • 0
    • Reply
    • Share
      Share
      • Share on Facebook
      • Share on Twitter
      • Share on LinkedIn
      • Share on WhatsApp
      • Report
Leave an answer

Leave an answer
Cancel reply

Browse

Sidebar

Ask A Question

Stats

  • Questions 4k
  • Answers 4k
  • Best Answers 0
  • Users 3
  • Popular
  • Answers
  • Alek Richter

    How do I update/upgrade pip itself from inside my virtual ...

    • 2 Answers
  • Alek Richter

    Truth value of a Series is ambiguous. Use a.empty, a.bool(), ...

    • 2 Answers
  • Alek Richter

    What is a NullPointerException, and how do I fix it?

    • 2 Answers
  • Alek Richter
    Alek Richter added an answer Pandas DataFrame columns are Pandas Series when you pull them… January 13, 2022 at 2:21 pm
  • Alek Richter
    Alek Richter added an answer The handshake failure could have occurred due to various reasons:… January 13, 2022 at 2:19 pm
  • Alek Richter
    Alek Richter added an answer Mac OS X doesn't have apt-get. There is a package… January 13, 2022 at 2:18 pm

Top Members

Alek Richter

Alek Richter

  • 4k Questions
  • 1k Points
Enlightened
coinbaseprosupportnumber[Xsdwerfgtyujhnbgfderewqasdxz]

coinbaseprosupportnumber[Xsdwerfgtyujhnbgfderewqasdxz]

  • 2 Questions
  • 2 Points

Trending Tags

questin question

Explore

  • Home
  • Add group
  • Groups page
  • Communities
  • Questions
  • Polls
  • Tags
  • Badges
  • Users
  • Help
  • New Questions
  • Trending Questions
  • Must read Questions
  • Hot Questions

© 2021 Passionable. All Rights Reserved

Insert/edit link

Enter the destination URL

Or link to existing content

    No search term specified. Showing recent items. Search or use up and down arrow keys to select an item.