HTML5 - Get Category ID from Chart to call Item in Array (AWS)

1

Hello,

I have a HTML5-Barchart with 5 Categories and I want to add additional information in the tooltip using the tooltip formatter.

The additional information is stored in an array-variable (Type java.lang.String[]) and I can call the specific value by $V{variable1}[x] where x stands for the Item-position in the array.

Now I want to add a tooltip showing the corresponding value from the array. for example. When I mousover on the bar in category 1 it should return $V{variable1}[1] and When mousover on 3 it should return $V{variable1}[3]

How do I get the category number from HTML5 Charts to using this as a number to call the correct item in the array?

Does anyone has an idea? Would be really great!
Maybe there is another way to add addtional information in the tooltip?

Thanks,
Philipp

 

stegmann's picture
Joined: Jul 18 2013 - 6:50am
Last seen: 3 years 5 months ago

4 Answers:

0

I think I understand what you are looking for but correcty me if I'm off here.

Have you tried setting bucket properties? Similar to what you use for creating Hyperlinks (see: http://community.jaspersoft.com/wiki/how-do-i-set-chart-hyperlinks-html5...).

If you post a sample JRXML with some sample data or using the Jasper Sample database I may be able to help you more

 

marianol's picture
4575
Joined: Sep 13 2011 - 8:04am
Last seen: 10 months 3 weeks ago
0

My other post with attachment did not display here, so next try without attachment...:)

Hello,

this is a good idea.
I now created a new JRXML based on foodmart datasource with Month as Categories and Sales as Measures.
I want to include the "Quarter" information in the tooltip.

So i created:

<dataAxis axis="Rows">
                            <axisLevel name="month">
                                <labelExpression><![CDATA["month"]]></labelExpression>
                                <axisLevelBucket class="java.lang.Comparable">
                                    <bucketExpression><![CDATA[$F{month_of_year}]]></bucketExpression>
                                    <bucketProperty name="quarter"><![CDATA[$F{quarter}.toString()]]></bucketProperty>
                                </axisLevelBucket>
                            </axisLevel>
                        </dataAxis>

 

But how to integrate in tooltip?
The following did not work:

<hc:chartProperty name="tooltip.formatter">
                            <hc:propertyExpression><![CDATA["function() {return month.quarter ;}"]]></hc:propertyExpression>
</hc:chartProperty>
 

Any ideas?

Thanks a lot!

Philipp

stegmann's picture
Joined: Jul 18 2013 - 6:50am
Last seen: 3 years 5 months ago
0

does anyone have an idea? Thanks a lot!

stegmann's picture
Joined: Jul 18 2013 - 6:50am
Last seen: 3 years 5 months ago
2

FINALLY I solved the problem:

 

1. You need to define a Bucket Property on category level. I created one with the name "quarter".

                        <dataAxis axis="Rows">
                            <axisLevel name="month">
                                <labelExpression><![CDATA["month"]]></labelExpression>
                                <axisLevelBucket class="java.lang.Comparable">
                                    <bucketExpression><![CDATA[$F{month_of_year}]]></bucketExpression>
                                    <bucketProperty name="quarter"><![CDATA[$F{quarter}]]></bucketProperty>
                                </axisLevelBucket>
                            </axisLevel>
                        </dataAxis>

 

2. In the Series where the value should be visible you need to create a SeriesItemProperty (NOT SeriesProperty)

                    <hc:series name="Sales">
                        <hc:contributor name="SeriesItemProperty">
                            <hc:contributorProperty name="quarter" valueType="Bucket" value="month.quarter"/>
                        </hc:contributor>
                    </hc:series>

 

3. Then you can call the property in the tooltip, using the tooltip.formatter Chart Property

                       <hc:chartProperty name="tooltip.formatter">
                            <hc:propertyExpression><![CDATA["function() {return this.point.quarter}"]]></hc:propertyExpression>
                        </hc:chartProperty>

 

And now it works ! :)

 

stegmann's picture
Joined: Jul 18 2013 - 6:50am
Last seen: 3 years 5 months ago

It is excellent! Thank you.

kashoory - 5 years 1 month ago
Feedback
randomness