Search in sources :

Example 1 with DataSeriesItem

use of com.vaadin.flow.component.charts.model.DataSeriesItem in project flow-components by vaadin.

the class Pyramid method initDemo.

@Override
public void initDemo() {
    Chart chart = new Chart(ChartType.PYRAMID);
    Configuration configuration = chart.getConfiguration();
    configuration.setTitle("Sales pyramid");
    configuration.getLegend().setEnabled(false);
    PlotOptionsPyramid plotOptionsSeries = new PlotOptionsPyramid();
    DataLabelsFunnel dataLabels = plotOptionsSeries.getDataLabels();
    dataLabels.setEnabled(true);
    dataLabels.setSoftConnector(true);
    dataLabels.setFormat("<b>{point.name}</b> ({point.y:,.0f})");
    plotOptionsSeries.setCenter("40%", "50%");
    plotOptionsSeries.setWidth("60%");
    configuration.setPlotOptions(plotOptionsSeries);
    DataSeries series = new DataSeries("Unique users");
    series.add(new DataSeriesItem("Website visits", 15654));
    series.add(new DataSeriesItem("Downloads", 4064));
    series.add(new DataSeriesItem("Requested price list", 1987));
    series.add(new DataSeriesItem("Invoice sent", 976));
    series.add(new DataSeriesItem("Finalized", 846));
    configuration.addSeries(series);
    add(chart);
}
Also used : DataLabelsFunnel(com.vaadin.flow.component.charts.model.DataLabelsFunnel) Configuration(com.vaadin.flow.component.charts.model.Configuration) PlotOptionsPyramid(com.vaadin.flow.component.charts.model.PlotOptionsPyramid) DataSeries(com.vaadin.flow.component.charts.model.DataSeries) Chart(com.vaadin.flow.component.charts.Chart) DataSeriesItem(com.vaadin.flow.component.charts.model.DataSeriesItem)

Example 2 with DataSeriesItem

use of com.vaadin.flow.component.charts.model.DataSeriesItem in project flow-components by vaadin.

the class SolidGauge method initDemo.

@Override
public void initDemo() {
    Chart chart = new Chart(ChartType.SOLIDGAUGE);
    Configuration configuration = chart.getConfiguration();
    Pane pane = configuration.getPane();
    pane.setCenter(new String[] { "50%", "50%" });
    pane.setStartAngle(-90);
    pane.setEndAngle(90);
    Background paneBackground = new Background();
    paneBackground.setInnerRadius("60%");
    paneBackground.setOuterRadius("100%");
    paneBackground.setShape(BackgroundShape.ARC);
    pane.setBackground(paneBackground);
    YAxis yAxis = configuration.getyAxis();
    yAxis.setTickAmount(2);
    yAxis.setTitle("Speed");
    yAxis.setMinorTickInterval("null");
    yAxis.getTitle().setY(-50);
    yAxis.getLabels().setY(16);
    yAxis.setMin(0);
    yAxis.setMax(200);
    PlotOptionsSolidgauge plotOptionsSolidgauge = new PlotOptionsSolidgauge();
    DataLabels dataLabels = plotOptionsSolidgauge.getDataLabels();
    dataLabels.setY(5);
    dataLabels.setUseHTML(true);
    configuration.setPlotOptions(plotOptionsSolidgauge);
    DataSeries series = new DataSeries("Speed");
    DataSeriesItem item = new DataSeriesItem();
    item.setY(80);
    // item.setColorIndex(2);
    item.setClassName("myClassName");
    DataLabels dataLabelsSeries = new DataLabels();
    dataLabelsSeries.setFormat("<div style=\"text-align:center\"><span style=\"font-size:25px;" + "color:black' + '\">{y}</span><br/>" + "<span style=\"font-size:12px;color:silver\">km/h</span></div>");
    item.setDataLabels(dataLabelsSeries);
    series.add(item);
    configuration.addSeries(series);
    add(chart);
}
Also used : DataLabels(com.vaadin.flow.component.charts.model.DataLabels) Configuration(com.vaadin.flow.component.charts.model.Configuration) Background(com.vaadin.flow.component.charts.model.Background) DataSeries(com.vaadin.flow.component.charts.model.DataSeries) Pane(com.vaadin.flow.component.charts.model.Pane) PlotOptionsSolidgauge(com.vaadin.flow.component.charts.model.PlotOptionsSolidgauge) Chart(com.vaadin.flow.component.charts.Chart) DataSeriesItem(com.vaadin.flow.component.charts.model.DataSeriesItem) YAxis(com.vaadin.flow.component.charts.model.YAxis)

Example 3 with DataSeriesItem

use of com.vaadin.flow.component.charts.model.DataSeriesItem in project flow-components by vaadin.

the class WaterfallChart method initDemo.

@Override
public void initDemo() {
    Chart chart = new Chart(ChartType.WATERFALL);
    DataSeries dataSeries = new DataSeries();
    dataSeries.add(new DataSeriesItem("Start", 120000));
    dataSeries.add(new DataSeriesItem("Product Revenue", 569000));
    dataSeries.add(new DataSeriesItem("Service Revenue", 231000));
    WaterFallSum positiveBalance = new WaterFallSum("Positive Balance");
    positiveBalance.setIntermediate(true);
    dataSeries.add(positiveBalance);
    dataSeries.add(new DataSeriesItem("Fixed Costs", -342000));
    dataSeries.add(new DataSeriesItem("Variable Costs", -233000));
    WaterFallSum balance = new WaterFallSum("Balance");
    dataSeries.add(balance);
    PlotOptionsWaterfall opts = new PlotOptionsWaterfall();
    DataLabels dataLabels = new DataLabels(true);
    dataLabels.setVerticalAlign(VerticalAlign.TOP);
    dataLabels.setY(-30);
    dataLabels.setFormatter("function() { return this.y / 1000 + 'k'; }");
    opts.setDataLabels(dataLabels);
    dataSeries.setPlotOptions(opts);
    Configuration configuration = chart.getConfiguration();
    configuration.addSeries(dataSeries);
    configuration.getxAxis().setType(AxisType.CATEGORY);
    add(chart);
}
Also used : DataLabels(com.vaadin.flow.component.charts.model.DataLabels) Configuration(com.vaadin.flow.component.charts.model.Configuration) PlotOptionsWaterfall(com.vaadin.flow.component.charts.model.PlotOptionsWaterfall) DataSeries(com.vaadin.flow.component.charts.model.DataSeries) WaterFallSum(com.vaadin.flow.component.charts.model.WaterFallSum) Chart(com.vaadin.flow.component.charts.Chart) DataSeriesItem(com.vaadin.flow.component.charts.model.DataSeriesItem)

Example 4 with DataSeriesItem

use of com.vaadin.flow.component.charts.model.DataSeriesItem in project flow-components by vaadin.

the class SVGGeneratorTest method exportWithTimeline.

@Test
public void exportWithTimeline() throws IOException, InterruptedException {
    Configuration configuration = new Configuration();
    configuration.getChart().setType(ChartType.AREASPLINERANGE);
    configuration.getTitle().setText("Temperature variation by day");
    Tooltip tooltip = configuration.getTooltip();
    tooltip.setValueSuffix("°C");
    DataSeries dataSeries = new DataSeries("Temperatures");
    for (StockPrices.RangeData data : StockPrices.fetchDailyTempRanges()) {
        dataSeries.add(new DataSeriesItem(data.getDate(), data.getMin(), data.getMax()));
    }
    configuration.setSeries(dataSeries);
    ExportOptions options = new ExportOptions();
    options.setTimeline(true);
    Path expectedFilePath = Paths.get("src", "test", "resources", "timeline.svg");
    String expectedSVG = readUtf8File(expectedFilePath);
    String actualSVG = svgGenerator.generate(configuration, options);
    assertEquals(replaceIds(expectedSVG), replaceIds(actualSVG));
}
Also used : Path(java.nio.file.Path) Configuration(com.vaadin.flow.component.charts.model.Configuration) Tooltip(com.vaadin.flow.component.charts.model.Tooltip) DataSeries(com.vaadin.flow.component.charts.model.DataSeries) DataSeriesItem(com.vaadin.flow.component.charts.model.DataSeriesItem) Test(org.junit.Test)

Example 5 with DataSeriesItem

use of com.vaadin.flow.component.charts.model.DataSeriesItem in project flow-components by vaadin.

the class PieWithLegend method initDemo.

@Override
public void initDemo() {
    chart = new Chart(ChartType.PIE);
    Configuration conf = chart.getConfiguration();
    conf.setTitle("Browser market shares in January, 2018");
    Tooltip tooltip = new Tooltip();
    tooltip.setValueDecimals(1);
    conf.setTooltip(tooltip);
    PlotOptionsPie plotOptions = new PlotOptionsPie();
    plotOptions.setAllowPointSelect(true);
    plotOptions.setCursor(Cursor.POINTER);
    plotOptions.setShowInLegend(true);
    conf.setPlotOptions(plotOptions);
    DataSeries series = new DataSeries();
    DataSeriesItem chrome = new DataSeriesItem("Chrome", 61.41);
    chrome.setSliced(true);
    chrome.setSelected(true);
    series.add(chrome);
    series.add(new DataSeriesItem("Internet Explorer", 11.84));
    series.add(new DataSeriesItem("Firefox", 10.85));
    series.add(new DataSeriesItem("Edge", 4.67));
    series.add(new DataSeriesItem("Safari", 4.18));
    series.add(new DataSeriesItem("Sogou Explorer", 1.64));
    series.add(new DataSeriesItem("Opera", 6.2));
    series.add(new DataSeriesItem("QQ", 1.2));
    series.add(new DataSeriesItem("Others", 2.61));
    conf.setSeries(series);
    chart.setVisibilityTogglingDisabled(true);
    listenerRegistration = chart.addPointLegendItemClickListener(event -> {
        showNotification("Legend item click" + " : " + event.getItemIndex() + " : " + event.getItem().getName());
    });
    add(chart);
}
Also used : DataSeriesItem(com.vaadin.flow.component.charts.model.DataSeriesItem) ChartType(com.vaadin.flow.component.charts.model.ChartType) Tooltip(com.vaadin.flow.component.charts.model.Tooltip) Chart(com.vaadin.flow.component.charts.Chart) Registration(com.vaadin.flow.shared.Registration) PlotOptionsPie(com.vaadin.flow.component.charts.model.PlotOptionsPie) DataSeries(com.vaadin.flow.component.charts.model.DataSeries) AbstractChartExample(com.vaadin.flow.component.charts.examples.AbstractChartExample) Cursor(com.vaadin.flow.component.charts.model.Cursor) Configuration(com.vaadin.flow.component.charts.model.Configuration) PlotOptionsPie(com.vaadin.flow.component.charts.model.PlotOptionsPie) Configuration(com.vaadin.flow.component.charts.model.Configuration) Tooltip(com.vaadin.flow.component.charts.model.Tooltip) DataSeries(com.vaadin.flow.component.charts.model.DataSeries) Chart(com.vaadin.flow.component.charts.Chart) DataSeriesItem(com.vaadin.flow.component.charts.model.DataSeriesItem)

Aggregations

DataSeriesItem (com.vaadin.flow.component.charts.model.DataSeriesItem)29 DataSeries (com.vaadin.flow.component.charts.model.DataSeries)26 Chart (com.vaadin.flow.component.charts.Chart)20 Configuration (com.vaadin.flow.component.charts.model.Configuration)20 XAxis (com.vaadin.flow.component.charts.model.XAxis)10 YAxis (com.vaadin.flow.component.charts.model.YAxis)10 Tooltip (com.vaadin.flow.component.charts.model.Tooltip)9 DataLabels (com.vaadin.flow.component.charts.model.DataLabels)6 PlotOptionsColumn (com.vaadin.flow.component.charts.model.PlotOptionsColumn)5 StockPrices (com.vaadin.flow.component.charts.examples.timeline.util.StockPrices)4 AbstractChartExample (com.vaadin.flow.component.charts.examples.AbstractChartExample)3 ChartType (com.vaadin.flow.component.charts.model.ChartType)3 DataLabelsFunnel (com.vaadin.flow.component.charts.model.DataLabelsFunnel)3 PlotLine (com.vaadin.flow.component.charts.model.PlotLine)3 PlotOptionsPie (com.vaadin.flow.component.charts.model.PlotOptionsPie)3 PlotOptionsScatter (com.vaadin.flow.component.charts.model.PlotOptionsScatter)3 RangeSelector (com.vaadin.flow.component.charts.model.RangeSelector)3 AxisTitle (com.vaadin.flow.component.charts.model.AxisTitle)2 Cursor (com.vaadin.flow.component.charts.model.Cursor)2 Legend (com.vaadin.flow.component.charts.model.Legend)2