Chart Legend doesn't resize when user resize browser and legend will get cut off.

[amit.vankadia]

We are using PieChart with Legend. We have some names which are longer and it renders beautifully when it is a fully maximized.

When user resize browser it gets cut off. Is there any way we can resize legend along with chart.

[sven]

Do you have a small testcase that implements EntryPoint and exactly demonstrates your problem?

I will move this thread to the bugs forum so we can take a look.

[amit.vankadia]

Browser resizing doesn't behave smoothly with legend.

public class MySampleApplication implements IsWidget, EntryPoint {


    @Override
    public Widget asWidget() {
        // reduce the padding on text element as we have widgets in the cells
        ListStore<String> store = new ListStore<String>(new ModelKeyProvider<String>() {
            @Override
            public String getKey(String item) {
                return item;
            }
        });


        store.add("Testing Testing");
        store.add("Testing DEF");
        store.add("ABC Testing");
        store.add("Testing ABC");




        Chart<String> qualityMetricsChart = new Chart<String>();
        qualityMetricsChart.bindStore(store);
        qualityMetricsChart.setDefaultInsets(50);
        qualityMetricsChart.setShadowChart(true);


        final PieSeries<String> series = new PieSeries<String>();
        series.setAngleField(new ValueProvider<String, Number>() {
            @Override
            public Number getValue(String object) {
                return Math.random();
            }


            @Override
            public void setValue(String object, Number value) {


            }


            @Override
            public String getPath() {
                return "ABC";
            }
        });


        TextSprite textConfig = new TextSprite();
        textConfig.setTextBaseline(TextSprite.TextBaseline.MIDDLE);
        textConfig.setTextAnchor(TextSprite.TextAnchor.MIDDLE);
        textConfig.setFontSize(18);
        textConfig.setZIndex(15);


        SeriesLabelConfig<String> labelConfig = new SeriesLabelConfig<String>();
        labelConfig.setSpriteConfig(textConfig);
        labelConfig.setLabelPosition(Series.LabelPosition.START);
        labelConfig.setValueProvider(new ToStringValueProvider<String>(), new StringLabelProvider<String>());


        series.setLabelConfig(labelConfig);
        series.setDonut(35);
        series.setHighlighting(true);
        series.setLegendValueProvider(new ToStringValueProvider<String>(), new StringLabelProvider<String>());


        qualityMetricsChart.addSeries(series);


        addColorToChart(series, "slice1", "#94AE0A");
        addColorToChart(series, "slice2", "#115FA6");
        addColorToChart(series, "slice3", "#A61120");
        addColorToChart(series, "slice4", "#FF8809");


        final Legend<String> legend = new Legend<String>();
        legend.setItemHighlighting(true);


        qualityMetricsChart.setLegend(legend);


        BorderLayoutContainer c = new BorderLayoutContainer();
        c.setCenterWidget(qualityMetricsChart);


        Viewport port = new Viewport();
        port.setWidget(qualityMetricsChart);


        return port;
    }


    private void addColorToChart(PieSeries<String> series, String name, String color) {
        Gradient gradient = new Gradient(name, 45);
        gradient.addStop(new Stop(0, new RGB(color)));
        Chart<String> chart = series.getChart();
        chart.addGradient(gradient);
        series.addColor(gradient);
    }


    @Override
    public void onModuleLoad() {
        RootPanel.get().add(asWidget());
    }
}

[BrendanC]

I moved this out of the bug forums as it is more of a feature request. Currently legend only updates its position based on the chart insets and size, while the legend size is determined by what is inside of it. I will keep the ticket as a possible feature in a future release. For the time being you could make a workaround where you set the length of the series legend titles based on the size of the chart.