Jump to content

Graph manipulation with (Java) script

Recommended Posts

Could anyone please tell me how I could manipulate a value in a graph related to a chosen color, with a certain script?

I think this should be possible with a script during submission or perhaps in the Footer of the Graph settings?

For instance:

I am using a bar graph to present the actual, real time, health status of a certain system. This typical bar, varies between 0 - 100%, but always gets a color choosen by the system, and dependent on the Style I've choosen. I would like to manipulate this color, depending on the retrieved field value.


I would like to use a red colored graph when the value of the field is e.g. between 0 < n < 50 (range free to choose in script)

I would like to use an orange  colored when the value of the field is e.g. between 50 < n < 75

I would like to use a  green colored when the value of the field is e.g. between 75 < n <= 100

Link to comment
Share on other sites

  • 2 weeks later...

Hi @Berti,

I have found a solution which might work for your case.

You need to place following snippet of Javascript code into Chart Datapage footer:

<script type="text/javascript">

var int = setInterval(updateChartOptions, 100);

function updateChartOptions(){

    if(typeof Highcharts == "undefined" || !Highcharts.charts.length) return;

    Highcharts.charts[0].update({plotOptions: {
        column: {
            zones: [{
                value: 10000, // up to this value color of column will be blue
                    color: 'blue'
                value: 30000, // if column is more than 30000 it will be green
                    color: 'green'
                color: 'red' // if value if above 30000 it will be red


Hope this helps.




Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...