From 3c7be55624146461e739682e804692ee0ec56d15 Mon Sep 17 00:00:00 2001 From: Nicolas Morel Date: Sun, 30 Jun 2013 18:21:05 +0200 Subject: [PATCH] Added support for font options on axis label --- .../client/examples/line/LineExample.java | 79 +++++++ .../client/examples/line/LineExample.ui.xml | 29 ++- .../client/options/AbstractAxisOptions.java | 27 +++ .../gflot/client/options/FontOptions.java | 197 ++++++++++++++++++ 4 files changed, 325 insertions(+), 7 deletions(-) create mode 100644 gflot/src/main/java/com/googlecode/gflot/client/options/FontOptions.java diff --git a/examples/src/main/java/com/googlecode/gflot/examples/client/examples/line/LineExample.java b/examples/src/main/java/com/googlecode/gflot/examples/client/examples/line/LineExample.java index 65aed95..7e3afdb 100644 --- a/examples/src/main/java/com/googlecode/gflot/examples/client/examples/line/LineExample.java +++ b/examples/src/main/java/com/googlecode/gflot/examples/client/examples/line/LineExample.java @@ -3,16 +3,20 @@ import com.google.gwt.core.client.GWT; import com.google.gwt.event.dom.client.ClickEvent; +import com.google.gwt.resources.client.CssResource; import com.google.gwt.uibinder.client.UiBinder; import com.google.gwt.uibinder.client.UiField; import com.google.gwt.uibinder.client.UiHandler; import com.google.gwt.user.client.Random; +import com.google.gwt.user.client.ui.Button; import com.google.gwt.user.client.ui.Widget; import com.googlecode.gflot.client.DataPoint; import com.googlecode.gflot.client.PlotModel; import com.googlecode.gflot.client.Series; import com.googlecode.gflot.client.SeriesHandler; import com.googlecode.gflot.client.SimplePlot; +import com.googlecode.gflot.client.options.AxisOptions; +import com.googlecode.gflot.client.options.FontOptions; import com.googlecode.gflot.client.options.GridOptions; import com.googlecode.gflot.client.options.LegendOptions; import com.googlecode.gflot.client.options.PlotOptions; @@ -38,6 +42,13 @@ interface Binder { } + interface Style extends CssResource{ + String button(); + String darkTheme(); + String whiteTheme(); + String legendLabel(); + } + /** * Plot */ @@ -45,6 +56,28 @@ interface Binder @UiField( provided = true ) SimplePlot plot; + /** + * Button switch to dark + */ + @GFlotExamplesData + @UiField + Button switchDark; + + /** + * Button switch to white + */ + @GFlotExamplesData + @UiField + Button switchWhite; + + /** + * Access to UiBinder style + */ + @GFlotExamplesData + @UiField + Style style; + + public LineExample( Resources resources ) { super( resources ); @@ -61,6 +94,8 @@ public Widget createPlot() plotOptions.setLegendOptions( LegendOptions.create().setBackgroundOpacity( 0 ) .setPosition( LegendPosition.NORTH_WEST ) ); plotOptions.setGridOptions( GridOptions.create().setMargin( 5 ) ); + plotOptions.addXAxisOptions( AxisOptions.create().setFont( FontOptions.create().setColor("black").setWeight( "bold" ).setStyle( "italic" ) ) ); + plotOptions.addYAxisOptions( AxisOptions.create().setFont( FontOptions.create().setColor( "black" ).setWeight( "bold" ).setStyle( "italic" ) ) ); // create the plot plot = new SimplePlot( model, plotOptions ); @@ -105,4 +140,48 @@ private void generateRandomData() } } + /** + * Switch to dark theme + * + * @param e click event + */ + @GFlotExamplesSource + @UiHandler( "switchDark" ) + void onClickSwitchToDark( ClickEvent e ) + { + switchDark.setVisible( false ); + switchWhite.setVisible( true ); + + plot.removeStyleName( style.whiteTheme() ); + plot.addStyleName( style.darkTheme() ); + plot.getPlotOptions().getXAxisOptions().getFont().setColor( "white" ); + plot.getPlotOptions().getXAxisOptions().setTickColor( "rgba(255, 255, 255, 0.6)" ); + plot.getPlotOptions().getYAxisOptions().getFont().setColor( "white" ); + plot.getPlotOptions().getYAxisOptions().setTickColor( "rgba(255, 255, 255, 0.6)" ); + plot.getPlotOptions().getGridOptions().setBorderColor( "white" ); + plot.redraw(true); + } + + /** + * Switch to white theme + * + * @param e click event + */ + @GFlotExamplesSource + @UiHandler( "switchWhite" ) + void onClickSwitchToWhite( ClickEvent e ) + { + switchDark.setVisible( true ); + switchWhite.setVisible( false ); + + plot.removeStyleName( style.darkTheme() ); + plot.addStyleName( style.whiteTheme() ); + plot.getPlotOptions().getXAxisOptions().getFont().setColor( "black" ); + plot.getPlotOptions().getXAxisOptions().clearTickColor(); + plot.getPlotOptions().getYAxisOptions().getFont().setColor( "black" ); + plot.getPlotOptions().getYAxisOptions().clearTickColor(); + plot.getPlotOptions().getGridOptions().clearBorderColor(); + plot.redraw( true ); + } + } diff --git a/examples/src/main/java/com/googlecode/gflot/examples/client/examples/line/LineExample.ui.xml b/examples/src/main/java/com/googlecode/gflot/examples/client/examples/line/LineExample.ui.xml index ff35f1e..3ba701f 100644 --- a/examples/src/main/java/com/googlecode/gflot/examples/client/examples/line/LineExample.ui.xml +++ b/examples/src/main/java/com/googlecode/gflot/examples/client/examples/line/LineExample.ui.xml @@ -2,17 +2,32 @@ - - .generate { - margin-top: 10px; - margin-left: 10px; + + .button { + margin-top: 10px; + margin-left: 10px; + } + + .darkTheme { + background-color: black; + } + + @external legendLabel; + .darkTheme .legendLabel { + color: white; + } + + .whiteTheme .legendLabel { + color: black; } - - Generate + + Generate + Switch to dark + Switch to white - \ No newline at end of file + diff --git a/gflot/src/main/java/com/googlecode/gflot/client/options/AbstractAxisOptions.java b/gflot/src/main/java/com/googlecode/gflot/client/options/AbstractAxisOptions.java index 21899b3..59b2af4 100644 --- a/gflot/src/main/java/com/googlecode/gflot/client/options/AbstractAxisOptions.java +++ b/gflot/src/main/java/com/googlecode/gflot/client/options/AbstractAxisOptions.java @@ -111,6 +111,7 @@ public enum AxisLabelRenderingMode private static final String AXIS_LABEL_CANVAS_FONT_FAMILY_KEY = "axisLabelFontFamily"; private static final String ZOOM_RANGE_KEY = "zoomRange"; private static final String PAN_RANGE_KEY = "panRange"; + private static final String FONT_KEY = "font"; protected AbstractAxisOptions() { @@ -873,4 +874,30 @@ public final T clearPanRange() clear( PAN_RANGE_KEY ); return (T) this; } + + /** + * Define the font and color used to draw the axis tick labels. + */ + public final T setFont( FontOptions font ) + { + put( FONT_KEY, font ); + return (T) this; + } + + /** + * @return the font + */ + public final FontOptions getFont() + { + return getJsObject( FONT_KEY ); + } + + /** + * Clear the font + */ + public final T clearFont() + { + clear( FONT_KEY ); + return (T) this; + } } diff --git a/gflot/src/main/java/com/googlecode/gflot/client/options/FontOptions.java b/gflot/src/main/java/com/googlecode/gflot/client/options/FontOptions.java new file mode 100644 index 0000000..abadcb2 --- /dev/null +++ b/gflot/src/main/java/com/googlecode/gflot/client/options/FontOptions.java @@ -0,0 +1,197 @@ +/* + * Copyright (c) 2012 Nicolas Morel + * + * Permission is hereby granted, free of charge, to any person + * obtaining a copy of this software and associated documentation + * files (the "Software"), to deal in the Software without + * restriction, including without limitation the rights to use, + * copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the + * Software is furnished to do so, subject to the following + * conditions: + * + * The above copyright notice and this permission notice shall be + * included in all copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, + * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES + * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND + * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT + * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, + * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING + * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR + * OTHER DEALINGS IN THE SOFTWARE. + */ +package com.googlecode.gflot.client.options; + + +import com.google.gwt.core.client.JavaScriptObject; +import com.googlecode.gflot.client.jsni.JsonObject; + +/** + * Options to control font on axis and probably legend later. + * + * @author Nicolas Morel + */ +public class FontOptions extends JsonObject +{ + + private static final String SIZE_KEY = "size"; + private static final String LINE_HEIGHT_KEY = "lineHeight"; + private static final String STYLE_KEY = "style"; + private static final String WEIGHT_KEY = "weight"; + private static final String FAMILY_KEY = "family"; + private static final String VARIANT_KEY = "variant"; + private static final String COLOR_KEY = "color"; + + /** Creates a {@link com.googlecode.gflot.client.options.FontOptions} */ + public static final FontOptions create() + { + return JavaScriptObject.createObject().cast(); + } + + protected FontOptions() + { + } + + /** Set the size of the font. Must be expressed in pixels. */ + public final FontOptions setSize( Double size ) + { + put( SIZE_KEY, size ); + return this; + } + + /** @return the size of the font */ + public final Double getSize() + { + return getDouble( SIZE_KEY ); + } + + /** Clear the size of the font */ + public final FontOptions clearSize() + { + clear( SIZE_KEY ); + return this; + } + + /** Set the line height. Must be expressed in pixels. */ + public final FontOptions setLineHeight( Double lineHeight ) + { + put( LINE_HEIGHT_KEY, lineHeight ); + return this; + } + + /** @return the line height */ + public final Double getLineHeight() + { + return getDouble( LINE_HEIGHT_KEY ); + } + + /** Clear the line height */ + public final FontOptions clearLineHeight() + { + clear( LINE_HEIGHT_KEY ); + return this; + } + + /** Set the style of the font. */ + public final FontOptions setStyle( String style ) + { + put( STYLE_KEY, style ); + return this; + } + + /** @return the style of the font */ + public final String getStyle() + { + return getString( STYLE_KEY ); + } + + /** Clear the style of the font */ + public final FontOptions clearStyle() + { + clear( STYLE_KEY ); + return this; + } + + /** Set the weight of the font. */ + public final FontOptions setWeight( String weight ) + { + put( WEIGHT_KEY, weight ); + return this; + } + + /** @return the weight of the font */ + public final String getWeight() + { + return getString( WEIGHT_KEY ); + } + + /** Clear the weight of the font */ + public final FontOptions clearWeight() + { + clear( WEIGHT_KEY ); + return this; + } + + /** Set the family of the font. */ + public final FontOptions setFamily( String family ) + { + put( FAMILY_KEY, family ); + return this; + } + + /** @return the family of the font */ + public final String getFamily() + { + return getString( FAMILY_KEY ); + } + + /** Clear the family of the font */ + public final FontOptions clearFamily() + { + clear( FAMILY_KEY ); + return this; + } + + /** Set the variant of the font. */ + public final FontOptions setVariant( String variant ) + { + put( VARIANT_KEY, variant ); + return this; + } + + /** @return the variant of the font */ + public final String getVariant() + { + return getString( VARIANT_KEY ); + } + + /** Clear the variant of the font */ + public final FontOptions clearVariant() + { + clear( VARIANT_KEY ); + return this; + } + + /** Set the color */ + public final FontOptions setColor( String color ) + { + put( COLOR_KEY, color ); + return this; + } + + /** @return the color */ + public final String getColor() + { + return getString( COLOR_KEY ); + } + + /** Clear the color of the font */ + public final FontOptions clearColor() + { + clear( COLOR_KEY ); + return this; + } + +}