84
Views
5
Comments
Handle null values in Highcharts API- Line chart
Application Type
Reactive

I am creating a line-graph with data having some null values, but the NULLs are getting defaulted to zero, 
I want create a gap when the datapoint is a null value, refer this link -https://www.highcharts.com/demo/line-basic
this demo shows that we can achieve this by configuring AdvanceFormat-HighchartsJSON by adding following configurations-
plotOptions: {
series: {            
label: {                
connectorAllowed: false           
 } }    
},
~ however this configuration is not working as I found datapoint structure have value attribute is of Decimal type,
which could be the reason for defaulting the null value to zero.


I have also attached my AdvanceFormat-HighchartsJSON  configurations.

Expected output- 


Actual Output- 

JSON.txt
2019-03-19 12-24-07
Mariano Picco
 
MVP

I found this solution somewhere else, however I don't know if it can be applied to Outsystems:


http://jsfiddle.net/pawel_dalek/DdvGm/94/

2021-04-14 21-51-32
Malvika Singh

I will be having value 0 (as datapoint) and for that I want to show drop in the graph, its the null values that I want to show a discontinued line for.

2019-03-19 12-24-07
Mariano Picco
 
MVP

Isn't that what this function is doing?



  data.forEach(function(element, index) {

    if (element === 0) {

      data[index] = null;

    }

  });


As I pointed out, I'm not sure how exactly to port it to OutSystems, but it seems like a really good candidate

2024-08-27 11-35-25
Ajay Anthony

Outsystems stores null value as 0 by default. I am not sure exactly what you want to implement. But i hope the below solution may help.

You can try having another attribute in the Entity as Is null(Boolean), when user enters null value OS will store is as 0 but using Javascript you can identify if the value entered is 0 or null.

On click of validate/save have the following JS and pass the input widget id as input parameter to the JS.

var inputValue = document.getElementById($parameters.InputId).value;$parameters.EmptyValue = inputValue ? true : false;

  • If the JS Output is true assign Is null as false(Has value or 0)
  • If  JS Output is False assign is null as True (User entered null value)

Create a new structure with the same attributes as of Datapoints and add one attribute as Isnull and handle the charts accordingly to show the disconnected lines for records which have null values.


2023-07-12 04-21-28
Ivan Maulana

 I am not sure exactly what you want to implement.

can you use a filter when the data is empty before assigning it to a datapoint?


or in hightjson code you can use condition

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.