Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

  1. Define a single Highlight as shown in the screenshot below (values of “start element / end element” and “start series / end series” are just examples. It’s also possible to use any other element or series of the chart).


  2. Define a global script variable (ie. “step”) – type “integer” – default value “0”.


  3. Insert the following script in “on element clicked” – method of the chart and replace the name of the component (GRAPHOMATECHART_1) with the one from your application.

    Code Block
    languagejs
    titleon element clicked
    /*Explanation: If the user clicks an element for the first time, the variable “step” is 0. 
    Because of this the StartIndex and the StartSeries are set to the clicked values. 
    After this the variable “step” is changed to “1”. If the user clicks on another element, 
    the EndIndex and the EndSeries are set to the clicked values. After this the variable “step” 
    is changed to “0” again, which means that the next click on an element will change the 
    StartIndex and the StartSeries again.*/
    
    if (step==0){
    	GRAPHOMATECHART_1.setHighlightStartIndex(GRAPHOMATECHART_1.getClickedElementIndex());	
    	GRAPHOMATECHART_1.setHighlightStartSeries(GRAPHOMATECHART_1.getClickedSeriesIndex());
    	step = 1;
    }
    else if (step==1){
    	GRAPHOMATECHART_1.setHighlightEndIndex(GRAPHOMATECHART_1.getClickedElementIndex());
    	GRAPHOMATECHART_1.setHighlightEndSeries(GRAPHOMATECHART_1.getClickedSeriesIndex());
    	step = 0;
    }

...