Gradients not working

Dashticz, alternative dashboard based on HTML, CSS, jQuery

Moderators: leecollings, htilburgs, robgeerts

Post Reply
Kiekerjan
Posts: 12
Joined: Thursday 26 March 2020 21:11
Target OS: Raspberry Pi / ODroid
Domoticz version:
Contact:

Gradients not working

Post by Kiekerjan »

Hello,
I am trying to get gradients in the graphs but I can't figure out how to do that. I have added gradients: ['blue', 'white'] to the block but that does not do anything. This line is ignored. I searched and found that it would work for multiblocks only but that also gives no result (viewtopic.php?p=234118#p234118). And the link to the git page does not exist anymore (well, actually I am not sure if it ever existed).

This is my code for the graph block (in CONFIG.js):

Code: Select all

blocks['SolarGraphTotal'] = {
    title: 'Opbrengst vandaag',
    devices: [783],
    graph: 'line',
    lineFill: [true],
    lineTension: 0.4,
    custom :{
        "1 maand": {
            range: 'month',
            filter: '1 month',
            data: {
              Opbrengst: 'd.v_783',
            }
        },
        "3 maanden": {
            range: 'year',
            filter: '3 months',
            data: {
              Opbrengst: 'd.v_783',
            }
        },
        "6 maanden": {
            range: 'year',
            filter: '6 months',
            data: {
              Opbrengst: 'd.v_783',
            }
        }
    },
    legend: true,
    //datasetColors:['rgba(0,255,51,0.5'],     
    //gradients: true,
    gradients: ['blue', 'white'],
    gradientHeight: 0.5
}

The debuginfo from the graph correctly seems to mention the gradient but the default datasetColors are used instead. I also tried to change these but that has no effect.

Code: Select all

{
  "mountPoint": "#block_34",
  "block": {
    "width": 12,
    "datasetColors": [
      "red",
      "yellow",
      "blue",
      "orange",
      "green",
      "purple",
      "chartreuse",
      "aqua",
      "teal",
      "pink",
      "gray",
      "fuchsia"
    ],
    "axisRight": false,
    "axisAlternate": true,
    "barWidth": 0.9,
    "beginAtZero": false,
    "borderDash": [],
    "borderWidth": 2,
    "buttonsBorder": "white",
    "buttonsColor": "black",
    "buttonsFill": "white",
    "buttonsIcon": "#686868",
    "buttonsMarginX": 2,
    "buttonsMarginY": 0,
    "buttonsPadX": 6,
    "buttonsPadY": 2,
    "buttonsRadius": 0,
    "buttonsShadow": false,
    "buttonsSize": 14,
    "buttonsText": false,
    "cartesian": "linear",
    "custom": {
      "1 maand": {
        "range": "month",
        "filter": "1 month",
        "data": {
          "Opbrengst": "d.v_783"
        }
      },
      "3 maanden": {
        "range": "year",
        "filter": "3 months",
        "data": {
          "Opbrengst": "d.v_783"
        }
      },
      "6 maanden": {
        "range": "year",
        "filter": "6 months",
        "data": {
          "Opbrengst": "d.v_783"
        }
      }
    },
    "customHeader": false,
    "debugButton": true,
    "displayFormats": false,
    "drawOrderDay": false,
    "drawOrderLast": false,
    "drawOrderMonth": false,
    "flash": false,
    "fontColor": "white",
    "format": true,
    "gradients": [
      "blue",
      "white"
    ],
    "graph": "line",
    "graphTypes": false,
    "groupBy": false,
    "groupByDevice": false,
    "height": false,
    "iconColour": "grey",
    "interval": 1,
    "legend": true,
    "lineFill": [
      true
    ],
    "lineTension": 0.4,
    "maxTicksLimit": null,
    "method": 1,
    "pointBorderColor": [
      "grey"
    ],
    "pointBorderWidth": 0,
    "pointRadius": 0,
    "pointStyle": false,
    "range": "initial",
    "refresh": 300,
    "reverseTime": false,
    "sortDevices": false,
    "spanGaps": false,
    "stacked": false,
    "title": "Opbrengst vandaag",
    "tooltiptotal": false,
    "zoom": false,
    "type": "SolarGraphTotal",
    "devices": [
      783
    ],
    "gradientHeight": 0.5,
    "key": "SolarGraphTotal",
    "isPopup": true
  },
  "key": "SolarGraphTotal",
  "name": "graph",
  "callbacks": {
    "timeoutList": [],
    "intervalList": [
      182
    ],
    "subscriptionList": [
      null,
      null
    ]
  },
  "$mountPoint": {
    "0": {},
    "length": 1
  },
  "graphDevices": [
    {
      "AddjMulti": 1,
      "AddjMulti2": 1,
      "AddjValue": 0,
      "AddjValue2": 0,
      "BatteryLevel": 255,
      "CounterToday": "0.135 kWh",
      "CustomImage": 0,
      "Data": "60.636 kWh",
      "Description": "",
      "EnergyMeterMode": "",
      "Favorite": 1,
      "HardwareDisabled": false,
      "HardwareID": 7,
      "HardwareName": "SolarEdge_modbusTCP",
      "HardwareType": "SolarEdge ModbusTCP",
      "HardwareTypeVal": 94,
      "HaveTimeout": false,
      "ID": "00070012",
      "LastUpdate": "2024-01-26 11:01:24",
      "Name": "SolarEdge_modbusTCP - Total Energy",
      "Notifications": "false",
      "PlanID": "0",
      "PlanIDs": [
        0
      ],
      "Protected": false,
      "ShowNotifications": true,
      "SignalLevel": "-",
      "SubType": "kWh",
      "SwitchTypeVal": 4,
      "Timers": "false",
      "Type": "General",
      "TypeImg": "current",
      "Unit": 18,
      "Usage": "124.45 Watt",
      "Used": 1,
      "XOffset": "0",
      "YOffset": "0",
      "idx": 783,
      "Data0": "60.636 kWh",
      "currentValue": "0,14 kWh",
      "name": "SolarEdge_modbusTCP - Total Energy",
      "sensor": "counter",
      "subtype": "kWh",
      "title": "SolarEdge_modbusTCP - Total Energy",
      "txtUnit": "kWh",
      "txtUnits": [],
      "type": "General",
      "decimals": 2,
      "method": 1
    }
  ],
  "decimals": 2,
  "graphIdx": "block_34",
  "lastRefreshTime": 1706263284,
  "range": "month",
  "title": "Opbrengst vandaag",
  "params": [
    "type=command¶m=graph&sensor=counter&idx=783&range=month&method=1"
  ],
  "subtype": "kWh",
  "txtUnits": [],
  "data": {
    "result": [
      {
        "d": "2024-01-13",
        "Opbrengst": "0.03"
      },
      {
        "d": "2024-01-14",
        "Opbrengst": "0.63"
      },
      {
        "d": "2024-01-15",
        "Opbrengst": "0.66"
      },
      {
        "d": "2024-01-16",
        "Opbrengst": "1.58"
      },
      {
        "d": "2024-01-17",
        "Opbrengst": "0.54"
      },
      {
        "d": "2024-01-18",
        "Opbrengst": "5.55"
      },
      {
        "d": "2024-01-19",
        "Opbrengst": "6.19"
      },
      {
        "d": "2024-01-20",
        "Opbrengst": "4.08"
      },
      {
        "d": "2024-01-21",
        "Opbrengst": "1.89"
      },
      {
        "d": "2024-01-22",
        "Opbrengst": "2.47"
      },
      {
        "d": "2024-01-23",
        "Opbrengst": "4.78"
      },
      {
        "d": "2024-01-24",
        "Opbrengst": "4.36"
      },
      {
        "d": "2024-01-25",
        "Opbrengst": "2.96"
      },
      {
        "d": "2024-01-26",
        "Opbrengst": "0.13"
      }
    ],
    "status": "OK",
    "title": "Graph day",
    "Opbrengst": "d.v_783"
  },
  "realrange": "month",
  "dataFilterCount": 1,
  "dataFilterUnit": "month",
  "groupBy": false,
  "customRange": true,
  "customRangeName": "1 maand",
  "graphConfig": {
    "range": "month",
    "filter": "1 month",
    "data": {
      "Opbrengst": "d.v_783"
    }
  },
  "ylabels": [
    "kWh"
  ],
  "keys": [
    "v"
  ],
  "ykeys": [
    "Opbrengst"
  ],
  "txtUnit": "kWh",
  "filter": "1 month",
  "chartctx": {}
}
The result (I want a gradient to fill the graph):
download2.png
download2.png (23.37 KiB) Viewed 1205 times
Besides the examples in the documnetation I did not find other examples of this. And the documentation only mentiones the image as example, without the code to create it. So, all tips are welcome!

config: Dasticz version 3.11 / Domoticz 2024.1
Lokonli
Posts: 2271
Joined: Monday 29 August 2016 22:40
Target OS: Raspberry Pi / ODroid
Domoticz version:
Contact:

Re: Gradients not working

Post by Lokonli »

It's a bug in the current version.

I'm updating the graph module at the moment. I'll fix this as well.
Kiekerjan
Posts: 12
Joined: Thursday 26 March 2020 21:11
Target OS: Raspberry Pi / ODroid
Domoticz version:
Contact:

Re: Gradients not working

Post by Kiekerjan »

Lokonli wrote: Friday 26 January 2024 20:05 It's a bug in the current version.

I'm updating the graph module at the moment. I'll fix this as well.
That's great! Thank you!
Post Reply

Who is online

Users browsing this forum: No registered users and 0 guests