Рисование по канве в Firefox

Можно ли в браузере добавить кнопку, картинка которой периодически изменяется. Т.е. в какой-то момент времени картинка должна перерисоватся.
Простейший вариант - часы, только реализация интересует не через множество картинок-состояний, а через рисование.
Такое вообще возможно реализовать.

Можно. Грубо говоря у канвы есть метод, который вернёт нарисованную на ней картинку в виде Url, который, в свою очередь, можно поставить как .src для картинки.

У меня в нашем проекте есть кнопка, на которой pie chart заполняется, по мере истечения таймера.

Василий Свиридов[досье]Спасибо. А о каком проекте идет речь?

Хотелось бы помотреть на пример, если есть под рукой.

На базе MooTools

var CanvasPieChart = new Class(
{
   initialize: function()
   {
      this._canvas = new Element("canvas",
      {
         width: 32,
         height: 32
      });
      this._ctx = this._canvas.getContext("2d");
      this._icon = // reference the target image
   }

   _updateIcon: function(cur, max)
   {
      if(this._ctx)
      {
         var start = this._toRadian(-90);
         var end = this._toRadian((cur / max * 360) -90);
         var c = {x: 16, y: 16};
         var radius = 14;
         var full = this._toRadian(360);

         this._ctx.clearRect(0,0,32,32);
         //Draw white circle
         this._ctx.beginPath();
         this._ctx.fillStyle = "#A3E3ED";
         this._ctx.arc(c.x, c.y, radius, 0, full, false);
         this._ctx.fill();
         this._ctx.closePath();
         //Draw black pie
         this._ctx.beginPath();
         this._ctx.fillStyle = "#FFF";
         this._ctx.moveTo(c.x, c.y);
         this._ctx.arc(c.x, c.y, radius, start, end, false);
         this._ctx.lineTo(c.x, c.y);
         this._ctx.fill();
         this._ctx.closePath();
         //Draw outline circle
         this._ctx.beginPath();
         this._ctx.arc(c.x, c.y, radius, 0, full, false);
         this._ctx.stroke();
         this._ctx.closePath();
         this._icon.src = this._canvas.toDataURL(); //this._icon содержит html элемент image
      }
   },
   _toRadian: function (degree)
   {
      return Math.PI / 180 * degree;
   }
});

По таймеру вызывается _updateIcon. Первый параметр - текущее значение, второй - максимальное.

Спасибо. Буду пробовать.