0

したがって、私はjQueryを初めて使用します.resize（）イベントハンドラーを使用して要素のサイズを変更し、特定の要素のparent（）divを取得し、attr（）メソッドを使用して属性を設定できるAPIを調べてきました。

次のコードを試してみましたが、コンソールに出力すると、すべてが期待どおりのように見えます(キャンバス要素の親に応じて幅が変わります)。しかし、ウィンドウのサイズを変更すると、キャンバスが消えます:

$(window).resize(function() {
  var width = $('#line_chart_price').parent().width();
  $('#line_chart_price').attr('width', width);
});

ここで何が間違っていますか？

どうもありがとう

4

2 に答える 2

1

サイズ変更時にキャンバス コンテキストを再描画する必要があります。

JS

var can = document.querySelector('canvas');
canCtx = can.getContext('2d');
canCtx.fillRect(50, 25, 50, 100); // a basic rect. you could set this to the width of the parent off the bat if you want.

$(window).resize(function () {
  width = $(can).parent().width();
  can.width = width;
  canCtx.fillRect(50, 25, width, 100);
});

jsbin

于 2013-07-29T13:56:33.260 に答える