Lightrun
question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Chart.js v3.0.0-beta.6 - Line chard - minimumFractionDigits value is out of range.

See original GitHub issue

Expected Behavior

How can I find out how this error occurs. I suspect it has something to do with the labels, but I can’t figure it out

Current Behavior

minimumFractionDigits value is out of range.

Bildschirmfoto 2020-11-22 um 15 53 36

Context

{
  "type": "line",
  "data": {
    "labels": [
      [
        "17. Nov.",
        " 07:00"
      ],
      [
        "17. Nov.",
        " 08:00"
      ],
      [
        "17. Nov.",
        " 09:00"
      ],
      [
        "17. Nov.",
        " 10:00"
      ],
      [
        "17. Nov.",
        " 11:00"
      ],
      [
        "17. Nov.",
        " 12:00"
      ],
      [
        "17. Nov.",
        " 13:00"
      ],
      [
        "17. Nov.",
        " 14:00"
      ],
      [
        "18. Nov.",
        " 08:00"
      ],
      [
        "18. Nov.",
        " 09:00"
      ],
      [
        "18. Nov.",
        " 10:00"
      ],
      [
        "18. Nov.",
        " 11:00"
      ],
      [
        "18. Nov.",
        " 12:00"
      ],
      [
        "18. Nov.",
        " 13:00"
      ],
      [
        "18. Nov.",
        " 14:00"
      ],
      [
        "19. Nov.",
        " 09:00"
      ],
      [
        "19. Nov.",
        " 10:00"
      ],
      [
        "19. Nov.",
        " 11:00"
      ],
      [
        "20. Nov.",
        " 08:00"
      ],
      [
        "20. Nov.",
        " 09:00"
      ],
      [
        "20. Nov.",
        " 10:00"
      ],
      [
        "20. Nov.",
        " 11:00"
      ],
      [
        "20. Nov.",
        " 12:00"
      ],
      [
        "21. Nov.",
        " 08:00"
      ],
      [
        "21. Nov.",
        " 09:00"
      ],
      [
        "21. Nov.",
        " 10:00"
      ],
      [
        "21. Nov.",
        " 11:00"
      ],
      [
        "21. Nov.",
        " 12:00"
      ],
      [
        "21. Nov.",
        " 13:00"
      ],
      [
        "21. Nov.",
        " 14:00"
      ],
      [
        "22. Nov.",
        " 06:00"
      ],
      [
        "22. Nov.",
        " 08:00"
      ],
      [
        "22. Nov.",
        " 09:00"
      ],
      [
        "22. Nov.",
        " 10:00"
      ],
      [
        "22. Nov.",
        " 11:00"
      ],
      [
        "22. Nov.",
        " 12:00"
      ],
      [
        "22. Nov.",
        " 13:00"
      ],
      [
        "22. Nov.",
        " 14:00"
      ]
    ],
    "datasets": [
      {
        "label": "Verbrauch",
        "unit": "kWh",
        "borderWidth": 0.5,
        "name": "Verbrauch",
        "yAxisID": "left",
        "backgroundColor": "#e74c3c",
        "borderColor": "#e74c3c",
        "data": [
          "0.04",
          "0.09",
          "0.03",
          "0.03",
          "0.03",
          "0.03",
          "0.01",
          "0.00",
          "0.00",
          "0.00",
          "0.00",
          "0.00",
          "0.00",
          "0.05",
          "0.04",
          "0.04",
          "0.04",
          "0.06",
          "0.04",
          "0.04",
          "0.43",
          "0.19",
          "0.03",
          "0.04",
          "0.02",
          "0.02",
          "0.03",
          "0.03",
          "0.03",
          "0.04",
          "0.04",
          "0.00",
          "0.00",
          "0.00",
          "0.00",
          "0.06",
          "0.03",
          "0.05",
          "0.05",
          "0.12",
          "0.04",
          "0.05",
          "0.04",
          "0.42",
          "0.16",
          "0.03",
          "0.03",
          "0.08",
          "0.04",
          "0.11",
          "0.03",
          "0.04",
          "0.03",
          "0.09",
          "0.03",
          "0.02",
          "0.08",
          "0.05",
          "0.03",
          "0.02",
          "0.03",
          "0.04",
          "0.04",
          "0.08",
          "0.05",
          "0.04",
          "0.04",
          "0.43",
          "0.03",
          "0.03",
          "0.04",
          "0.02",
          "0.02",
          "0.02",
          "0.15",
          "0.03",
          "0.06",
          "0.03",
          "0.00",
          "0.00",
          "0.00",
          "0.00",
          "0.03",
          "0.03",
          "0.03",
          "0.03",
          "0.06",
          "0.06",
          "0.04",
          "0.04",
          "0.04",
          "0.57",
          "0.03",
          "0.02",
          "0.02",
          "0.04",
          "0.03",
          "0.02",
          "0.03",
          "0.03",
          "0.02",
          "0.06",
          "0.00",
          "0.00",
          "0.04",
          "0.01",
          "0.14",
          "0.00",
          "0.02",
          "0.03",
          "0.25",
          "0.20",
          "0.18",
          "0.18",
          "0.05",
          "0.04",
          "0.03",
          "0.03",
          "0.02",
          "0.02",
          "0.03",
          "0.02",
          "0.03",
          "0.04",
          "0.03",
          "0.01",
          "0.01",
          "0.00",
          "0.01",
          "0.00",
          "0.01",
          "0.00",
          "0.03",
          "0.03"
        ]
      },
      {
        "label": "Überschuss",
        "unit": "kWh",
        "borderWidth": 0.5,
        "name": "Überschuss",
        "yAxisID": "left",
        "backgroundColor": "#8bc34a",
        "borderColor": "#8bc34a",
        "type": "bar",
        "state": "0.0",
        "data": [
          "0.00",
          "105.00",
          "109.00",
          "73.00",
          "36.00",
          "25.00",
          "26.00",
          "0.00",
          "16.00",
          "101.00",
          "43.00",
          "55.00",
          "32.00",
          "7.00",
          "0.00",
          "0.00",
          "0.00",
          "0.00",
          "1.00",
          "0.00",
          "7.00",
          "105.00",
          "0.00",
          "62.00",
          "51.00",
          "0.00",
          "33.00",
          "0.00",
          "23.00",
          "0.00",
          "0.00",
          "0.00",
          "50.00",
          "59.00",
          "38.00",
          "36.00",
          "10.00",
          "0.00"
        ]
      }
    ]
  },
  "options": {
    "color": "rgba(0,0,0,0.1)",
    "elements": {
      "arc": {
        "borderAlign": "center",
        "borderColor": "#fff",
        "borderWidth": 0,
        "offset": 0,
        "backgroundColor": "rgba(0,0,0,0.1)"
      },
      "line": {
        "borderCapStyle": "butt",
        "borderDash": [],
        "borderDashOffset": 0,
        "borderJoinStyle": "miter",
        "borderWidth": 3,
        "capBezierPoints": true,
        "fill": false,
        "tension": 0,
        "backgroundColor": "rgba(0,0,0,0.1)",
        "borderColor": "rgba(0,0,0,0.1)"
      },
      "point": {
        "borderWidth": 0,
        "hitRadius": 8,
        "hoverBorderWidth": 1,
        "hoverRadius": 8,
        "pointStyle": "circle",
        "radius": 0.33,
        "backgroundColor": "rgba(0,0,0,0.1)",
        "borderColor": "rgba(0,0,0,0.1)"
      },
      "bar": {
        "borderSkipped": "start",
        "borderWidth": 0,
        "borderRadius": 0,
        "backgroundColor": "rgba(0,0,0,0.1)",
        "borderColor": "rgba(0,0,0,0.1)"
      }
    },
    "events": [
      "mousemove",
      "mouseout",
      "click",
      "touchstart",
      "touchmove"
    ],
    "font": {
      "color": "#666",
      "family": "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif",
      "size": 12,
      "style": "normal",
      "lineHeight": 1.2,
      "weight": null,
      "lineWidth": 0
    },
    "interaction": {
      "mode": "index",
      "intersect": true
    },
    "hover": {
      "mode": "nearest",
      "intersect": true,
      "onHover": null
    },
    "maintainAspectRatio": false,
    "onHover": null,
    "onClick": null,
    "responsive": true,
    "showLine": true,
    "plugins": {
      "filler": {
        "propagate": true
      },
      "legend": {
        "display": true,
        "position": "top",
        "align": "center",
        "fullWidth": true,
        "reverse": false,
        "weight": 1000,
        "onHover": null,
        "onLeave": null,
        "labels": {
          "boxWidth": 40,
          "padding": 10
        },
        "title": {
          "display": false,
          "position": "center",
          "text": ""
        }
      },
      "title": {
        "align": "center",
        "display": false,
        "font": {
          "style": "bold"
        },
        "fullWidth": true,
        "padding": 10,
        "position": "top",
        "text": "",
        "weight": 2000
      },
      "tooltip": {
        "enabled": true,
        "custom": null,
        "position": "average",
        "backgroundColor": "rgba(0,0,0,0.8)",
        "titleFont": {
          "style": "bold",
          "color": "#fff"
        },
        "titleSpacing": 2,
        "titleMarginBottom": 6,
        "titleAlign": "left",
        "bodySpacing": 2,
        "bodyFont": {
          "color": "#fff"
        },
        "bodyAlign": "left",
        "footerSpacing": 2,
        "footerMarginTop": 6,
        "footerFont": {
          "color": "#fff",
          "style": "bold"
        },
        "footerAlign": "left",
        "yPadding": 6,
        "xPadding": 6,
        "caretPadding": 2,
        "caretSize": 5,
        "cornerRadius": 6,
        "multiKeyBackground": "#fff",
        "displayColors": true,
        "borderColor": "rgba(0,0,0,0)",
        "borderWidth": 0,
        "animation": {
          "duration": 400,
          "easing": "easeOutQuart",
          "numbers": {
            "type": "number",
            "properties": [
              "x",
              "y",
              "width",
              "height",
              "caretX",
              "caretY"
            ]
          },
          "opacity": {
            "easing": "linear",
            "duration": 200
          }
        },
        "callbacks": {}
      },
      "chardbackground": {},
      "gradient": {}
    },
    "layout": {
      "padding": {
        "top": 0,
        "right": 16,
        "bottom": 16,
        "left": 16
      }
    },
    "animation": false,
    "locale": "de-DE",
    "defaultFontColor": "#ecf0f1",
    "defaultFontFamily": "Quicksand, Roboto, \"Open Sans\",\"Rubik\",sans-serif",
    "datasetElementType": "line",
    "datasetElementOptions": [
      "backgroundColor",
      "borderCapStyle",
      "borderColor",
      "borderDash",
      "borderDashOffset",
      "borderJoinStyle",
      "borderWidth",
      "capBezierPoints",
      "cubicInterpolationMode",
      "fill"
    ],
    "dataElementType": "point",
    "dataElementOptions": {
      "backgroundColor": "pointBackgroundColor",
      "borderColor": "pointBorderColor",
      "borderWidth": "pointBorderWidth",
      "hitRadius": "pointHitRadius",
      "hoverHitRadius": "pointHitRadius",
      "hoverBackgroundColor": "pointHoverBackgroundColor",
      "hoverBorderColor": "pointHoverBorderColor",
      "hoverBorderWidth": "pointHoverBorderWidth",
      "hoverRadius": "pointHoverRadius",
      "pointStyle": "pointStyle",
      "radius": "pointRadius",
      "rotation": "pointRotation"
    },
    "spanGaps": true,
    "type": "line",
    "units": "",
    "title": {
      "align": "center",
      "display": true,
      "font": {
        "style": "normal",
        "color": "#ecf0f1"
      },
      "fullWidth": true,
      "padding": 10,
      "position": "top",
      "text": "Produktion vs. Verbrauch",
      "weight": 2000
    },
    "chartArea": {
      "backgroundColor": "rgba(0,0,0,0.5)"
    },
    "legend": {
      "display": true,
      "position": "top",
      "lineWidth": 0,
      "labels": {
        "usePointStyle": true,
        "boxWidth": 8
      }
    },
    "tooltips": {
      "mode": "nearest",
      "intersect": true,
      "enabled": true,
      "custom": null,
      "position": "nearest",
      "backgroundColor": "#ecf0f1",
      "titleFont": {
        "style": "normal",
        "color": "#2c3e50"
      },
      "titleSpacing": 2,
      "titleMarginBottom": 6,
      "titleAlign": "left",
      "bodySpacing": 2,
      "bodyFont": {
        "color": "#2c3e50",
        "style": "normal"
      },
      "bodyAlign": "left",
      "footerSpacing": 2,
      "footerMarginTop": 6,
      "footerFont": {
        "color": "#2c3e50",
        "style": "normal"
      },
      "footerAlign": "left",
      "yPadding": 6,
      "xPadding": 6,
      "caretPadding": 2,
      "caretSize": 5,
      "cornerRadius": 6,
      "multiKeyBackground": "#fff",
      "displayColors": true,
      "borderColor": "rgba(0,0,0,0)",
      "borderWidth": 0,
      "animation": false,
      "callbacks": {}
    },
    "scales": {
      "left": {
        "axis": "y",
        "id": "left",
        "type": "linear",
        "position": "left",
        "display": true,
        "scaleLabel": {
          "display": true,
          "labelString": "Verbrauch / Überschuss (kWh)",
          "padding": {
            "top": 4,
            "bottom": 4
          }
        },
        "beginAtZero": true,
        "ticks": {
          "minRotation": 0,
          "maxRotation": 50,
          "mirror": false,
          "lineWidth": 0,
          "strokeStyle": "",
          "padding": 0,
          "display": true,
          "autoSkip": true,
          "autoSkipPadding": 0,
          "labelOffset": 0,
          "minor": {},
          "major": {},
          "align": "center",
          "crossAlign": "near"
        },
        "offset": false,
        "reverse": false,
        "gridLines": {
          "display": true,
          "color": "#d3d7cf",
          "lineWidth": 0.18,
          "drawBorder": true,
          "drawOnChartArea": true,
          "drawTicks": true,
          "tickMarkLength": 10,
          "offsetGridLines": false,
          "borderDash": [
            2
          ],
          "borderDashOffset": 0,
          "zeroLineWidth": 8
        }
      },
      "x": {
        "axis": "x",
        "time": {
          "unit": "hour",
          "locale": "de-DE"
        },
        "ticks": {
          "autoSkip": true,
          "maxTicksLimit": 8,
          "minRotation": 0,
          "maxRotation": 50,
          "mirror": false,
          "lineWidth": 0,
          "strokeStyle": "",
          "padding": 0,
          "display": true,
          "autoSkipPadding": 0,
          "labelOffset": 0,
          "minor": {},
          "major": {},
          "align": "center",
          "crossAlign": "near"
        },
        "scaleLabel": {
          "display": true,
          "labelString": "Zeitraum",
          "padding": {
            "top": 4,
            "bottom": 4
          }
        },
        "type": "category",
        "offset": true,
        "gridLines": {
          "offsetGridLines": true,
          "display": true,
          "color": "#d3d7cf",
          "lineWidth": 0.18,
          "drawBorder": true,
          "drawOnChartArea": true,
          "drawTicks": true,
          "tickMarkLength": 10,
          "borderDash": [
            2
          ],
          "borderDashOffset": 0,
          "zeroLineWidth": 8
        },
        "display": true,
        "reverse": false,
        "beginAtZero": false,
        "id": "x",
        "position": "bottom"
      },
      "right": {
        "axis": "r",
        "scaleLabel": {
          "display": true,
          "labelString": "Produktion (kWh)",
          "padding": {
            "top": 4,
            "bottom": 4
          }
        },
        "type": "linear",
        "ticks": {
          "minRotation": 0,
          "maxRotation": 50,
          "mirror": false,
          "lineWidth": 0,
          "strokeStyle": "",
          "padding": 0,
          "display": true,
          "autoSkip": true,
          "autoSkipPadding": 0,
          "labelOffset": 0,
          "minor": {},
          "major": {},
          "align": "center",
          "crossAlign": "near"
        },
        "display": true,
        "offset": false,
        "reverse": false,
        "beginAtZero": false,
        "gridLines": {
          "display": true,
          "color": "#d3d7cf",
          "lineWidth": 0.18,
          "drawBorder": true,
          "drawOnChartArea": true,
          "drawTicks": true,
          "tickMarkLength": 10,
          "offsetGridLines": false,
          "borderDash": [
            2
          ],
          "borderDashOffset": 0,
          "zeroLineWidth": 8
        },
        "id": "right",
        "position": "chartArea"
      }
    }
  }
}

Environment

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:9 (3 by maintainers)

github_iconTop GitHub Comments

15reactions
deemeetreecommented, Jun 21, 2021

I had this error too and I managed to fix it by adding:

scales: {
                    y: {
                        ticks: {
                          callback: function(val, index) {
                              return val;
                          },
                        }
                    },
0reactions
shiowwjcommented, Sep 21, 2022

I had this error too and I managed to fix it by adding:

scales: {
                    y: {
                        ticks: {
                          callback: function(val, index) {
                              return val;
                          },
                        }
                    },

Thank you so much. This works and the error stopped, however i only get the X axis labels and values.

image

Read more comments on GitHub >

github_iconTop Results From Across the Web

minimumFractionDigits value is out of range" with ChartJS in ...
js It works locally but in production, it gives the following error: Application error: a client-side exception has occurred (see the browser ...
Read more >
chartjs-chart-treemap - npm
Chart.js module for creating treemap charts. Latest version: 2.1.3, last published: a month ago. Start using chartjs-chart-treemap in your ...
Read more >
Line Chart - Chart.js
A line chart is a way of plotting data points on a line. ... All these values, if undefined , fallback first to...
Read more >
Chart JS Range Input - YouTube
Chart JS Range InputHow to use in Chart JS a range input? With Chart JS using a range input can create a extra...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found
Previous page

Chart 3.0.0-beta.7: bar borderRadius - bottomRight & bottomLeft ??

Next page

Controller: TypeError: class constructors must be invoked with 'new'