2014-09-11 9 views
17

gelen kesik çizgi kaldırmak için, bunasıl bir tuval bağlamında kesikli çizgi çizmek için HTML bağlamda

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

kullanın. dashs Çıkarma

ctx.setLineDash([0]); 

masaüstü tarayıcılarda çalışır, ancak bu mobil Safari çalışmıyor. Çizgilerin çıkarılması ve düz sürekli düz çizgiler çizmenin başka bir yolu var mı?

Teşekkür

cevap

13

Sen boş dizi geçebilir context.save/context.restore

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

// now the default solid line is restored 
+0

Çalışabilir, ancak daha karmaşık algoritmalara sarmak her zaman pratik değildir. Yani gerçekten de Denis-kreshikhin cevabını seçer. –

+3

@PauloBueno. Katılıyorum. Cevabımın zamanında, '[]' nin kısa çizgileri temizleyeceğini bilmiyordum - ya da Denis'nin cevabından önceki yılda bu seçenek mevcut değildi. Her neyse, .save/.restore tuval durumu için bir tasarım sebebi yoksa, şimdi çizgi çekmek için [] 'yi kullanacağım. Başların için teşekkürler. :-) – markE

+0

Teşekkürler çok adam :) –

34

içine kodunuzu sarın. Ayrıca çizgiyi sağlamlaştırır.

ctx.setLineDash([]) 
+5

Bu cevap. Kesinlikle daha fazla oy hak ediyor. – Rodrigo

+5

Bu, kabul edilen yanıttan çok daha iyi. İçeriği kaydetmek ve geri yüklemek pahalı ve senaryodaki bir israftır. – mclaassen