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

Example 26 with YAxis

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

the class SplineUpdatingEachSecond method initDemo.

@Override
public void initDemo() {
    // NOSONAR
    final Random random = new Random();
    final Chart chart = new Chart();
    final Configuration configuration = chart.getConfiguration();
    configuration.getChart().setType(ChartType.SPLINE);
    configuration.getTitle().setText("Live random data");
    XAxis xAxis = configuration.getxAxis();
    xAxis.setType(AxisType.DATETIME);
    xAxis.setTickPixelInterval(150);
    YAxis yAxis = configuration.getyAxis();
    yAxis.setTitle(new AxisTitle("Value"));
    configuration.getTooltip().setEnabled(false);
    configuration.getLegend().setEnabled(false);
    final DataSeries series = new DataSeries();
    series.setPlotOptions(new PlotOptionsSpline());
    series.setName("Random data");
    for (int i = -19; i <= 0; i++) {
        series.add(new DataSeriesItem(System.currentTimeMillis() + i * 1000, random.nextDouble()));
    }
    configuration.setSeries(series);
    runWhileAttached(chart, () -> {
        final long x = System.currentTimeMillis();
        final double y = random.nextDouble();
        series.add(new DataSeriesItem(x, y), true, true);
    }, 1000, 1000);
    add(chart);
}

Example 27 with YAxis

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

the class BoxPlot method initDemo.

@Override
public void initDemo() {
    final Chart chart = new Chart();
    chart.getConfiguration().setTitle("Box Plot Example");
    Legend legend = new Legend();
    legend.setEnabled(false);
    chart.getConfiguration().setLegend(legend);
    XAxis xaxis = chart.getConfiguration().getxAxis();
    xaxis.setTitle("Experiment No.");
    xaxis.setCategories("1", "2", "3", "4", "5");
    YAxis yAxis = chart.getConfiguration().getyAxis();
    yAxis.setTitle("Observations");
    PlotLine plotLine = new PlotLine();
    plotLine.setValue(932);
    plotLine.setZIndex(0);
    Label label = new Label("Theoretical mean: 932");
    label.setAlign(HorizontalAlign.CENTER);
    plotLine.setLabel(label);
    yAxis.setPlotLines(plotLine);
    final DataSeries observations = new DataSeries();
    observations.setName("Observations");
    // Add PlotBoxItems contain all fields relevant for plot box chart
    observations.add(new BoxPlotItem(760, 801, 848, 895, 965));
    // Example with no arg constructor
    BoxPlotItem plotBoxItem = new BoxPlotItem();
    plotBoxItem.setLow(733);
    plotBoxItem.setLowerQuartile(853);
    plotBoxItem.setMedian(939);
    plotBoxItem.setUpperQuartile(980);
    plotBoxItem.setHigh(1080);
    observations.add(plotBoxItem);
    observations.add(new BoxPlotItem(714, 762, 817, 870, 918));
    observations.add(new BoxPlotItem(724, 802, 806, 871, 950));
    observations.add(new BoxPlotItem(834, 836, 864, 882, 910));
    PlotOptionsBoxplot plotOptions = new PlotOptionsBoxplot();
    SeriesTooltip observationsTooltip = new SeriesTooltip();
    observationsTooltip.setHeaderFormat("<em>Experiment No {point.key}</em><br/>");
    plotOptions.setTooltip(observationsTooltip);
    observations.setPlotOptions(plotOptions);
    chart.getConfiguration().addSeries(observations);
    final DataSeries outlier = new DataSeries();
    outlier.setName("Outlier");
    outlier.add(new DataSeriesItem(0, 644));
    outlier.add(new DataSeriesItem(4, 718));
    outlier.add(new DataSeriesItem(4, 951));
    outlier.add(new DataSeriesItem(4, 969));
    PlotOptionsScatter outlierOptions = new PlotOptionsScatter();
    SeriesTooltip outlierTooltip = new SeriesTooltip();
    outlierTooltip.setPointFormat("Observation: {point.y}");
    outlierOptions.setTooltip(outlierTooltip);
    outlier.setPlotOptions(outlierOptions);
    chart.getConfiguration().addSeries(outlier);
    Checkbox useCustomStyles = new Checkbox("Use custom styling");
    useCustomStyles.addValueChangeListener(e -> {
        PlotOptionsBoxplot options = new PlotOptionsBoxplot();
        if (e.getValue()) {
            options.setClassName("custom-style");
            options.setWhiskerLength("70");
        }
        observations.setPlotOptions(options);
        chart.drawChart(true);
    });
    add(chart, useCustomStyles);
}

Example 28 with YAxis

use of com.vaadin.flow.component.charts.model.YAxis 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;
}

Example 29 with YAxis

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

the class DynamicChangingChart method getLineConfiguration.

private Configuration getLineConfiguration() {
    Configuration configuration = new Configuration();
    configuration.setTitle("Solar Employment Growth by Sector, 2010-2016");
    configuration.setSubTitle("Source: thesolarfoundation.com");
    YAxis yAxis = configuration.getyAxis();
    yAxis.setTitle("Number of Employees");
    Legend legend = configuration.getLegend();
    legend.setLayout(LayoutDirection.VERTICAL);
    legend.setVerticalAlign(VerticalAlign.MIDDLE);
    legend.setAlign(HorizontalAlign.RIGHT);
    PlotOptionsSeries plotOptionsSeries = new PlotOptionsSeries();
    plotOptionsSeries.setPointStart(2010);
    configuration.setPlotOptions(plotOptionsSeries);
    configuration.addSeries(new ListSeries("Installation", 43934, 52503, 57177, 69658, 97031, 119931, 137133, 154175));
    configuration.addSeries(new ListSeries("Manufacturing", 24916, 24064, 29742, 29851, 32490, 30282, 38121, 40434));
    configuration.addSeries(new ListSeries("Sales & Distribution", 11744, 17722, 16005, 19771, 20185, 24377, 32147, 39387));
    configuration.addSeries(new ListSeries("Project Development", null, null, 7988, 12169, 15112, 22452, 34400, 34227));
    configuration.addSeries(new ListSeries("Other", 12908, 5948, 8105, 11248, 8989, 11816, 18274, 18111));
    return configuration;
}

Example 30 with YAxis

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

the class GaugeWithDualAxes 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 with dual axes");
    configuration.getChart().setWidth(500);
    configuration.getPane().setStartAngle(-150);
    configuration.getPane().setEndAngle(150);
    YAxis yAxis = new YAxis();
    yAxis.setClassName("kmh");
    yAxis.setMin(0);
    yAxis.setMax(200);
    yAxis.setOffset(-25);
    Labels labels = new Labels();
    labels.setDistance(-20);
    labels.setRotation("auto");
    yAxis.setLabels(labels);
    yAxis.setTickLength(5);
    yAxis.setMinorTickLength(5);
    yAxis.setEndOnTick(false);
    YAxis yAxis2 = new YAxis();
    yAxis2.setClassName("mph");
    yAxis2.setMin(0);
    yAxis2.setMax(124);
    yAxis2.setOffset(-20);
    labels = new Labels();
    labels.setDistance(12);
    labels.setRotation("auto");
    yAxis2.setLabels(labels);
    yAxis2.setTickPosition(TickPosition.OUTSIDE);
    yAxis2.setMinorTickPosition(TickPosition.OUTSIDE);
    yAxis2.setTickLength(5);
    yAxis2.setMinorTickLength(5);
    yAxis2.setEndOnTick(false);
    configuration.addyAxis(yAxis);
    configuration.addyAxis(yAxis2);
    final ListSeries series = new ListSeries("Speed", 80);
    PlotOptionsGauge plotOptionsGauge = new PlotOptionsGauge();
    plotOptionsGauge.setDataLabels(new DataLabels());
    plotOptionsGauge.getDataLabels().setFormatter("function() {return '<span class=\"kmh\">'+ this.y + ' km/h</span><br/>' + '<span class=\"mph\">' + Math.round(this.y * 0.621) + ' mph</span>';}");
    plotOptionsGauge.setTooltip(new SeriesTooltip());
    plotOptionsGauge.getTooltip().setValueSuffix(" km/h");
    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);
    chart.drawChart();
    add(chart);
}