Arc stroke smoothness

Question

I am currently making a clock with quil and Daniel Shiffman's video tutorial, but I have a trouble drawing arc that the arc drew the stroke little bad than line.

I don't know what's the problem or maybe my code is wrong or something to create an arc, so, this is my code.

(defn draw-state [state]
  ; Clear the sketch by filling it with light-grey color.
  (q/background 150)

  (let [max-scale-h (- 1 (/ 1 12))
        max-scale-m (- 1 (/ 1 60))
        max-scale-s (- 1 (/ 1 60))]
    (let
      [
        h (q/map-range
           (if (> (q/hour) 12) (- (q/hour) 12) (q/hour)) 0 11 0 max-scale-h)
        m (q/map-range (q/minute) 0 59 0 max-scale-m)
        s (q/map-range (q/seconds) 0 59 0 max-scale-s)

        half-width (/ (q/width) 2)
        half-height (/ (q/height) 2)
        ]

      ;; let body
      (q/translate half-width half-height)
      (q/rotate (* -1 q/HALF-PI))

      (q/stroke-weight 8)
      (q/no-fill)

      (let [angle (* q/TWO-PI h)]
        (q/stroke 255 100 150)
        (q/arc 0 0 300 300 0 angle)

        (q/push-style)
        (q/rotate angle)
        (q/line 0 0 60 0)
        (q/pop-style))

      (let [angle (* q/TWO-PI m)]
        (q/stroke 150 100 255)
        (q/arc 0 0 280 280 0 angle)

        (q/push-style)
        (q/rotate angle)
        (q/line 0 0 70 0)
        (q/pop-style))

      (let [angle (* q/TWO-PI s)]
        (q/stroke 150 255 100)
        (q/arc 0 0 260 260 0 angle)

        (q/push-style)
        (q/rotate angle)
        (q/line 0 0 128 0)
        (q/pop-style)
        ))))

UPDATE

I added (q/smooth) in setup as this stackoverflow post, but it still same.

(defn setup []
  (q/smooth)
  (q/frame-rate 30)
  (q/color-mode :rgb)
  )

UPDATE I tried to use smooth in processing and it works but no change with the web version.

Left for web and Right for Processing

UPDATE

Sad Developer create an issue in github to follow the problem

Possible duplicate of [draw line with anti-aliasing](https://stackoverflow.com/questions/12475380/draw-line-with-anti-aliasing) — cfrick, Jan 11 '18 at 13:04
I've filed an issue on the GitHub (https://github.com/quil/quil/issues/229) because it does not happen in Processing.js or in JVM-based Quil. — Sad Developer, Jan 11 '18 at 14:23
@Ampersanda See the discussion on GitHub - jaggedness is caused by the change in processing.js. — Sad Developer, Jan 18 '18 at 07:54

score 2 · Accepted Answer · answered Apr 07 '19 at 09:43

2

Upgrading to quil 3.0.0 will resolve this issue. Quil now uses p5js instead of processing.js which does not have the problem with jagged lines. See http://quil.info/sketches/show/snippet_arc

answered Apr 07 '19 at 09:43

Anthony Galea

150
1
2
9

Arc stroke smoothness

1 Answers1