PVPC trend graph in visu

[admin]

This .lp example will generate the chart. Modify it to use storage values instead of random values. Upload it as chart.lp, then use image element with remote source url set to /user/chart.lp

Code:

<?

math.randomseed(os.time())

local data = {}
for i = 1, 24 do
  data[ i ] = {
    value = math.random(100, 300)
  }
end

local labels = {}

for i = 0, 23 do
  local label = tostring(i)
  if #label == 1 then
    label = '0' .. label
  end

  labels[ #labels + 1 ] = label
end

for i, item in ipairs(data) do
  data[ i ] = item.value / 1000
end

local width = 600
local height = 400

local params = {
  type = 'line',
  data = {
    labels = labels,
    datasets = {
      {
        label = 'Prices',
        backgroundColor = 'rgb(255, 99, 132)',
        borderColor = 'rgb(255, 99, 132)',
        data = data,
        fill = false,
      }
    }
  },
  options = {
    title = {
      display = true,
      text = 'Title',
    }
  }
}

local cdata = ngx.escape_uri(require('json').encode(params))
local url = 'https://quickchart.io/chart?w=' .. width .. '&h=' .. height .. '&c=' .. cdata

local data = require('socket.http').request(url)

header('content-type', 'image/png')
write(data)