Search in sources :

Example 6 with Color

use of com.vaadin.addon.charts.model.style.Color in project charts by vaadin.

the class ModifyOnePoint method setup.

@Override
protected void setup() {
    super.setup();
    FormLayout formLayout = new FormLayout();
    formLayout.setCaption("Special point settings, only updated point state is sent to client.");
    formLayout.setMargin(true);
    final Slider sliderX = new Slider();
    sliderX.setMin(3);
    sliderX.setMax(8);
    sliderX.setResolution(1);
    sliderX.setValue(4d);
    sliderX.setCaption("X");
    sliderX.addValueChangeListener(event -> {
        dataSeriesItem.setX(sliderX.getValue());
        series.update(dataSeriesItem);
    });
    sliderX.setWidth("200px");
    formLayout.addComponent(sliderX);
    final Slider sliderY = new Slider();
    sliderY.setMin(0);
    sliderY.setMax(10);
    sliderY.setResolution(1);
    sliderY.setValue(4d);
    sliderY.setCaption("Y");
    sliderY.addValueChangeListener(event -> {
        dataSeriesItem.setY(sliderY.getValue());
        updateItemInChart();
    });
    sliderY.setWidth("200px");
    formLayout.addComponent(sliderY);
    final ColorPicker colorPicker = new ColorPicker();
    colorPicker.setValue(new com.vaadin.shared.ui.colorpicker.Color(255, 0, 0));
    colorPicker.setCaption("Marker color");
    colorPicker.addValueChangeListener(event -> {
        dataSeriesItem.getMarker().setFillColor(new SolidColor(event.getValue().getCSS()));
        updateItemInChart();
    });
    formLayout.addComponent(colorPicker);
    Button c = new Button("Pseudorandom", new Button.ClickListener() {

        Random r = new Random(0);

        @Override
        public void buttonClick(ClickEvent event) {
            sliderX.setValue(r.nextDouble() * 5 + 3);
            sliderY.setValue(r.nextDouble() * 10);
            colorPicker.setValue(new com.vaadin.shared.ui.colorpicker.Color(r.nextInt(255), r.nextInt(255), r.nextInt(255)));
        }
    });
    c.setId("random");
    formLayout.addComponent(c);
    addComponentAsFirst(formLayout);
}
Also used : FormLayout(com.vaadin.ui.FormLayout) Slider(com.vaadin.ui.Slider) ColorPicker(com.vaadin.ui.ColorPicker) ClickEvent(com.vaadin.ui.Button.ClickEvent) SolidColor(com.vaadin.addon.charts.model.style.SolidColor) Color(com.vaadin.addon.charts.model.style.Color) SolidColor(com.vaadin.addon.charts.model.style.SolidColor) Random(java.util.Random) Button(com.vaadin.ui.Button)

Example 7 with Color

use of com.vaadin.addon.charts.model.style.Color in project charts by vaadin.

the class MultipleAxes method getChart.

@Override
protected Component getChart() {
    Chart chart = new Chart();
    Configuration conf = chart.getConfiguration();
    Color[] colors = getThemeColors();
    conf.getChart().setZoomType(ZoomType.XY);
    conf.setTitle("Average Monthly Weather Data for Tokyo");
    conf.setSubTitle("Source: WorldClimate.com");
    XAxis x = new XAxis();
    x.setCategories("Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec");
    conf.addxAxis(x);
    YAxis y1 = new YAxis();
    Labels labels = new Labels();
    labels.setFormatter("return this.value +'°C'");
    Style style = new Style();
    style.setColor(colors[1]);
    labels.setStyle(style);
    y1.setLabels(labels);
    y1.setOpposite(true);
    AxisTitle title = new AxisTitle("Temperature");
    style = new Style();
    style.setColor(colors[1]);
    y1.setTitle(title);
    conf.addyAxis(y1);
    YAxis y2 = new YAxis();
    y2.setGridLineWidth(0);
    title = new AxisTitle("Rainfall");
    style = new Style();
    style.setColor(colors[0]);
    y2.setTitle(title);
    labels = new Labels();
    labels.setFormatter("this.value +' mm'");
    style = new Style();
    style.setColor(colors[0]);
    labels.setStyle(style);
    y2.setLabels(labels);
    conf.addyAxis(y2);
    YAxis y3 = new YAxis();
    y3.setGridLineWidth(0);
    conf.addyAxis(y3);
    title = new AxisTitle("Sea-Level Pressure");
    style = new Style();
    style.setColor(colors[2]);
    y3.setTitle(title);
    labels = new Labels();
    labels.setFormatter("this.value +' mb'");
    style = new Style();
    style.setColor(colors[2]);
    labels.setStyle(style);
    y3.setLabels(labels);
    y3.setOpposite(true);
    chart.drawChart(conf);
    Tooltip tooltip = new Tooltip();
    tooltip.setFormatter("function() { " + "var unit = { 'Rainfall': 'mm', 'Temperature': '°C', 'Sea-Level Pressure': 'mb' }[this.series.name];" + "return ''+ this.x +': '+ this.y +' '+ unit; }");
    conf.setTooltip(tooltip);
    Legend legend = new Legend();
    legend.setLayout(LayoutDirection.VERTICAL);
    legend.setAlign(HorizontalAlign.LEFT);
    legend.setX(120);
    legend.setVerticalAlign(VerticalAlign.TOP);
    legend.setY(80);
    legend.setFloating(true);
    conf.setLegend(legend);
    DataSeries series = new DataSeries();
    PlotOptionsColumn plotOptionsColumn = new PlotOptionsColumn();
    plotOptionsColumn.setColor(colors[0]);
    series.setPlotOptions(plotOptionsColumn);
    series.setName("Rainfall");
    series.setyAxis(1);
    series.setData(49.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4);
    conf.addSeries(series);
    series = new DataSeries();
    PlotOptionsSpline plotOptionsSpline = new PlotOptionsSpline();
    plotOptionsSpline.setColor(colors[2]);
    series.setPlotOptions(plotOptionsSpline);
    series.setName("Sea-Level Pressure");
    series.setyAxis(2);
    series.setData(1016, 1016, 1015.9, 1015.5, 1012.3, 1009.5, 1009.6, 1010.2, 1013.1, 1016.9, 1018.2, 1016.7);
    conf.addSeries(series);
    series = new DataSeries();
    plotOptionsSpline = new PlotOptionsSpline();
    plotOptionsSpline.setColor(colors[1]);
    series.setPlotOptions(plotOptionsSpline);
    series.setName("Temperature");
    series.setData(7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6);
    conf.addSeries(series);
    chart.drawChart(conf);
    return chart;
}
Also used : Legend(com.vaadin.addon.charts.model.Legend) Configuration(com.vaadin.addon.charts.model.Configuration) Color(com.vaadin.addon.charts.model.style.Color) Tooltip(com.vaadin.addon.charts.model.Tooltip) Labels(com.vaadin.addon.charts.model.Labels) PlotOptionsSpline(com.vaadin.addon.charts.model.PlotOptionsSpline) XAxis(com.vaadin.addon.charts.model.XAxis) PlotOptionsColumn(com.vaadin.addon.charts.model.PlotOptionsColumn) Style(com.vaadin.addon.charts.model.style.Style) DataSeries(com.vaadin.addon.charts.model.DataSeries) AxisTitle(com.vaadin.addon.charts.model.AxisTitle) Chart(com.vaadin.addon.charts.Chart) YAxis(com.vaadin.addon.charts.model.YAxis)

Example 8 with Color

use of com.vaadin.addon.charts.model.style.Color in project charts by vaadin.

the class ScatterWithRegressionLine method getChart.

@Override
protected Component getChart() {
    Chart chart = new Chart();
    Configuration conf = chart.getConfiguration();
    Color[] colors = getThemeColors();
    XAxis x = new XAxis();
    x.setMin(-0.5);
    x.setMax(5.5);
    conf.addxAxis(x);
    YAxis y = new YAxis();
    y.setMin(0);
    conf.addyAxis(y);
    conf.setTitle("Scatter plot with regression line");
    DataSeries series = new DataSeries();
    PlotOptionsLine plotOptions = new PlotOptionsLine();
    plotOptions.setColor(colors[1]);
    series.setPlotOptions(plotOptions);
    series.setName("Regression Line");
    List<DataSeriesItem> list = new ArrayList<DataSeriesItem>();
    list.add(new DataSeriesItem(0, 1.11));
    list.add(new DataSeriesItem(5, 4.51));
    series.setData(list);
    plotOptions.setMarker(new Marker(true));
    plotOptions.setEnableMouseTracking(true);
    Hover hover = new Hover();
    hover.setLineWidth(0);
    States states = new States();
    states.setHover(hover);
    plotOptions.setStates(states);
    conf.addSeries(series);
    ListSeries listSeries = new ListSeries("Observations", 1, 1.5, 2.8, 3.5, 3.9, 4.2);
    PlotOptionsScatter plotOptions2 = new PlotOptionsScatter();
    listSeries.setPlotOptions(plotOptions2);
    Marker marker = new Marker(true);
    marker.setRadius(4);
    plotOptions2.setMarker(marker);
    conf.addSeries(listSeries);
    chart.drawChart(conf);
    return chart;
}
Also used : Configuration(com.vaadin.addon.charts.model.Configuration) PlotOptionsScatter(com.vaadin.addon.charts.model.PlotOptionsScatter) Color(com.vaadin.addon.charts.model.style.Color) ArrayList(java.util.ArrayList) Marker(com.vaadin.addon.charts.model.Marker) XAxis(com.vaadin.addon.charts.model.XAxis) States(com.vaadin.addon.charts.model.States) PlotOptionsLine(com.vaadin.addon.charts.model.PlotOptionsLine) ListSeries(com.vaadin.addon.charts.model.ListSeries) Hover(com.vaadin.addon.charts.model.Hover) DataSeries(com.vaadin.addon.charts.model.DataSeries) Chart(com.vaadin.addon.charts.Chart) DataSeriesItem(com.vaadin.addon.charts.model.DataSeriesItem) YAxis(com.vaadin.addon.charts.model.YAxis)

Example 9 with Color

use of com.vaadin.addon.charts.model.style.Color in project charts by vaadin.

the class PointClickCoordinatesDonutChart method createInnerSeries.

private Series createInnerSeries() {
    DataSeries innerSeries = new DataSeries();
    innerSeries.setName("Browsers");
    PlotOptionsPie innerPieOptions = new PlotOptionsPie();
    innerSeries.setPlotOptions(innerPieOptions);
    innerPieOptions.setSize("237px");
    innerPieOptions.setDataLabels(new DataLabels());
    innerPieOptions.getDataLabels().setFormatter("this.y > 5 ? this.point.name : null");
    innerPieOptions.getDataLabels().setColor(new SolidColor(255, 255, 255));
    innerPieOptions.getDataLabels().setDistance(-30);
    Color[] innerColors = Arrays.copyOf(colors, 5);
    innerSeries.setData(new String[] { "MSIE", "Firefox", "Chrome", "Safari", "Opera" }, new Number[] { 55.11, 21.63, 11.94, 7.15, 2.14 }, innerColors);
    return innerSeries;
}
Also used : PlotOptionsPie(com.vaadin.addon.charts.model.PlotOptionsPie) DataLabels(com.vaadin.addon.charts.model.DataLabels) SolidColor(com.vaadin.addon.charts.model.style.SolidColor) Color(com.vaadin.addon.charts.model.style.Color) SolidColor(com.vaadin.addon.charts.model.style.SolidColor) DataSeries(com.vaadin.addon.charts.model.DataSeries)

Example 10 with Color

use of com.vaadin.addon.charts.model.style.Color in project charts by vaadin.

the class BasicLineGettingMousePointerPosition method getChart.

@Override
protected Component getChart() {
    Chart chart = new Chart();
    chart.setId("chart");
    Color[] colors = getThemeColors();
    Configuration conf = chart.getConfiguration();
    conf.getChart().setZoomType(ZoomType.XY);
    conf.setTitle("Average Monthly Temperature and Rainfall in Tokyo");
    conf.setSubTitle("Source: WorldClimate.com");
    XAxis x = new XAxis();
    x.setCategories("Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec");
    conf.addxAxis(x);
    YAxis primary = new YAxis();
    primary.setTitle("Temperature");
    Style style = new Style();
    style.setColor(colors[0]);
    primary.getTitle().setStyle(style);
    conf.addyAxis(primary);
    YAxis snd = new YAxis();
    snd.setTitle("Rainfall");
    snd.setOpposite(true);
    style = new Style();
    style.setColor(colors[1]);
    snd.getTitle().setStyle(style);
    conf.addyAxis(snd);
    Tooltip tooltip = new Tooltip(false);
    conf.setTooltip(tooltip);
    Legend legend = new Legend();
    legend.setLayout(LayoutDirection.VERTICAL);
    legend.setAlign(HorizontalAlign.LEFT);
    legend.setX(120);
    legend.setVerticalAlign(VerticalAlign.TOP);
    legend.setY(100);
    legend.setFloating(true);
    legend.setBackgroundColor(new SolidColor("#FFFFFF"));
    conf.setLegend(legend);
    DataSeries series = new DataSeries();
    series.setPlotOptions(new PlotOptionsColumn());
    series.setName("Rainfall");
    series.setData(49.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4);
    series.setyAxis(1);
    conf.addSeries(series);
    series = new DataSeries();
    PlotOptionsSpline plotOptions = new PlotOptionsSpline();
    series.setPlotOptions(plotOptions);
    series.setName("Temperature");
    series.setData(7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6);
    conf.addSeries(series);
    chart.addPointClickListener(new PointClickListener() {

        @Override
        public void onClick(PointClickEvent event) {
            Window win = new Window("PointClickEvent window");
            win.setContent(new Label("Browser client area coordinates: point X:" + event.getAbsoluteX() + " Y:" + event.getAbsoluteY()));
            win.setPositionX(event.getAbsoluteX());
            win.setPositionY(event.getAbsoluteY());
            getUI().addWindow(win);
        }
    });
    chart.addChartClickListener(new ChartClickListener() {

        @Override
        public void onClick(ChartClickEvent event) {
            Window win = new Window("Chart Click Event Window");
            win.setContent(new Label("Browser client area coordinates: point X:" + event.getAbsoluteX() + " Y:" + event.getAbsoluteY()));
            win.setPositionX(event.getAbsoluteX());
            win.setPositionY(event.getAbsoluteY());
            getUI().addWindow(win);
        }
    });
    return chart;
}
Also used : Window(com.vaadin.ui.Window) Legend(com.vaadin.addon.charts.model.Legend) Configuration(com.vaadin.addon.charts.model.Configuration) SolidColor(com.vaadin.addon.charts.model.style.SolidColor) Color(com.vaadin.addon.charts.model.style.Color) Tooltip(com.vaadin.addon.charts.model.Tooltip) PointClickEvent(com.vaadin.addon.charts.PointClickEvent) Label(com.vaadin.ui.Label) SolidColor(com.vaadin.addon.charts.model.style.SolidColor) PlotOptionsSpline(com.vaadin.addon.charts.model.PlotOptionsSpline) XAxis(com.vaadin.addon.charts.model.XAxis) ChartClickEvent(com.vaadin.addon.charts.ChartClickEvent) ChartClickListener(com.vaadin.addon.charts.ChartClickListener) PlotOptionsColumn(com.vaadin.addon.charts.model.PlotOptionsColumn) PointClickListener(com.vaadin.addon.charts.PointClickListener) Style(com.vaadin.addon.charts.model.style.Style) DataSeries(com.vaadin.addon.charts.model.DataSeries) Chart(com.vaadin.addon.charts.Chart) YAxis(com.vaadin.addon.charts.model.YAxis)

Aggregations

Color (com.vaadin.addon.charts.model.style.Color)10 Chart (com.vaadin.addon.charts.Chart)8 Configuration (com.vaadin.addon.charts.model.Configuration)8 SolidColor (com.vaadin.addon.charts.model.style.SolidColor)8 YAxis (com.vaadin.addon.charts.model.YAxis)7 DataSeries (com.vaadin.addon.charts.model.DataSeries)6 AxisTitle (com.vaadin.addon.charts.model.AxisTitle)4 Style (com.vaadin.addon.charts.model.style.Style)4 DataLabels (com.vaadin.addon.charts.model.DataLabels)3 DataSeriesItem (com.vaadin.addon.charts.model.DataSeriesItem)3 Hover (com.vaadin.addon.charts.model.Hover)3 ListSeries (com.vaadin.addon.charts.model.ListSeries)3 Marker (com.vaadin.addon.charts.model.Marker)3 PlotOptionsColumn (com.vaadin.addon.charts.model.PlotOptionsColumn)3 PlotOptionsSpline (com.vaadin.addon.charts.model.PlotOptionsSpline)3 States (com.vaadin.addon.charts.model.States)3 XAxis (com.vaadin.addon.charts.model.XAxis)3 GradientColor (com.vaadin.addon.charts.model.style.GradientColor)3 Labels (com.vaadin.addon.charts.model.Labels)2 Legend (com.vaadin.addon.charts.model.Legend)2