Skip to content

Instantly share code, notes, and snippets.

@alex-hhh
Last active February 7, 2018 08:57
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save alex-hhh/64f8af9c4bd5b5c65ada62dd9157e938 to your computer and use it in GitHub Desktop.
Save alex-hhh/64f8af9c4bd5b5c65ada62dd9157e938 to your computer and use it in GitHub Desktop.
Plot interactive overlay demo
#lang racket
;; Updated plot library required, https://github.com/alex-hhh/plot/tree/ah/interactive-overlays
(require plot pict)
;; Helper function to add a pict as a plot overlay -- don't want to add "pict"
;; as a dependency to the "plot" package
(define (add-pict-overlay plot-snip x y pict)
(send plot-snip add-general-overlay x y
(lambda (dc x y) (draw-pict pict dc x y))
(pict-width pict)
(pict-height pict)))
;; Will be called when the mouse moves over the plot SNIP. X and Y are the
;; mouse position in plot coordinates and they will be #f if the cursor is
;; outside of the actual plot area
(define (on-hover snip x y)
;; Clear previous overlays, as we'll set up new ones ...
(send snip clear-overlays)
(when (and x y)
;; ... but only if we are still inside the plot area
(define sx (sin x)) ; the function value at X
;; Draw a cross line at the current function position, xrule is more
;; efficient than drawing both a vrule or a hrule
(send snip add-xrule-overlay x sx)
;; Or we could draw the lines separately...
;; (send snip add-vrule-overlay x)
;; (send snip add-hrule-overlay sx)
;; Add a marker at the current function position, we also provide a label
;; with the function value
(send snip add-mark-overlay x sx #:radius 10 #:label (~r sx #:precision 2))
;; Add a picture at the current mouse location
(define p (vl-append (text (format "X Value ~a" (~r x #:precision 2)))
(text (format "Y Value ~a" (~r sx #:precision 2)))))
(add-pict-overlay snip x y p))
;; Finally, refresh the plot
(send snip refresh-overlays))
;; Create the plot snip and add the hover callback
(define snip (plot-snip (function sin) #:x-min -10 #:x-max 10))
(send snip set-mouse-callback on-hover)
snip
@alex-hhh
Copy link
Author

plot-interactive-overlay-demo

@joskoot
Copy link

joskoot commented Jan 29, 2018

Very nice, but using

Welcome to DrRacket, version 6.12 [3m].
Language: racket, with debugging; memory limit: 3000 MB.

I get the following error:

send: no such method
method name: set-hover-callback
class name: 2d-plot-snip%

Near the bottom of the code line
(send snip set-hover-callback on-hover)
is highlighted.

Thanks, joskoot

@alex-hhh
Copy link
Author

as I mentioned in my original message in the Racket Users Group, I updated the plot library to implement this functionality, the code will not work with the plot package that ships with racket.

You will need to clone https://github.com/alex-hhh/plot and use the "ah/interactive-overlays" branch.

@joskoot
Copy link

joskoot commented Jan 29, 2018

Hi Alex, Thanks. Stupid me. joskoot

@alex-hhh
Copy link
Author

plot-hover2

This is a real use case for this plot feature:

  • vertical line added at cursor location
  • two markers are added to the mean maximal plot representing the points that have data (the plot is interpolated between the points)
  • a badge at the cursor location shows duration (X axis), power (Y axis), model power as well as information about the two data points

In the actual application, the movement is a lot smoother, and the plots are a lot sharper.

@alex-hhh
Copy link
Author

plot-hover1

Another use case for this feature: the two plots are "linked" so that hovering the mouse on one plot will update the "current" line on both of them.

@alex-hhh
Copy link
Author

plot-hover3

Interactive overlays on a histogram plot

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment