2014-09-11 14 views
17

Aby narysować linię przerywaną w kontekście płótnie, używam tegoJak usunąć linia przerywana z kontekstu HTML

var canvas = document.getElementById('canv'); 
    ctx = canvas.getContext('2d');   
    ctx.setLineDash([5]); 

Kiedy nie chcemy narysować więcej liniami przerywanymi to zrobić.

ctx.setLineDash([0]); 

Usuwanie dashs działa w przeglądarkach desktopowych, ale to nie działa w mobilnym Safari. Czy istnieje inny sposób usuwania kresek i rysowania prostych, ciągłych linii?

Dzięki

Odpowiedz

13

Wrap kodu wewnątrz context.save/context.restore

ctx.save(); 
ctx.setLineDash([5]); 
// draw dashed stuff 
ctx.restore(); 

// now the default solid line is restored 
+0

Może działać, ale nie zawsze jest rzeczą praktyczną zawijanie go w bardziej złożone algorytmy. Tak naprawdę wybrałbym odpowiedź @ Denisa-kreshikhina. –

+3

@ PaulaoBueno. Zgadzam się. W momencie mojej odpowiedzi nie wiedziałem, że "[]" wyczyści kreski - a może ta opcja nie była dostępna w roku poprzedzającym odpowiedź Denisa. W każdym razie, jeśli nie ma powodu projektowego do .save/.restore stan canvas, będę teraz używać '[]', aby usunąć kreski. Dzięki za heads up. :-) – markE

+0

Wielkie dzięki :) –

34

można przekazać pustą tablicę. Powoduje również, że linia jest stała.

ctx.setLineDash([]) 
+5

To jest odpowiedź. Na pewno zasługuje na więcej głosów. – Rodrigo

+5

To znacznie lepiej niż zaakceptowana odpowiedź. Zapisywanie i przywracanie kontekstu jest kosztowne i marnuje scenariusz. – mclaassen

Powiązane problemy