Forum Stats

  • 3,814,139 Users
  • 2,258,824 Discussions
  • 7,892,587 Comments

Discussions

How to change dvt:barChart bar width

kchemweno
kchemweno Member Posts: 92 Blue Ribbon
edited Jan 19, 2018 2:58AM in JDeveloper and ADF

Am using JDeveloper 12c on windows machine

Am working on a dvt:barChart that has groups.

I need to increase the width of the bars but am not able to do that at the moment.

How do I increase bar width. See my chart below;

votes.jpg

My code is below;

<dvt:barChart id="barChart2" var="row" title="Votes Per Elective Seat"

                                                              value="#{bindings.ElectionResultsView11.collectionModel}"

                                                              inlineStyle="width:900px;" coordinateSystem="cartesian"

                                                               barGapRatio="0.2">

                                                    <dvt:chartLegend id="cl2"/>

                                                    <f:facet name="dataStamp">

                                                        <dvt:chartDataItem id="di2" series="#{row.FullName}"

                                                                           value="#{row.VotesReceived}"

                                                                           group="#{row.Position}"/>

                                                    </f:facet>

   </dvt:barChart>

Tagged:

Answers

  • Timo Hahn
    Timo Hahn Senior Principal Technical Consultant - Oracle ACE Director Member, Moderator Posts: 38,234 Red Diamond
    edited Jan 18, 2018 8:21AM

    What do you get if you change the width property to e.g. 1200px

     inlineStyle="width:1200px;"

    All bars of all groups are visible, so the space for one bar is very small.

    Timo

  • kchemweno
    kchemweno Member Posts: 92 Blue Ribbon
    edited Jan 18, 2018 8:32AM

    The bar width have increased but the distance between the groups is  wide, I've tried tinkering with the BarGapRatio but no change. See the new chart below on applying your suggestion

    pastedImage_0.png

  • Timo Hahn
    Timo Hahn Senior Principal Technical Consultant - Oracle ACE Director Member, Moderator Posts: 38,234 Red Diamond
    edited Jan 18, 2018 8:58AM

    What do you get if you remove the width property?

    if you kkep hte inline style width, the space is controlled by hte barGraphRatio property. Try setting it to a smaler value (e.g. 0.05).

    Timo

  • kchemweno
    kchemweno Member Posts: 92 Blue Ribbon
    edited Jan 18, 2018 9:05AM

    I removed the width and tweaked the barGapRatio, the graphbecomes small and the bars thinner. See below;

    pastedImage_0.png

  • Timo Hahn
    Timo Hahn Senior Principal Technical Consultant - Oracle ACE Director Member, Moderator Posts: 38,234 Red Diamond
    edited Jan 18, 2018 9:44AM

    OK, which layout container (panelGridLayout or panelStetchLayout) is the bar graph in?

    Timo

  • Panagiotis Konstantinidis
    Panagiotis Konstantinidis Member Posts: 138 Bronze Badge
    edited Jan 18, 2018 10:17AM

    Hello,

    The dvt:barChart component stretches it's bars automatically depending on the width you assign to it. You can see that by increasing the width, as @Timo Hahn suggested.

    The issue here is that you have grouped your data per Elective Seat and per Person belonging to that seat. When rendering the chart the ADF Framework calculates the "distance" between each group (eg. "President" and "1st Vice President") and spaces the bars, belonging to each one of them, according to that "distance". The label for each group (eg. "President") is displayed in the middle of that "distance".

    The framework does that in order to increase readability as much as possible (which I agree is not always achieved).

    The point I am trying to make would be clearer if the X axis had numeric values instead of string values. For example, if we assume that "President"=20 and "1st Vice President"=10, the difference between them is 10 and that is your "distance". If you could manipulate the bars width independently, and later add a record between "President" and "1st Vice President" (eg. a record corresponding to the numeric value 15) then the bars would overlap.

    What you actually need to manipulate here is the aforementioned "distance" ratio and not the width of the bars, which is not possible, at least as far as I know.

    Cheers,

    Panagiotis

  • kchemweno
    kchemweno Member Posts: 92 Blue Ribbon
    edited Jan 18, 2018 11:52PM

    @Timo Hahn The barcChart is in a  panelGrid layout. I tried using the panel stretch layout as well but I did not see any much difference.

    @Panagiotis Konstantinidis I have changed the labels to be much shorter but I can't see any difference. See below

    pastedImage_0.png

  • Timo Hahn
    Timo Hahn Senior Principal Technical Consultant - Oracle ACE Director Member, Moderator Posts: 38,234 Red Diamond
    edited Jan 19, 2018 2:58AM

    Hm, can you provide a reproducible Test case built on HR DB schema?

    I like to look into this.

    Timo

This discussion has been closed.