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; } } }

Scripting tooltip/cursor for areaseries

johnh

Hi All,

I'm currently scripting tooltips for a set of stacked areaseries in a chart and am having issues with displaying text values.

I've coded the following:

ttv = TooltipValueImpl.create( 200,gData.get(i)[gData.get(i).size()-2] ); // gData contains text
a = ActionImpl.create( ActionType.SHOW_TOOLTIP_LITERAL,ttv );
t = TriggerImpl.create( TriggerCondition.ONMOUSEOVER_LITERAL,a );
seriesCategory.getTriggers().add( t );

The tooltip displays the data point value rather than the source text (similar to using 'null')

I'm also attempting to change the cursor to a crosshair, as follows:

seriesCategory.getCursor().setType(CursorType.CROSSHAIR);

This code currently results in a 'TypeError: Cannot call method "setType" of null ...'

Lastly, I'm deploying to both Win/XP and Linux 2.6.1 runtimes - Linux doesn't display my tooltips

Has anyone experienced any of these issues and/or know of any better methods?

Thanks

John

Find more posts tagged with

Comments

JasonW

John,

Can you post a report that runs that illustrates the issues? Use either a scripted dataset or the sample db.
I imagine this is null gData.get(i)[gData.get(i).size()-2]

Jason

johnh

Thanks, Jason

Certainly, please review the attached and let me know of any questions/comments.

John

JasonW

I am still looking at this but I believe this is a bug in the tooltip code. I tried it a different way and it appears to work. I put the following in the loop. Note that I added the trigger to the runtime series. Also I used the evt.fromElement which you will need to test on the different browsers.

mystr = "gd["+i+"]:"+gData.get(i)[gData.get(i).size()-2];
sv = ScriptValueImpl.create("evt.fromElement.title=\""+mystr+"\";");
//sv = ScriptValueImpl.create("alert(\"" + mystr + "\");");
a = ActionImpl.create( ActionType.INVOKE_SCRIPT_LITERAL ,sv );
//a = ActionImpl.create( ActionType.HIGHLIGHT_LITERAL,sv );
t = TriggerImpl.create( TriggerCondition.ONMOUSEOVER_LITERAL,a );
seriesCategory.getTriggers().add( t );
//seriesCategory.getCursor().setType(CursorType.CROSSHAIR);
//ySeriesDef.getSeries().clear();
ySeriesDef.getSeries().add( seriesCategory );
ySeriesDef.getRunTimeSeries().get(0).getTriggers().add(t);

Jason

johnh

Thanks, Jason - this works!

Do you happen to know of any way to obtain the underlying series or index value? I'm interested in constructing a composite msg something like '<series identifier> : <display value>'.

Thanks!

John

JasonW

John see this blog:
http://birtworld.blogspot.com/2010/05/more-on-chart-interactivity.html and use code like:
sv = ScriptValueImpl.create("evt.fromElement.title=categoryData +\"--\"+valueData;");

Jason

johnh

Hi Jason - this works great, thanks!

I'm now working on altering the cursor style - trying something similar.

A couple of questions:

1) advisable to use a javascript approach for this?

2) possible to add multiple actions/triggers to a series (both tooltip and cursor change on onmouseover)

Thanks for the help!

John

JasonW

John,

Sorry for the delay. I modified the above script to work with ie and firefox and change the cursor.

sv = ScriptValueImpl.create("if( evt.relatedTarget !=null){relTarg=evt.relatedTarget.parentNode;}else{relTarg=evt.fromElement;}relTarg.title=categoryData +\"--\"+valueData;relTarg.style.cursor='crosshair';");

Jason

johnh

Hi Jason,

So sorry for my delayed response - out sick/rsv.

Thank you for this really great solution - deploys wonderfully!

I'm now working on handling onmouseout events for the related cursor undo & taking a similar approach.

Do you have any thoughts/ideas? Thanks for the excellent help!

John