开发者

How to create interactive chart with Rebol

I have this code to create a candlestick chart in rebol. Now I'd like to use over feel http://www.rebol.com/how-to/feel.html#section-6 to show info on each candlestick but my box is drawn with draw dialect and it doesn't seem to accept event ?

plot: [
    pen green line 5x404 5x440 pen gold fill-pen 0.255.0 box 3x424 7x418 line 10x396 10x422 pen gold fill-pen 0.255.0 box 8x418 12x402 line 15x397 15x436 pen gold fill-pen 255.0.0 box 13x401 17x435 line 20x429 20x447 pen gold fill-pen 255.0.0 box 18x434 22x446 line 25x441 25x464 pen gold fill-pen 255.0.0 box 23x446 27x463 line 30x445 30x493 pen gold fill-pen 255.0.0 box 28x461 32x482 line 35x470 35x504 pen gold fill-pen 255.0.0 box 33x481 37x492 line 40x466 40x498 pen gold fill-pen 0开发者_StackOverflow社区.255.0 box 38x491 42x477
]

  grid: [1100 600]
  step-grid: 5
  max-n-points: (grid/1 / step-grid) - 1
  x-axis-border: 20
  Y-margin: 10
  X0: 5
  grid-color: coal


  main: layout [
      origin 20x0
      space 1x1
      panel1: box 1100x580 black effect reduce [
      'line-pattern 4 4
      'grid 30x30 0x0 (grid-color)
      'draw plot
      ]
      panel2: box 1100x0 black
      panel3: box 1100x20 black
  ]

  view main

How to create interactive chart with Rebol


Here is a little expansion of my previous answer related to your chart viewer.

there are many ways you may adapt it, but it should give you some ideas into solving your problem.

rebol []

plot: []
data: reduce [ ]

refresh: func [/local clr delta prev-pos pos] [
    clear plot
    prev-pos: 0x300
    foreach [clr delta] data [
        pos: prev-pos + (delta * 0x1) + 7x0
        append plot compose [
            pen (clr) line (prev-pos) (pos) fill-pen (clr) pen none circle dot-size (pos) 
        ]
        prev-pos: pos
    ]
    show panel1
]
add-data: func [i][loop i [append data reduce [(random white * .85) + (white * .15) (-20 + random 40)]] refresh]

grid: [800 600]
step-grid: 5
max-n-points: (grid/1 / step-grid) - 1
x-axis-border: 20
Y-margin: 10
X0: 5
grid-color: coal
dot-size: 3

viewer-size: 800x580

; open up console before vid window
main: layout [
    origin 20x0
    space 1x1
    field 800
    panel1: box viewer-size black rate 30 effect [
        line-pattern 4 4
        grid 30x30 0x0 grid-color
        draw plot
    ] feel [
        ;probe first panel1
        over: func [face over? offset /local d][
            panel1/pane: either over? [info-pane][none]
            
            if over? [
                d:  offset/x - face/offset/x - 1
                d: (to-integer d / 7) * 2 + 1
                either d: pick data d [
                    info-box/text: to-string d
                ][
                    panel1/pane: none
                ]
            ]
        ]
        engage: func [face action event] [
            switch action [
                down [
                    drag-start: event/offset
                ]
                up [
                    drag-end: event/offset
                    scroll-size: to-integer abs ((pick (drag-start - drag-end) 1) / 5)
                ]
                time [
                    info-box/offset: event/offset - 20x20 ; the offset is the main-window origin
                    show main
                ]
            ]
        ]
    ]
    panel2: box 800x0 black
    panel3: box 800x20 black
]

insert-event-func [
    either all [
        event/type = 'key 
        none? system/view/focal-face
    ][
        print ["shortcut: " event/key]
        switch event/key [
            ; escape
            #"^[" [quit]
            ; enter/return
            #"^M" [print "resampling data" clear data add-data 100]
            up [dot-size: dot-size + 1 show panel1]
            down [dot-size: dot-size - 1 show panel1]
            left [clear skip tail plot -12 clear skip tail data -2 show panel1]
            right [add-data 2]
        ]
        none
    ][
        event
    ]
]


info-box: make face [
    offset: 0x0
    color: white * .2
    size: 150x30
    text: "0.0.0"
    font: make font [valign: 'middle style: [bold italic]]
]
info-pane: reduce [info-box]

add-data 100
refresh
view/options main [all-over]
focus panel1

Note that as we move the mouse over the chart, we are only using the X component of the mouse to figure out what to display. Better systems are obvious, but this is sufficient to illustrate what needs to be done to receive all mouse move events and act on them.

Also note that the over feel receives Window offsets, so you must remove the face's offset to get the real face-relative coordinates.

How to create interactive chart with Rebol

PS: The red arrow above, is my mouse cursor.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜