Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.bundle.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.js"></script>
<body>  
  <div>
    <canvas id="chart" width="800" height="450"></canvas>
  </div>
</body>
</html>
 
let data = {
  labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
  datasets: [{
    label: 'My First dataset',
    data: [0, 10, 5, 2, 10, 15, 5],
    pointBorderWidth: 2
  }]
}
​
options = {
  scales: {
    xAxes: [{
      gridLines: {
        display:false
      }
    }],
    yAxes: [{
      id: 'A',
      position: 'left',
      gridLines: {
        zeroLineColor:'#131c2b'
      }
    },
    {
      id: 'B',
      position: 'right',
      gridLines: {
        zeroLineColor:'#131c2b'
      }   
    }]
  }
}
​
let chart = new Chart(document.getElementById("chart"), {
  type: 'line',
  data: data,  
  options: options
})
​
function updateOptions() {
  chart.options.scales.yAxes[1].ticks = {
    min: chart.scales.A.ticksAsNumbers[chart.scales.A.ticksAsNumbers.length-1],
    max: chart.scales.A.ticksAsNumbers[0]
  }
  chart.update()
}
​
updateOptions()
​
​
​
​
​
​
​
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers