Log Scale

Log Scale - 图1

Randomize

config setup actions

  1. const config = {
  2.   type: 'line',
  3.   data: data,
  4.   options: {
  5.     responsive: true,
  6.     plugins: {
  7.       title: {
  8.         display: true,
  9.         text: 'Chart.js Line Chart - Logarithmic'
  10.       }
  11.     },
  12.     scales: {
  13.       x: {
  14.         display: true,
  15.       },
  16.       y: {
  17.         display: true,
  18.         type: 'logarithmic',
  19.       }
  20.     }
  21.   },
  22. };
  1. const DATA_COUNT = 7;
  2. const NUMBER_CFG = {count: DATA_COUNT, min: 0, max: 100};
  4. const labels = Utils.months({count: 7});
  5. const data = {
  6.   labels: labels,
  7.   datasets: [
  8.     {
  9.       label: 'Dataset 1',
  10.       data: logNumbers(DATA_COUNT),
  11.       borderColor: Utils.CHART_COLORS.red,
  12.       backgroundColor: Utils.CHART_COLORS.red,
  13.       fill: false,
  14.     },
  15.   ]
  16. };
  1. const logNumbers = (num) => {
  2.   const data = [];
  4.   for (let i = 0; i < num; ++i) {
  5.     data.push(Math.ceil(Math.random() * 10.0) * Math.pow(10, Math.ceil(Math.random() * 5)));
  6.   }
  8.   return data;
  9. };
  11. const actions = [
  12.   {
  13.     name: 'Randomize',
  14.     handler(chart) {
  15.       chart.data.datasets.forEach(dataset => {
  16.         dataset.data = logNumbers(chart.data.labels.length);
  17.       });
  18.       chart.update();
  19.     }
  20.   },
  21. ];

Docs