HTML5 Canvas в проблеме Android

Question

Я хочу сделать текст с градиентом с помощью canvas, и мой компьютер правильно отображает код, но android отображает его как обычный градиент с текстом внутри него. Как я могу решить эту проблему, если это возможно?
Вот JavaScript:

function text() {
var canvas = document.getElementById('header-text');
var ctx = canvas.getContext('2d');
var gradient = ctx.createLinearGradient(0, 0, 0, 29);
gradient.addColorStop(0, "#fcfcfc");
gradient.addColorStop(1, "#ccc");
ctx.font = "bold 29px helvetica, arial, sans-serif";
ctx.shadowColor = "#232323";
ctx.shadowOffsetX = 2;
ctx.shadowOffsetY = 2;
ctx.shadowBlur = 2;
ctx.fillStyle = gradient;
ctx.fillText("Company name", 0, 23);
}

Answer 1

Извините, это ошибка.

Вернее, градиент для fillText еще не реализован в браузере Android. Если вы напишите это:

var gradient = ctx.createLinearGradient(0, 0, 0, 29);
gradient.addColorStop(0, "#fcfcfc");
gradient.addColorStop(1, "#ccc");
ctx.fillStyle = 'red';
ctx.fillStyle = gradient; // replace the fillstyle with a gradient
ctx.fillText("Testing", 0, 23);
ctx.fillRect(0,0,20,20)

Вы увидите, что текст и прямоугольник имеют градиент в Chrome.

Смотри здесь в прямом эфире .

Но на устройстве Android текст будет красным, а прямоугольник будет градиентом!

Сам Chrome до сих пор не имеет полной поддержки всех случаев градиента холста, которые были изложены автором спецификации (он же сотрудник Google). Я отправил сообщение об ошибке здесь .