nativescript-ui-charts
nativescript-ui-charts copied to clipboard
Feature request, please add an option to allow for injection of custom variables which can be used in highcharts formatters like legend or label formatters
Hello, I would like to display statistical data within the highchart charts, for example mean or median of a distribution. Currently I see no way to pass variables from the nativescript code down to the highcharts object.
@shiv19 might you also have an idea how I could get some custom data for a series to a legend.labelFormatter() with the current functionality? I would like to plot the average value of a series into the legend with a custom formatter. As the average is computed outside of the chart (chart does not hold all data for it) I would need to set it somehow on the chartOptions.
labelFormatter: function () {
if (this.visible) {
return `<div style="box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);background-color: rgb(233, 233, 233);padding: 5px 10px; margin: 0px 0px 7px 0px;border-radius: 8px;border-bottom: 4px solid ${this.color};"><div style="font-family: Helvetica;font-weight: normal;display: inline-block;position: relative;color: #555;">${this.name}</div></div>`;
} else {
return `<div style="background-color: rgba(255,255,255,0.2);padding: 5px 10px; margin: 0px 0px 7px 0px;border-radius: 8px;"><div style="font-family: Helvetica;font-weight: normal;display: inline-block;position: relative;color: white;">${this.name}</div></div>`;
}
},
I've only used a few special keys that are available inside the labelFormatter function. Haven't tried passing something from NativeScript.
But you might be able pass it by binding your nativescript variable to the label formatter function.
something like
labelFormatter: function(nsVar1, nsVar2) {
// return your label format
}.bind(this, nsVar1, nsVar2)
But I think that this technique would alter the "this" variable inside the label formatter.