Directory

← Back

Sparkline

Vaadin Sparkline is a standalone sparkline component for Vaadin Flow

Author

Rating

Popularity

<100

Vaadin Sparkline is a standalone sparkline component for Vaadin Flow. See also Grid Sparkline renderer: https://vaadin.com/directory/component/grid-sparklinerenderer-flow

Basic use

public class SparklineTest extends VerticalLayout {

    public SparklineTest() {
        //...
        Sparkline sparklineSimple = new Sparkline(createSparklineValues(createSong()));
        sparklineSimple.setWidth("120px");
        sparklineSimple.setHeight("20px");
        add(sparklineSimple);
        //...
    }

    private SparklineValues createSparklineValues(Song song) {
        // convert existing time series data to a SparklineValues object
        return new SparklineValues(song.getDailyListeners().getMeasurements().stream()
                     .map(measurement -> new SparklineValues.SparklineValue(
                               measurement.getInstant(), measurement.getValue())).collect(Collectors.toList()));
    }
}

With Plot bands

public class SparklineTest extends VerticalLayout {
    
    private void plotBandDemo() {
        //... 
        Patient patient = createPatient();
        Sparkline sparklinePlotBands = new Sparkline(createSparklineValuesTemp(patient), 
                          createSparklineConfTemp(patient));
        sparklinePlotBands.setWidth("120px");
        sparklinePlotBands.setHeight("20px");
        add(sparklinePlotBands);
    }
    
    private SparklineConfiguration createSparklineConfTemp(Patient patient) {
            return new SparklineConfiguration()
                    // scale y-axis between min and ax value
                    .withAutoScaleYAxis(true)
                    // add a plotband with line color and background color
                    .withPlotBand(new SparkLinePlotBand(36.0, 38.0)
                    .withBackgroundColor(SparklineConfiguration.LIGHT_GREEN)
                    .withLineColor(Color.GREEN))
                    // add a plotband with line color
                    .withPlotBand(new SparkLinePlotBand(38.0, 41.0)
                            .withLineColor(Color.RED));
    }
}

License & Author

This Add-on is distributed under Apache 2.0

Component Factory Sparkline is written by Vaadin Ltd.

Major pieces of development of this add-on has been sponsored by multiple customers of Vaadin. Read more about Expert on Demand at: Support and Pricing

Compatibility

(Loading compatibility data...)

Was this helpful? Need more help?
Leave a comment or a question below. You can also join the chat on Discord or ask questions on StackOverflow.

Version

  • Update the license to Apache 2.0
  • Update to Vaadin 14.
  • Change package name from com.vaadin.flow.component to com.vaadin.componentfactory
Released
2020-12-11
Maturity
BETA
License
Apache License 2.0

Compatibility

Framework
Vaadin 14
Vaadin 13 in 1.0.0
Browser
Firefox
Safari
Google Chrome
iOS Browser
Android Browser
Microsoft Edge

Sparkline - Vaadin Add-on Directory

Vaadin Sparkline is a standalone sparkline component for Vaadin Flow Sparkline - Vaadin Add-on Directory
Vaadin Sparkline is a standalone sparkline component for Vaadin Flow. See also Grid Sparkline renderer: https://vaadin.com/directory/component/grid-sparklinerenderer-flow Basic use ```java public class SparklineTest extends VerticalLayout { public SparklineTest() { //... Sparkline sparklineSimple = new Sparkline(createSparklineValues(createSong())); sparklineSimple.setWidth("120px"); sparklineSimple.setHeight("20px"); add(sparklineSimple); //... } private SparklineValues createSparklineValues(Song song) { // convert existing time series data to a SparklineValues object return new SparklineValues(song.getDailyListeners().getMeasurements().stream() .map(measurement -> new SparklineValues.SparklineValue( measurement.getInstant(), measurement.getValue())).collect(Collectors.toList())); } } ``` With Plot bands ```java public class SparklineTest extends VerticalLayout { private void plotBandDemo() { //... Patient patient = createPatient(); Sparkline sparklinePlotBands = new Sparkline(createSparklineValuesTemp(patient), createSparklineConfTemp(patient)); sparklinePlotBands.setWidth("120px"); sparklinePlotBands.setHeight("20px"); add(sparklinePlotBands); } private SparklineConfiguration createSparklineConfTemp(Patient patient) { return new SparklineConfiguration() // scale y-axis between min and ax value .withAutoScaleYAxis(true) // add a plotband with line color and background color .withPlotBand(new SparkLinePlotBand(36.0, 38.0) .withBackgroundColor(SparklineConfiguration.LIGHT_GREEN) .withLineColor(Color.GREEN)) // add a plotband with line color .withPlotBand(new SparkLinePlotBand(38.0, 41.0) .withLineColor(Color.RED)); } } ``` ## License & Author This Add-on is distributed under Apache 2.0 Component Factory Sparkline is written by Vaadin Ltd. ### Sponsored development Major pieces of development of this add-on has been sponsored by multiple customers of Vaadin. Read more about Expert on Demand at: [Support](https://vaadin.com/support) and [Pricing](https://vaadin.com/pricing)
Online