JSFiddle - React, Tailwind, and code Playground

by askhflajsf

HTML

<script src="https://rawgit.com/chartjs/chartjs.github.io/master/dist/master/Chart.bundle.min.js"></script>
<h1>Both charts share legend options in `var sharedOptions`. But in the 2nd chart, how do I disable the legend with `legend: { display: false }`?</h1>
<canvas id="bar-chart"></canvas>
<canvas id="bar-chart2"></canvas>

JavaScript

var barChartData = {
  labels: [1366988002, 1368726000, 1376388258, 1377061229, 1378192264],
  datasets: [{
    borderColor: "#3e95cd",
    data: [3.7, 2.1874, 5, 0.1722, 15.5192]
  }]
};

var myOptions = {
    responsive: true,
    legend: {
      display: true,
      position: "right"
    },
    title: {
      display: false
    },
    scales: {
      xAxes: [{
        type: "time"
      }]
    }
  }

var ctx = document.getElementById("bar-chart").getContext("2d");
new Chart(ctx, {
  type: 'line',
  data: barChartData,
  options: myOptions
});

var ctx = document.getElementById("bar-chart2").getContext("2d");
new Chart(ctx, {
  type: 'line',
  data: barChartData,
  options: myOptions
});