Data values need to display over bar (Facetchart)

[vnathank]

Hi Isomorphic,

I am using SmartGWT Pro 12.0

I am working on Facetchart

Requirement : Data values for chart need to display over bars. As show in below screenshot


Kindly let me know how to solve this issue

Thank you.

[Isomorphic]

There is a showDataValues property, but the appearance is different from what you show here. If you need the exact appearance you have here, you can draw the data values yourself - please see the Adding Extra Elements chart sample.

[vnathank]

Hi Isomorphic,

Thanks for your confirmation.
As per my understanding "setShowDataValues" property will display the values during "On mouse over" event.

But our requirement is, the value should be displayed permanent for all bars at the same time.

>> please see the Adding Extra Elements chart sample.
As per my understanding, you mean the following sample.
https://www.smartclient.com/smartgwt...ingNewElements

To display the value for each bar (say if I have some 100 bars displayed), it requires to add more controls over the graph & calculation for position is required.
Is it correct ?

Thank you.

[Isomorphic]

Correct.

[Isomorphic]

Hi Isomorphic,
Thanks for your confirmation.
As per my understanding "setShowDataValues" property will display the values during "On mouse over" event.

Actually, as per our documentation for setShowDataValues(), it should show all of the values permanently on the chart unless there's not room to do so - i.e. data regions are too small to render all of the numerical values at the right spot. That's when we fall back to showing the values upon hover.

If you rebuild the Simple Chart sample with the getViewPanel() replaced with the below version, you'll see what the built-in support for this feature looks like.

    public Canvas getViewPanel() {
        final FacetChart chart = new FacetChart();
        chart.setHeight(600);
        chart.setShowDataValues(true);
        chart.setStacked(false);
        chart.setData(SimpleChartData.getData());
        chart.setFacets(new Facet("region", "Region"), new Facet("product", "Product"));
        chart.setValueProperty("sales");
        chart.setChartType(ChartType.BAR);
        chart.setTitle("Sales by Product and Region");
        return chart;
    }

As comment #2 above states, the appearance is different than your artist's conception - the numbers are drawn outside the bar, not inside

[vnathank]

Hi Isomorphic,

Thanks for your confirmation.