Frage von SirisOK, 32

Wie kann ich mit JavaScript das "width" und "hight" von dem Canvas ändern?

Hallo Comunity, ich will mit JavaScript das CanvasFeld verändern(nicht die CSS eigenschaften). ich habe 2 textfelder und einen Button "Go", könnt ihr mir bitte helfen?

<input type="text" id="width">
<input type="text" id="height">
<input type="button" id="go">
<canvas id="cv" height="500" width="500"></canvas>

<script>
  var canvas = document.getElementBy('cv');
  var ctx = canvas.getContext('2d');

  var yLength = 50;
  var xLength = 50;
  var dim = 10;
</script>
Antwort
von Balco, 22

So kannst du direkt die width- und height-Attribute anpassen:

canvas.width = xLength;
canvas.height = yLength;

Und so würdest du die CSS-Eigenschaften anpassen:

canvas.style.width = xLength;
canvas.style.height = yLength;

JSFiddle-Beispiel: https://jsfiddle.net/TheBalco/bo3fr4y5/

Antwort
von voxymo, 24

Du veränderst _immer_ die CSS-Eigenschaften. 

document.getElementById("cv").style.width = xLength + " px"
Kommentar von voxymo ,

obwohl... die CSS-Eigenschaften skalieren den content. Sorry. Hör lieber auf Balco :)

Antwort
von webflexer, 10

Auf die schnelle:

http://codepen.io/anon/pen/mOOeBW

Keine passende Antwort gefunden?

Fragen Sie die Community

Weitere Fragen mit Antworten