Chart.js unable to create chart

Question

I'm trying to create a simple bar chart using Chart.js, but every time I try to render it, it give me the following error: Failed to create chart: can't acquire context from the given item.

  var hashtags = ["activewear", "adidas", "aloyoga", "batterseapark", "outdoors", "park", "training", "winter", "workout", "workoutwednesday"]
var avg_likes = [1185, 5311, 5521, 1713, 949, 321, 2860, 2661, 18899, 8108]

var chart = document.getElementById("chart");
var myBarChart = new Chart(chart, {
  type: 'bar',
  data: {
    labels: hashtags,
    datasets: [{
      data: avg_likes
    }]
  },
  options: {}
});

    <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.min.js"></script>

<div id="chart"></div>

Aniko Litvanyi · Accepted Answer · 2018-05-03 11:00:49Z

1

You have to add a canvas element as the base of the chart. Change the html to:

<div class="chart-container">
   <canvas id="chart"></canvas>
</div>

answered May 3, 2018 at 11:00

Aniko Litvanyi

2,1591 gold badge24 silver badges25 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

PPL · Accepted Answer · 2018-05-03 11:10:14Z

1

Instead of div please use canvas like below.

<canvas id="chart"></canvas>

answered May 3, 2018 at 11:10

PPL

6,5551 gold badge13 silver badges32 bronze badges

Collectives™ on Stack Overflow

Chart.js unable to create chart

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related