Docs

Charts Overview

Bar Graphs

Line Graphs

Pie Graphs

Numeric Distribution Chart

Data Requirements: Of course you need one numeric column in your data set. Secondly, this chart can eat up a lot of memory if there are too many values, so by default it only displays when there are less than 5,000 rows in your currently filtered data. Even this may be too high. Feel free to raise it up, but it could freeze up your computer. Perhaps there's a better way to do this, but we add an element for every number value being represented, so you can imagine it's hard to render over 5k elements.

Alter the 5k Default Limit

Javascript: Do a search in the enterprise script for if(noLen && noLen < 5000){
Angular: File of interest: data-table/charts/column-chart/column-chart.ts then search for the numArrMax: number = 5000 declaration
React: File of interest: deebo-grid/src/components/charts/ColumnChart.jsx then near the top, find the const numArrMax = 5000 declaration

Change the 5000 number to something higher at your own risk.

Change Number Bar Colors

To change the colors of bars in number distribution charts:

Javascript: Do a search in the enterprise script for showNumColValDist:
Angular: File of interest: data-table/charts/num-value-distro-component/num-value-distro-component.ts then search for the showNumColValDist( function implementation
React: File of interest: deebo-grid/src/components/charts/NumValueDistro.jsx then search for the const showNumColValDist declaration

After locating the showNumColValDist in your respective tech's code, find the themeColor1 reference. That's the first theme color you set up (if any) in the buildInitUiDataTable function. The color of all the bars will be set to this color or a default color if you didn't pass in a theme color. The class being given to these bars is .num-col-val-dist-bar find that in your CSS and see it's opacity set to 0.1. This creates a heat map effect as the visual appears darker the more frequently the value appears in the data.