Smart-Dashboard/js/solar/historyMQTT.js

tooltipLabel = function (context) {
  let label = context.dataset.label || '';
  if (label) {
    label += ': ';
  }
  if (context.dataset.yAxisID == "y1") {
    label += Math.round(context.parsed.y * 10) / 10 + " " + "%";
  } else {
    if (context.parsed.y !== null) {
      ret = scale(Math.round(context.parsed.y), false);
      label += ret[0] + " " + ret[1] + "Wh";
    }
  }
  return label;
};

tooltipFooter = function (tooltipItems){
  let sum = 0;

  tooltipItems.forEach(function(tooltipItem) {
    if (tooltipItem.dataset.yAxisID != "y1") {
      sum += tooltipItem.parsed.y;
    }
  });
  ret = scale(Math.round(sum), false);
  sum = ret[0] + " " + ret[1] + "Wh";
  return 'Summe: ' + sum;
}

legendLabels = function(chart){
    const datasets = chart.data.datasets;
    const {
      labels: {
        usePointStyle,
        pointStyle,
        textAlign,
        color
      }
    } = chart.legend.options;
    return chart._getSortedDatasetMetas().map((meta) => {
      const style = meta.controller.getStyle(usePointStyle ? 0 : undefined);
      const borderWidth = Chart.helpers.toPadding(style.borderWidth);
      ret = scale(Math.round(arraySum(datasets[meta.index].data)), false);
      ret2 = scale(Math.round(datasets[meta.index].data[datasets[meta.index].data.length-1]), false);
      return {
        text: datasets[meta.index].label + " Σ " + ret[0]+" "+ret[1]+"Wh",//+ " Last: " + ret2[0]+" "+ret2[1]+"W",
        fillStyle: style.backgroundColor,
        fontColor: color,
        hidden: !meta.visible,
        lineCap: style.borderCapStyle,
        lineDash: style.borderDash,
        lineDashOffset: style.borderDashOffset,
        lineJoin: style.borderJoinStyle,
        lineWidth: (borderWidth.width + borderWidth.height) / 4,
        strokeStyle: style.borderColor,
        pointStyle: pointStyle || style.pointStyle,
        rotation: style.rotation,
        textAlign: textAlign || style.textAlign,
        borderRadius: 0, // TODO: v4, default to style.borderRadius
        datasetIndex: meta.index
      };
    }, this);
}
Chart.defaults.plugins.tooltip.callbacks.footer = tooltipFooter;
Chart.defaults.plugins.tooltip.callbacks.label = tooltipLabel;
Chart.defaults.plugins.legend.labels.generateLabels = legendLabels;

  var forecastChartSettings = {
    type: 'bar',
    options: {
      responsive: true,
      maintainAspectRatio: false,
      interaction: {
        intersect: false,
        mode: 'index',
      },
      scales: {
        y: {
          stacked: true,
          display: true,
          min: 0,
          suggestedMax: 1000,
          ticks: {
            callback: value => `${value / 1000} kWh`,
          }
        },
      }
    }
  };

  var decadeChartSettings = {
    type: 'bar',
    options: {
      responsive: true,
      maintainAspectRatio: false,
      interaction: {
        intersect: false,
        mode: 'index',
      },
      scales: {
        y: {
          stacked: true,
          display: true,
          min: 0,
          suggestedMax: 1000000,
          ticks: {
            callback: value => `${value / 1000000} MWh`,
          }
        },
      }
    }
  };
 
  var chartData = {};
  
  const consChart = new Chart(
    document.querySelector('#consumption-chart'),
    Object.assign({}, forecastChartSettings)
  );
  const prodChart = new Chart(
    document.querySelector('#production-chart'),
    Object.assign({}, forecastChartSettings)
  );
  const consChartYear = new Chart(
    document.querySelector('#consumption-chart-year'),
    Object.assign({}, decadeChartSettings)
  );
  const prodChartYear = new Chart(
    document.querySelector('#production-chart-year'),
    Object.assign({}, decadeChartSettings)
  );
  const consChartDecade = new Chart(
    document.querySelector('#consumption-chart-decade'),
    Object.assign({}, decadeChartSettings)
  );
  const prodChartDecade = new Chart(
    document.querySelector('#production-chart-decade'),
    Object.assign({}, decadeChartSettings)
  );
  document.addEventListener('readystatechange', function () {
    if (event.target.readyState === "complete") {
      getData(prodChart,       'ajax/energyHistory.php?series=prod&range=month');
      getData(consChart,       'ajax/energyHistory.php?series=cons&range=month');
      getData(prodChartYear,   'ajax/energyHistory.php?series=prod&range=year');
      getData(consChartYear,   'ajax/energyHistory.php?series=cons&range=year');
      getData(prodChartDecade, 'ajax/energyHistory.php?series=prod&range=decade');
      getData(consChartDecade, 'ajax/energyHistory.php?series=cons&range=decade');
      getStats("Stats-Year","ajax/getStats.php?type=ThisYear");
      getStats("Stats-Lastyear","ajax/getStats.php?type=LastYear");
      getStats("Stats-Prelastyear","ajax/getStats.php?type=PreLastYear");
    }
  });