Class AbstractGraph<B>

Type Parameters:
B - the type of buffer backing the graph: typically this is double[] but in some cases Color[], String[] or MeshLambertMaterial[] for Pop2D, PopGraph2D or PopGraph3D, respectively.
All Implemented Interfaces:
HasAllDragAndDropHandlers, HasAllFocusHandlers, HasAllGestureHandlers, HasAllKeyHandlers, HasAllMouseHandlers, HasAllTouchHandlers, HasBlurHandlers, HasClickHandlers, HasContextMenuHandlers, HasDoubleClickHandlers, HasDragEndHandlers, HasDragEnterHandlers, HasDragHandlers, HasDragLeaveHandlers, HasDragOverHandlers, HasDragStartHandlers, HasDropHandlers, HasFocusHandlers, HasGestureChangeHandlers, HasGestureEndHandlers, HasGestureStartHandlers, HasKeyDownHandlers, HasKeyPressHandlers, HasKeyUpHandlers, HasMouseDownHandlers, HasMouseMoveHandlers, HasMouseOutHandlers, HasMouseOverHandlers, HasMouseUpHandlers, HasMouseWheelHandlers, HasTouchCancelHandlers, HasTouchEndHandlers, HasTouchMoveHandlers, HasTouchStartHandlers, MouseDownHandler, MouseMoveHandler, MouseOutHandler, MouseUpHandler, MouseWheelHandler, TouchEndHandler, TouchMoveHandler, TouchStartHandler, HasAttachHandlers, EventHandler, HasHandlers, EventListener, AcceptsOneWidget, Focusable, HasFocus, HasOneWidget, HasVisibility, HasWidgets, HasWidgets.ForIsWidget, IsWidget, RequiresResize, SourcesClickEvents, SourcesFocusEvents, SourcesKeyboardEvents, SourcesMouseEvents, SourcesMouseWheelEvents, Iterable<Widget>, ContextMenu.Listener, ContextMenu.Provider, Tooltip.Provider
Direct Known Subclasses:
GenericPopGraph, HistoGraph, LineGraph, ParaGraph, S3Graph

The base class for all graphical representations. The class provides the basic functionality for drawing graphs, handling mouse and touch events, and displaying tooltips and context menus. It also provides the default implementations for zooming and shifting the view of the graph.
Author:
Christoph Hauert
  • Field Details

    • doubleClickHandler

      HandlerRegistration doubleClickHandler
      The handler for DoubleClickEvents.
    • mouseOutHandler

      HandlerRegistration mouseOutHandler
      The handler for MouseOutEvents.
    • mouseDownHandler

      HandlerRegistration mouseDownHandler
      The handler for MouseDownEvents.
    • mouseUpHandler

      HandlerRegistration mouseUpHandler
      The handler for MouseUpEvents.
    • mouseMoveHandler

      HandlerRegistration mouseMoveHandler
      The handler for MouseMoveEvents.
    • mouseWheelHandler

      HandlerRegistration mouseWheelHandler
      The handler for MouseWheelEvents.
    • touchStartHandler

      HandlerRegistration touchStartHandler
      The handler for TouchStartEvents.
    • touchEndHandler

      HandlerRegistration touchEndHandler
      The handler for TouchEndEvents.
    • touchMoveHandler

      HandlerRegistration touchMoveHandler
      The handler for TouchMoveEvents.
    • zoomFactor

      protected double zoomFactor
      The current zoom level.
    • viewCorner

      protected Point2D viewCorner
      The coordinates of the lower left corner visible on the canvas.
    • controller

      protected AbstractGraph.Controller controller
      The controller of this graph.
    • shifter

      The controller for shifting this graph.
    • zoomer

      The controller for zooming this graph.
    • contextMenu

      protected ContextMenu contextMenu
      The reference to the (shared) context menu.
    • tooltip

      protected Tooltip tooltip
      The reference to the (shared) tooltip.
    • tooltipProvider

      BasicTooltipProvider tooltipProvider
      The provider for tooltips.
    • scale

      protected double scale
      The scale of this graph. Used to translate width and height into canvas coordinates. For example, on retina displays the scale is typically 2, i.e. two pixels per unit width or height.
      See Also:
    • wrapper

      LayoutPanel wrapper
      The wrapper element which displays the canvas. Subclasses may use this to add further elements to the graph such as labels.
    • logger

      protected Logger logger
      Logger for keeping track of and reporting events and issues.
    • element

      protected Element element
      Handle to the object's underlying DOM element.
    • canvas

      protected Canvas canvas
      Handle to the canvas for drawing the graphics.
    • g

      Handle to the graphical context for drawing on the canvas.
    • colors

      protected String[] colors
      The array of colors used for drawing the graph.
    • markers

      protected ArrayList<double[]> markers
      Markers for decorating the graph.
    • markerColors

      protected String[] markerColors
      The array of colors used for markers.
    • module

      protected Module module
      The module backing the graph.
    • isActive

      protected boolean isActive
      The flag to indicate whether the graph is live (visible, activated).
    • bounds

      protected Rectangle2D bounds
      The bounds of the displaying area. This excludes any frames and/or axis labels.
    • style

      protected AbstractGraph.GraphStyle style
      The style of the graph. Includes labels, fonts, etc.
    • buffer

      protected RingBuffer<B> buffer
      The buffer to store historical data, if applicable.
    • MIN_BUFFER_SIZE

      protected static final int MIN_BUFFER_SIZE
      The minimum buffer size.
      See Also:
    • DEFAULT_BUFFER_SIZE

      protected static final int DEFAULT_BUFFER_SIZE
      The default buffer size. Must be at least MIN_BUFFER_SIZE.
      See Also:
    • MIN_MSEC_BETWEEN_UPDATES

      public static final int MIN_MSEC_BETWEEN_UPDATES
      The minimum time between updates in milliseconds.
      See Also:
    • updatetime

      protected double updatetime
      The field to store the time of the last update.
    • bufferSizeMenu

      private ContextMenu bufferSizeMenu
      The context menu to set the buffer size for graphs with historical data.
    • bufferSizeTrigger

      private ContextMenuItem bufferSizeTrigger
      The context menu item which triggers the buffer size context menu.
    • hasZoom

      protected boolean hasZoom
      The flag to indicate whether the graph supports zoom. The default is no support.
    • zoomResetMenu

      ContextMenuItem zoomResetMenu
      The context menu item to reset the zoom level.
    • zoomInMenu

      ContextMenuItem zoomInMenu
      The context menu item to zoom in (enlarge) by a factor of 2.
    • zoomOutMenu

      ContextMenuItem zoomOutMenu
      The context menu item to zoom out (reduce) by a factor of 1/2.
    • TWOPI

      private static final double TWOPI
      Constant representing the numerical value of \(2 \pi\)
      See Also:
    • PIHALF

      protected static final double PIHALF
      Constant representing the numerical value of \(\pi/2\)
      See Also:
    • MAX_SEGEMENTS

      private static final int MAX_SEGEMENTS
      The maximum number of line segments to draw before returning control to the event loop.
      See Also:
    • hasMessage

      protected boolean hasMessage
      Flag to indicate whether the graph displays a message.
    • leftMouseButton

      protected boolean leftMouseButton
      The flag to indicate whether the left mouse button is pressed.
    • mouseX

      protected int mouseX
      The x-coordinate of the previous mouse or tap event.
    • mouseY

      protected int mouseY
      The y-coordinate of the previous mouse or tap event.
    • touchEndTime

      protected double touchEndTime
      The time when the previous touch ended.
    • pinchX

      protected int pinchX
      The x-coordinate of the center of the pinching gesture.
    • pinchY

      protected int pinchY
      The y-coordinate of the center of the pinching gesture.
    • pinchDist

      protected double pinchDist
      The distance between the pinching gesture.
    • zoomInertiaTimer

      protected Timer zoomInertiaTimer
      The timer to remove the CSS classes .evoludo-cursorZoomIn or .evoludo-cursorZoomIn, respectively, from the graph element after the inertia of zooming has worn off.
  • Constructor Details

    • AbstractGraph

      protected AbstractGraph(AbstractGraph.Controller controller, Module module)
      Create the base class for graphs. Allocates the canvas, retrieves the shared tooltip and context menu. Use the CSS class evoludo-Canvas2D for custom formatting of the canvas element.
      Parameters:
      controller - the controller of this graph
      module - the module backing the graph
  • Method Details

    • setTooltipProvider

      public void setTooltipProvider(BasicTooltipProvider tooltipProvider)
      Set the provider for tooltips.
      Parameters:
      tooltipProvider - the provider for tooltips
    • getBuffer

      public RingBuffer<B> getBuffer()
      Return the RingBuffer<double[]> containing historical data, if applicable.
      Returns:
      the buffer with historical data or null
    • doUpdate

      public boolean doUpdate()
      Determine whether it is time to update the display.
      Returns:
      true if time to update graph
    • activate

      public void activate()
      Perform necessary preparations to show the graph in the GUI. Attaches mouse and touch handlers for graphs that implement AbstractGraph.Zooming or AbstractGraph.Shifting interfaces.
      See Also:
    • deactivate

      public void deactivate()
      The graph is removed from the GUI. Opportunity for some clean up. Removes all mouse and touch handlers from graph.
      See Also:
    • onResize

      public void onResize()
      Specified by:
      onResize in interface RequiresResize
    • updateCanvas

      private void updateCanvas()
      Update the canvas size and coordinate space dimensions. IMPORTANT: Setting the canvas size or the coordinate space dimensions clears the canvas (even with no actual changes)!
    • reset

      public void reset()
      Reset the graph. Clear canvas and messages.
    • init

      public void init()
      Initialize the graph. Do not clear graph.
    • paint

      public void paint()
      Draw the graph.
    • getModule

      public Module getModule()
      Get the module that backs the graph.
      Returns:
      the module
    • paint

      public boolean paint(boolean force)
      Draw the graph. For re-drawing the graph, set force to true.
      Parameters:
      force - true to force re-drawing of graph
      Returns:
      true if painting skipped
    • setMarkers

      public void setMarkers(ArrayList<double[]> markers)
      Assign a list of markers to the graph.
      Parameters:
      markers - the list of markers
    • setMarkers

      public void setMarkers(ArrayList<double[]> markers, String[] colors)
      Assign a list of markers with custom colors to the graph.
      Parameters:
      markers - the list of markers
      colors - the list of custom colors
    • setColors

      public void setColors(String[] colors)
      Assign a list of colors to the graph.
      Parameters:
      colors - the list of colors
    • hasHistory

      public boolean hasHistory()
      Check whether the graph entertains a buffer with historical data.
      Returns:
      true if the graph stores the data history
    • clearHistory

      public void clearHistory()
      Clear the history of the graph (if there is one).
    • prependTime2Data

      protected double[] prependTime2Data(double t, double[] data)
      Utility method to prepend time to data point.
      Parameters:
      t - the time
      data - the data
      Returns:
      the new data array including time
    • populateContextMenuAt

      public void populateContextMenuAt(ContextMenu menu, int x, int y)
      Populate context menu menu in listening widget at (relative) position (x,y).

      Adds buffer size menu and queries the controller to add further functionality.

      Specified by:
      populateContextMenuAt in interface ContextMenu.Provider
      Parameters:
      menu - context menu entries are added here
      x - horizontal coordinate (relative to listening widget)
      y - horizontal coordinate (relative to listening widget)
      See Also:
    • setBufferCapacity

      protected void setBufferCapacity(int capacity)
      Sets the buffer capacity to capacity, if applicable.
      Parameters:
      capacity - the new buffer capacity
    • contains

      public boolean contains(int x, int y)
      Checks if the (browser) coordinates (x, y) are inside this graph. This is useful for controllers that may manage several graphs.
      Parameters:
      x - the x-coordinate to check
      y - the y-coordinate to check
      Returns:
      true if (x, y) is inside graph
    • convertToScaledCoordinates

      public Point2D convertToScaledCoordinates(int x, int y)
      Convert the (browser) coordinates (x, y) to scaled coordinates in \([0,1]^2\).
      Parameters:
      x - the x-coordinate to convert
      y - the y-coordinate to convert
      Returns:
      the converted coordinates
    • convertToScaledCoordinates

      public Point2D convertToScaledCoordinates(int x, int y, Point2D dest)
      Convert the (browser) coordinates (x, y) to scaled coordinates in \([0,1]^2\) and store in dest.
      Parameters:
      x - the x-coordinate to convert
      y - the y-coordinate to convert
      dest - the point to save the converted coordinates
      Returns:
      the converted coordinates
    • export

      public abstract void export(AbstractGraph.MyContext2d ctx)
      Export the graphical context ctx.
      Parameters:
      ctx - the graphical context to export
    • calcBounds

      protected boolean calcBounds()
      Calculate bounds of drawing area. If element has never been visible its size is not yet known.
      Returns:
      true if bounds are successfully calculated.
    • calcBounds

      public void calcBounds(int width, int height)
      Calculate bounds of drawing area.
      Parameters:
      width - the width of the drawing area
      height - the height of the drawing area
    • drawFrame

      protected void drawFrame(int xLevels, int yLevels)
      Draw the frame of the graph including axis labels, ticks and tick marks, as applicable.

      Implementation Note:

      The top, left corner of the canvas is assumed to be at (0, 0). Flips the direction of the y-axis.
      Parameters:
      xLevels - the number of vertical levels
      yLevels - the number of horizontal levels
      See Also:
    • drawFrame

      protected void drawFrame(int xLevels, int yLevels, double gscale)
      Draw the frame of the graph including axis labels, ticks and tick marks, as applicable, after scaling the canvas by gscale.

      Implementation Note:

      After scaling the origin (0, 0) is assumed to be in the bottom, left corner of the canvas.
      Parameters:
      xLevels - the number of vertical levels
      yLevels - the number of horizontal levels
      gscale - the scaling applied to the coordinate transformation
    • setFont

      protected void setFont(String cssfont)
      Set the font to cssfont in CSS format for drawing on the canvas.
      Parameters:
      cssfont - the font for drawing
    • setStrokeStyleAt

      protected void setStrokeStyleAt(int node)
      Set the stroke colour for node with index node.
      Parameters:
      node - the index of the node
    • stroke

      protected void stroke(Path2D path)
      Draw the path path.
      Parameters:
      path - the path to draw
    • fill

      protected void fill(Path2D path)
      Fill the path path.
      Parameters:
      path - the path to fill
    • sketch

      private void sketch(Path2D path, boolean fill)
      Draw or fill (if fill == true) the path path.

      Implementation notes:

      • Drawing too many segments at once becomes very slow (why?).
      • Periodically closing and stroking the path is orders of magnitudes faster!
      • This simple change renders freezing of the GUI essentially a non issue.
      • SVG seems to be a stickler about opening and closing paths or empty paths (see Canvas2SVG.js)
      Parameters:
      path - the path to draw (or fill)
      fill - true to fill path
    • closePath

      private void closePath(boolean fill)
      Helper method to close the path and draw (or fill) it.
      Parameters:
      fill - true to fill path
    • strokeRect

      protected void strokeRect(double x, double y, double w, double h)
      Draw the rectangle with origin at (x,y), width w and height h.
      Parameters:
      x - the x-coordinate of the origin
      y - the y-coordinate of the origin
      w - the width of the rectangle
      h - the height of the rectangle
    • fillRect

      protected void fillRect(double x, double y, double w, double h)
      Fill the rectangle with origin at (x,y), width w and height h.
      Parameters:
      x - the x-coordinate of the origin
      y - the y-coordinate of the origin
      w - the width of the rectangle
      h - the height of the rectangle
    • strokeCircle

      protected void strokeCircle(double x, double y, double radius)
      Draw the circle with the center at (x,y) and radius radius.
      Parameters:
      x - the x-coordinate of the center
      y - the y-coordinate of the center
      radius - the radius of the circle
    • fillCircle

      protected void fillCircle(double x, double y, double radius)
      Fill the circle with the center at (x,y) and radius radius.
      Parameters:
      x - the x-coordinate of the center
      y - the y-coordinate of the center
      radius - the radius of the circle
    • sketchCircle

      private void sketchCircle(double x, double y, double radius)
      Helper method to create a path for a circle with the center at (x,y) and radius radius.
      Parameters:
      x - the x-coordinate of the center
      y - the y-coordinate of the center
      radius - the radius of the circle
    • strokeLine

      protected void strokeLine(double sx, double sy, double ex, double ey)
      Draw a line from point (sx,sy) to (ex,ey).
      Parameters:
      sx - the x-coordinate of the start point
      sy - the y-coordinate of the start point
      ex - the x-coordinate of the end point
      ey - the y-coordinate of the end point
    • fillTextVertical

      protected void fillTextVertical(String msg, double x, double y)
      Draw filled text vertically starting at point (x,y)
      Parameters:
      msg - the text to write
      x - the x-coordinate of the start point
      y - the y-coordinate of the start point
    • clearGraph

      public void clearGraph()
      Clear the graph.
    • clearCanvas

      protected void clearCanvas()
      Clear the canvas.

      Implementation note:

      Assumes scaled canvas coordinates, i.e. lower, left corner at (0,0).
    • resetTransforms

      protected void resetTransforms()
      Reset the transformation of the graphics context to the identity transform.
    • displayMessage

      public boolean displayMessage(String msg)
      Display message msg on the graph (no HTML formatting).

      Implementation note:

      The message is centered and scaled such that it fills approximately two thirds of the width of the graph.
      Parameters:
      msg - the message to display
      Returns:
      true if message displayed
    • clearMessage

      public void clearMessage()
      Clear the message.
    • hasMessage

      public boolean hasMessage()
      Check if the graph displays a message.
      Returns:
      true if message displayed
    • zoom

      public void zoom()
      Reset zoom. Default implementation for graphs that implement Zooming.
      See Also:
    • zoom

      public void zoom(double zoom)
      Adjust zoom level by the factor zoom. Default implementation for graphs that implement Zooming.
      Parameters:
      zoom - the new zoom level
      See Also:
    • zoom

      public void zoom(double zoom, int x, int y)
      Adjust zoom level by the factor zoom with the center at coordinates (x,y) (in display coordinates as provided by event listeners). Default implementation for graphs that implement Zooming.
      Parameters:
      zoom - the new zoom level
      x - the x-coordinate of the zoom center
      y - the y-coordinate of the zoom center
      See Also:
    • zoom

      protected void zoom(double zoom, double fx, double fy)
      Helper method to adjust zoom level with the zoom center at the scaled coordinates (fx, fy), specified as a fraction of the view port in horizontal and vertical directions, respectively.
      Parameters:
      zoom - the new zoom level
      fx - the scaled x-coordinate of the zoom center
      fy - the scaled y-coordinate of the zoom center
      See Also:
    • shift

      public void shift(int dx, int dy)
      Shift the (zoomed) graph within the view port by (dx, dy). Default implementation for graphs that implement Shifting.
      Parameters:
      dx - the horizontal shift of the graph
      dy - the vertical shift of the graph
      See Also:
    • onMouseOut

      public void onMouseOut(MouseOutEvent event)

      If mouse leaves graph while shifting the view stop shifting. Mouse events are no longer received and hence it is impossible to track releasing or pressing mouse buttons.

      Specified by:
      onMouseOut in interface MouseOutHandler
    • onMouseDown

      public void onMouseDown(MouseDownEvent event)

      If a node has been hit by a left-click, remember the node's index and the current mouse coordinates. This information might be used by subsequent MouseMoveEvents.

      Specified by:
      onMouseDown in interface MouseDownHandler
      See Also:
    • onMouseUp

      public void onMouseUp(MouseUpEvent event)

      Cancel all interactions with the graph and reset node and mouse information.

      CSS Style Rules

      .evoludo-cursorMoveView
      removed from graph element.
      Specified by:
      onMouseUp in interface MouseUpHandler
      See Also:
    • onMouseMove

      public void onMouseMove(MouseMoveEvent event)

      If the left mouse-key is pressed the graph is shifted within its viewport. Note this requires that the zoom level of the graph exceeds 1.

      CSS Style Rules

      .evoludo-cursorMoveView
      added to graph element when shifting the view.
      Specified by:
      onMouseMove in interface MouseMoveHandler
      See Also:
    • onMouseWheel

      public void onMouseWheel(MouseWheelEvent event)

      Adjusts the zoom level of the graph, while preserving the location of the mouse on the graph. The zooming has inertia.

      CSS Style Rules

      .evoludo-cursorZoomIn
      added to graph element when zooming in and removed when inertia stops.
      .evoludo-cursorZoomOut
      added to graph element when zooming out and removed when inertia stops.
      Specified by:
      onMouseWheel in interface MouseWheelHandler
      See Also:
    • onTouchStart

      public void onTouchStart(TouchStartEvent event)

      The graph reacts to different kinds of touches: short touches or taps (&lt;250 msec) and long touches (&gt;250 msec). Long touches trigger different actions depending on the number of fingers:

      Single finger
      Initiate shifting the view
      Two fingers
      Initiate pinching zoom.
      Specified by:
      onTouchStart in interface TouchStartHandler
      See Also:
    • onTouchEnd

      public void onTouchEnd(TouchEndEvent event)

      The number of touches on the graph changed.

      Specified by:
      onTouchEnd in interface TouchEndHandler
    • onTouchMove

      public void onTouchMove(TouchMoveEvent event)

      The graph reacts to different kinds of touch moves:

      Move one finger
      Shift view
      Pinch two fingers
      Zoom view
      Specified by:
      onTouchMove in interface TouchMoveHandler
    • addContextMenuHandler

      public HandlerRegistration addContextMenuHandler(ContextMenuHandler handler)
      Specified by:
      addContextMenuHandler in interface HasContextMenuHandlers
    • getStyle

      public AbstractGraph.GraphStyle getStyle()
      Get the graph style.
      Returns:
      the graph style
    • autoscale

      public void autoscale(boolean x, boolean y)
      Set auto-scaling for horizontal and vertical axes.
      Parameters:
      x - true to automatically scale the x-axis
      y - true to automatically scale the y-axis