Dokumentation (canvas.quaese.de)
Linienstile - lineWidth
Mit dem Attribut lineWidth wird die Linienstärke gesetzt.
Der Initialwert beim
Erstellen des canvas ist 1.0. Wie der Startwert vermuten lässt, sind auch nicht-ganzzahlige
Zuweisungen möglich. Damit können Zeichenungenauigkeiten ausgeglichen werden, aber auch entstehen.
lineWidth
lineWidth = value
value - Fliesskommawert
Schematische Darstellung
Die folgende Abbildung zeigt die ganzzahligen Strichstärken von 1.0 bis 8.0.
Beispiel
function drawIt(){
var objCanvas = document.getElementById("canvas_id");
// Falls das Objekt unterstützt wird
if(objCanvas.getContext){
// Kontext
var objContext = objCanvas.getContext('2d');
var dblStart = 1.0;
for(var i=0; i<20; i++){
var dblKorr = (i%2 == 0)? 0.5 : 0;
objContext.translate(15+dblKorr, 0);
objContext.beginPath();
objContext.moveTo(0, 0);
objContext.lineTo(0, 100);
objContext.lineWidth = dblStart + i*0.5;
objContext.stroke();
}
}else{
// Sonstiger Code
}
}
Erläuterung
Im Beispiel werden in einer for-Schleife 20 Linien nebeneinander gezeichnet, wobei die Linienstärke
in jedem Teilschritt um 0.5 Einheiten erhöht wird. Wie zu erkennen ist, verschwimmen an jeder zweiten Linie die
Konturen. Das ist auf die nicht-geradzahlige Wertzuweisung an lineWidth zurückzuführen.