plotly / dash-daq

Control components for Dash
MIT License
141 stars 40 forks source link

daq.Gauge does not display interval labels with non-0 integer 'min' prop value #124

Closed wbrgss closed 3 years ago

wbrgss commented 4 years ago

I think the labels should be displayed, with the interval count simply starting at min as I think is implied by the scale prop description/docstrings (see "Gauge properties"). The scale arguments (e.g. labelInterval) appear to be directly related to the label display.

scale (dict; optional): Configuration for the component scale. scale has the following type: dict containing keys 'start', 'interval', 'labelInterval', 'custom'. Those keys have the following types:

  • start (number; optional): Value to start the scale from. Defaults to min.

Providing a non-0 (EDIT: positive) max value does not affect the interval label display, which is inconsistent IMO.

With a non-0 min (EDIT: positive) argument — no interval labels:

image

When the min value is 0, either implicitly (by default) or explicitly with min=0:

image

Minimal example:

import dash
import dash_daq as daq
import dash_html_components as html

app = dash.Dash(__name__)

app.layout = html.Div([
    daq.Gauge(
        min=1,
    )
])

if __name__ == '__main__':
    app.run_server(debug=True)
n304win commented 4 years ago

can confirm!

Yakult182 commented 3 years ago

Colors also don't align with the range-values if min is not equal to zero. In the following example I would expect the green area to be around the gauge needle at 22. Missing labels due to the known bug.

 daq.Gauge(
                     color={"gradient":True ,"ranges":{"#ff0001": [16, 20], "FFFF00":[20, 21], "green": [21, 22], "yellow" : [22,26], "#FF0000":                     [26,30] }},
                     value=22,
                     label='Default',
                     scale={'interval': 2, 'labelInterval': 2},
                     max=30,
                     min=16,
                     )

2020-12-04 03_43_17-Dash — Mozilla Firefox

inviridi commented 3 years ago

Odd behaviour. Unfortunately, it renders gauges pretty useless for me.

Karan-S-Mittal commented 3 years ago

Colors also don't align with the range-values if min is not equal to zero. In the following example I would expect the green area to be around the gauge needle at 22. Missing labels due to the known bug.

 daq.Gauge(
                     color={"gradient":True ,"ranges":{"#ff0001": [16, 20], "FFFF00":[20, 21], "green": [21, 22], "yellow" : [22,26], "#FF0000":                     [26,30] }},
                     value=22,
                     label='Default',
                     scale={'interval': 2, 'labelInterval': 2},
                     max=30,
                     min=16,
                     )

2020-12-04 03_43_17-Dash — Mozilla Firefox

Hey @Yakult182, In your code, you have actually not added 2nd color property properly. I am working on this bug fix and was using your code but the color behavior was working correctly. I am adding a GIF that has the issue corrected. will create a PR soon as the original bug is resolved as well. issue-124