Chart.js loads data when i resize window

Question

My chart isnt refreshing when i click search. My chart works and shows the data only when i search and resize the window. I tried moving my chart function inside my search function but it gives me an error. Is there another approach to this? my code is:

$(`#stock-search`).click(function(){
  var searchValue = $('#stock-name').val();
  $.getJSON(`https://sandbox.iexapis.com/stable/stock/${searchValue}/chart/1m?token=demo`,
    function(data){
    console.log(data);

    for (x = 0; x < 22; x++){
      const time = data[`${x}`].label;
      xlabel.push(time);

      const value = data[`${x}`].high;
      ydata.push(value);

      console.log(value);
      console.log(time);
    }
  });
});

const ctx = document.getElementById('myChart').getContext('2d');
const xlabel= [];
const ydata= [];
const myChart = new Chart(ctx, {
    type: 'line',
    data: {
        labels: xlabel,
        datasets: [{
            label: "Highs of the month",
            data: ydata,
            borderWidth: 1
        }]
    },
    options: {
      scales: {
          yAxes: [{
              ticks: {
                  callback: function(value, index, values) {
                      return '$' + value;
                  }
              }
          }]
      }
  }
});

is it possible to share a codepen for this? – Manit Apr 01 '20 at 19:06 — Manit, Apr 01 '20 at 19:06

score 0 · Answer 1 · answered Apr 01 '20 at 21:27

0

You may want to look at this Question though while a bit dated does seems to provide numerous ways to accomplish your goal: chart.js load totally new data

answered Apr 01 '20 at 21:27

Lynyrd

76
6

Ill give it a look, Thanks – Vurtle Apr 02 '20 at 05:18

Chart.js loads data when i resize window

1 Answers1