Examples with PlotBand com.vaadin.flow.component.charts.model.PlotBand used on opensource projects

Example 1 with PlotBand

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

the class Gauge method initDemo.

@Override
public void initDemo() {
    // NOSONAR
    final Random random = new Random(0);
    final Chart chart = new Chart();
    final Configuration configuration = chart.getConfiguration();
    configuration.getChart().setType(ChartType.GAUGE);
    configuration.setTitle("Speedometer");
    configuration.getChart().setWidth(500);
    Pane pane = configuration.getPane();
    pane.setStartAngle(-150);
    pane.setEndAngle(150);
    YAxis yAxis = new YAxis();
    yAxis.setTitle("km/h");
    yAxis.setMin(0);
    yAxis.setMax(200);
    yAxis.setTickLength(10);
    yAxis.setTickPixelInterval(30);
    yAxis.setTickPosition(TickPosition.INSIDE);
    yAxis.setMinorTickLength(10);
    yAxis.setMinorTickInterval("auto");
    yAxis.setMinorTickPosition(TickPosition.INSIDE);
    Labels labels = new Labels();
    labels.setStep(2);
    labels.setRotation("auto");
    yAxis.setLabels(labels);
    PlotBand[] bands = new PlotBand[3];
    bands[0] = new PlotBand();
    bands[0].setFrom(0);
    bands[0].setTo(120);
    bands[0].setClassName("band-0");
    bands[1] = new PlotBand();
    bands[1].setFrom(120);
    bands[1].setTo(160);
    bands[1].setClassName("band-1");
    bands[2] = new PlotBand();
    bands[2].setFrom(160);
    bands[2].setTo(200);
    bands[2].setClassName("band-2");
    yAxis.setPlotBands(bands);
    configuration.addyAxis(yAxis);
    final ListSeries series = new ListSeries("Speed", 89);
    PlotOptionsGauge plotOptionsGauge = new PlotOptionsGauge();
    SeriesTooltip tooltip = new SeriesTooltip();
    tooltip.setValueSuffix(" km/h");
    plotOptionsGauge.setTooltip(tooltip);
    series.setPlotOptions(plotOptionsGauge);
    configuration.addSeries(series);
    runWhileAttached(chart, () -> {
        Integer oldValue = series.getData()[0].intValue();
        Integer newValue = (int) (oldValue + (random.nextDouble() - 0.5) * 20.0);
        series.updatePoint(0, newValue);
    }, 5000, 12000);
    add(chart);
}

Example 2 with PlotBand

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

the class AreaSpline method initDemo.

@Override
public void initDemo() {
    Chart chart = new Chart(ChartType.AREASPLINE);
    Configuration conf = chart.getConfiguration();
    conf.setTitle(new Title("Average fruit consumption during one week"));
    Legend legend = new Legend();
    legend.setLayout(LayoutDirection.VERTICAL);
    legend.setAlign(HorizontalAlign.LEFT);
    legend.setFloating(true);
    legend.setVerticalAlign(VerticalAlign.TOP);
    legend.setX(150);
    legend.setY(100);
    conf.setLegend(legend);
    XAxis xAxis = new XAxis();
    xAxis.setCategories(new String[] { "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday" });
    PlotBand plotBand = new PlotBand(4.5, 6.5, SolidColor.BLUE);
    plotBand.setZIndex(1);
    xAxis.setPlotBands(plotBand);
    conf.addxAxis(xAxis);
    YAxis yAxis = new YAxis();
    yAxis.setTitle(new AxisTitle("Fruit units"));
    conf.addyAxis(yAxis);
    Tooltip tooltip = new Tooltip();
    // Customize tooltip formatting
    tooltip.setShared(true);
    tooltip.setValueSuffix(" units");
    conf.setTooltip(tooltip);
    PlotOptionsArea plotOptions = new PlotOptionsArea();
    conf.setPlotOptions(plotOptions);
    ListSeries o = new ListSeries("John", 3, 4, 3, 5, 4, 10);
    // You can also add values separately
    o.addData(12);
    conf.addSeries(o);
    conf.addSeries(new ListSeries("Jane", 1, 3, 4, 3, 3, 5, 4));
    add(chart);
}

Example 3 with PlotBand

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

the class Bullet method createBulletChart.

/**
 * Create a bullet chart with shared configuration
 *
 * @param plotBandY1
 *            "from" value for the first plotband
 * @param plotBandY2
 *            "to" value for the first plotband and "from" value for the
 *            second plotband
 * @param plotBandY3
 *            "to" value for the second plotband and "from" value for the
 *            third plotband
 * @param plotBandY4
 *            "to" value for the third plotband
 * @param y
 *            Y value for the series item
 * @param target
 *            Target value for the series item
 * @param category
 *            Title to be used in the category
 * @return Chart with shared configuration
 */
private Chart createBulletChart(Number plotBandY1, Number plotBandY2, Number plotBandY3, Number plotBandY4, Number y, Number target, String category) {
    Chart chart = new Chart(ChartType.BULLET);
    chart.setHeight("85px");
    Configuration conf = chart.getConfiguration();
    conf.getChart().setInverted(true);
    conf.getChart().setMarginLeft(135);
    conf.getLegend().setEnabled(false);
    YAxis yAxis = conf.getyAxis();
    yAxis.setGridLineWidth(0);
    yAxis.setTitle("");
    yAxis.addPlotBand(new PlotBand(plotBandY1, plotBandY2, new SolidColor("#666666")));
    yAxis.addPlotBand(new PlotBand(plotBandY2, plotBandY3, new SolidColor("#999999")));
    yAxis.addPlotBand(new PlotBand(plotBandY3, plotBandY4, new SolidColor("#bbbbbb")));
    conf.getxAxis().addCategory(category);
    conf.getTooltip().setPointFormat("<b>{point.y}</b> (with target at {point.target})");
    PlotOptionsBullet options = new PlotOptionsBullet();
    options.setPointPadding(0.25);
    options.setBorderWidth(0);
    options.setColor(SolidColor.BLACK);
    options.getTargetOptions().setWidth("200%");
    conf.setExporting(false);
    DataSeries series = new DataSeries();
    series.add(new DataSeriesItemBullet(y, target));
    series.setPlotOptions(options);
    conf.addSeries(series);
    return chart;
}