Подгонка размера канваса после поворота на 90 градусов
 

В канвасе прямоугольный рисунок (ширина и высота не равны), ширина и высота канваса равна с шириной и высотой рисунка, если повернуть его на 90 градусов нижеприведенным кодом, то рисунок не вписывается в канвас. При изменении размеров канваса, контекст затирается. Как правильно подгонять canvas?

var cnvas=document.getElementById('WorkCanvas');
  var ctx = cnvas.getContext('2d');
  ctx.translate(cnvas.width/2,cnvas.height/2);
  ctx.rotate(Math.PI/2);
  ctx.drawImage(cnvas, -(cnvas.width/2), -(cnvas.height/2));

может быть просто изображение из первого canvas перенести с поворотом на второй с другими размерами, а первый скрыть ?

пример http://learn.javascript.ru/play/Y13B4

Спасибо, Ваш вариант работает (хотя не все понимаю - например почему ворочать контекст именно второго канваса, ладно, разберусь ), я подобный вариант пытался сделать (с транзитным канвасом), но что-то не пошло, пока что сделал так:

var cnvas=document.getElementById('WorkCanvas');
  var ctx = cnvas.getContext('2d');
  var btmap=ctx.getImageData(0, 0, cnvas.width, cnvas.height);
  var d = btmap.data;
  var stts= new Array (d.length);
  
  var kvostr=cnvas.height;
  var kvokol=cnvas.width;
  var allkvo=kvostr*kvokol;
  var nstr=1; //номер строки
  var nkol=0; //номер столбца
  var ff=0;
  
  for (var i=0;i<allkvo;i++)
  {
    ff=nstr*4*kvokol-nkol*4;
    gg=4*i;
   stts[gg+3] = d[ff];//d[ff]; 
   stts[gg+2] = d[ff-1]; 
   stts[gg+1] = d[ff-2]; 
   stts[gg] = d[ff-3]; 
   nstr++;
   if (nstr>kvostr) {nstr=1; nkol++};
  }
  var t=cnvas.height;
  cnvas.height=cnvas.width;
  cnvas.width=t; 
  var ctx = cnvas.getContext('2d');
  var btmap=ctx.getImageData(0, 0, cnvas.width, cnvas.height);
  var d = btmap.data;
  for( var i=0; i < stts.length; i++ ) d[i]=stts[i]; 
  ctx.putImageData(btmap, 0, 0);

нужно арифметику доработать, чтобы цвета не плыли и немного оптимизировать