János
János

Reputation: 35050

Where does 'generateData' comes in ApexChart documentation?

I would use HeatMap chart from ApexChart. https://apexcharts.com/docs/installation/

They are using generateData method to demonstrate the data structure ApexChart requires. But what kind of data generateData produce? :)

      class ApexChart extends React.Component {
        constructor(props) {
          super(props);

          this.state = {
          
            series: [{
                name: 'Jan',
                data: generateData(20, {
                  min: -30,
                  max: 55
                })
              },

Upvotes: 0

Views: 1858

Answers (2)

Craicerjack
Craicerjack

Reputation: 6332

So it seems the generateData() function is a function created for the examples.
See this issue here - https://github.com/apexcharts/apexcharts.js/issues/1363
which leads to the code for the example here - https://github.com/apexcharts/apexcharts.js/blob/main/samples/react/bubble/simple-bubble.html

where the function is defined

/*
  // this function will generate output in this format
  // every array in data is of the format [x, y, z] where x (timestamp) and y are the two axes coordinates,
  // z is the third coordinate, which you can interpret as the size of the bubble formed too.
  // data = [
     [timestamp, 23, 10],
     [timestamp, 33, 11],
     [timestamp, 12, 8]
      ...
  ]
  */
  function generateData(baseval, count, yrange) {
    var i = 0;
    var series = [];
    while (i < count) {
      var x = Math.floor(Math.random() * (750 - 1 + 1)) + 1;;
      var y = Math.floor(Math.random() * (yrange.max - yrange.min + 1)) + yrange.min;
      var z = Math.floor(Math.random() * (75 - 15 + 1)) + 15;
  
      series.push([x, y, z]);
      baseval += 86400000;
      i++;
    }
    return series;
  }

Upvotes: 0

Cyberpunk7711
Cyberpunk7711

Reputation: 119

Use this:

function generateData(count, yrange) {
var i = 0;
var series = [];
while (i < count) {
  var x = (i + 1).toString();
  var y =
  Math.floor(Math.random() * (yrange.max - yrange.min + 1)) + yrange.min;

  series.push({
    x: x,
    y: y
  });
  i++;
}
return series;
}

Upvotes: 3

Related Questions