nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Change X-axis title dynamically

sarika.np

I am creating a chart based report. The X-axis is grouped dynamically like Month, Quarter and Weeks based on the input parameter. I want to change the X-axis title based on the grouping like Monthwise View, Quaterly View or Weekly View. How can I achieve this dynamically using script.

Find more posts tagged with

Comments

pricher

Sarika,

You can add the following code to the onRender event of the chart:

importPackage( Packages.org.eclipse.birt.chart.model.attribute.impl );

function beforeGeneration( chart, icsc )
{
xAxis = chart.getBaseAxes()[0];

newTitle = icsc.getExternalContext().getScriptable().getPersistentGlobalVariable("g_AxisTitle");
xAxis.getTitle().getCaption().setValue(newTitle);

}

Notice that the "g_AxisTitle" is a persistent global variable that you need to create from your parameter value because the parameter value is not available on the onRender event. The easiest way to create a persistent global variable will be to add that line in the initialize() event of your report:

reportContext.setPersistentGlobalVariable("g_AxisTitle", reportContext.getParameterValue("pAxisTitle"));

I am attaching a complete example.

P.

sarika.np

Thanks a lot. It works fine.

mogwai

<p>Hi Pierre. I hope you're still following this topic. I need to do something similar, except that the axis title does not come from a parameter.</p>
<p>The line chart sits in a table group header and loops. The axis title now depends on the data value of the group variable. How do I access the value of the group variable (in this case row["method"]) in the code?</p>

pricher

<p>Hi,</p>
<p> </p>
<p>Because the data set is not available at chart generation, you will need to store the value of each group in a persistent global variable. The extra difficulty is that ALL your group headers will be evaluated before the charts, so you actually need to store all the values in an array. So, the scripting looks now like this:</p>
<p> </p>
<p>In the report's initialize, instantiate an ArrayList:</p>
<pre class="_prettyXprint _lang-">
axisTitle = new java.util.ArrayList();
</pre>
<p>Then add a data item to the group header and override its onCreate method:</p>
<pre class="_prettyXprint _lang-">
axisTitle.add(this.getValue());
reportContext.setPersistentGlobalVariable("g_AxisTitle",axisTitle);
</pre>
<p>Finally, add the following script to the beforeGeneration in the chart:</p>
<pre class="_prettyXprint _lang-">
function beforeGeneration( chart, icsc )
{
xAxis = chart.getBaseAxes()[0];
array = icsc.getExternalContext().getScriptable().getPersistentGlobalVariable("g_AxisTitle");
newTitle = array.get(0);
array.remove(0);
icsc.getExternalContext().getScriptable().setPersistentGlobalVariable("g_AxisTitle", array);
xAxis.getTitle().getCaption().setValue(newTitle);
}
</pre>
<p>I have attached a modified example.</p>
<p> </p>
<p>Hope this helps,</p>
<p> </p>
<p>P.</p>

mogwai

<p>Thanks Pierre. This works perfectly for the X-axis. I expected it to be straightforward to modify the code to use on the Y-axis but I'm not familiar with getBaseAxes(). </p>
<p>Also, I don't get it to switch properly. This is my code:</p>
<p> </p>
<div>function beforeGeneration( chart, icsc )</div>
<div>{</div>
<div> </div>
<div>xAxis = chart.getBaseAxes()[0];</div>
<div>array = icsc.getExternalContext().getScriptable().getPersistentGlobalVariable("g_AxisTitle");</div>
<div> </div>
<div>newTitle = array.get(0);</div>
<div>array.remove(0);</div>
<div>switch(newTitle)</div>
<div>{</div>
<div>case "Canada": </div>
<div>case "UK": </div>
<div>newTitle = "Common Wealth"; </div>
<div>break;</div>
<div>case "France":</div>
<div>break;</div>
<div>default: newTitle = "This is strange";</div>
<div>}</div>
<div>icsc.getExternalContext().getScriptable().setPersistentGlobalVariable("g_AxisTitle", array);</div>
<div>xAxis.getTitle().getCaption().setValue(newTitle);</div>
<div> </div>
<div>}</div>
<div> </div>
<div>The code always returns the default value.</div>
<p>Some help please

.</p>

pricher

<p>Hi,</p>
<p> </p>
<p>The revised code below fixes the two issues. I have added some comments to explain:</p>
<pre class="_prettyXprint _lang-js">
function beforeGeneration( chart, icsc )
{
xAxis = chart.getBaseAxes()[0];
yAxis = chart.getOrthogonalAxes( xAxis, true)[0]; // Call to get the first Y-Axis
array = icsc.getExternalContext().getScriptable().getPersistentGlobalVariable("g_AxisTitle");
newTitle = array.get(0) + ""; // Need to convert 'newTitle' to a String by concatenating a empty string. Otherwise the switch will not work as 'newTitle' is of type object
array.remove(0);
switch(newTitle)
{
case "Canada":
case "UK":
newTitle = "Common Wealth";
Packages.java.lang.System.out.println("newTitle=" + newTitle);
break;
case "France":
Packages.java.lang.System.out.println("newTitle=" + newTitle);
break;
default:
newTitle = "This is strange";
Packages.java.lang.System.out.println("newTitle=" + newTitle);
}

icsc.getExternalContext().getScriptable().setPersistentGlobalVariable("g_AxisTitle", array);
xAxis.getTitle().getCaption().setValue(newTitle);
yAxis.getTitle().getCaption().setValue(newTitle);
}

</pre>
<p>Hope this helps,</p>
<p> </p>
<p>P.</p>

mogwai

<p>That fixes everything. Thanks Pierre. And thanks for the comments in the code.</p>