пытается написать код, который будет делать следующее.заполнение холста линейным градиентом
Пользователь выберет цвет, щелкнув по нему, и элемент холста будет заполнен тем же цветом, что и градиент, и фиксированный белый цвет. Код кажется неработоспособным.
<html>
<head>
<style>
#chart{width:80px;height:80px;position:fixed;top:20px;left:20px;}
#mycanvas{width:200px;height:150px;position:fixed;top:250px;left:200px;border:1px solid black;}
</style>
</head>
<body>
<script>
function mygradient(colors){
var canvas=document.getElementById('mycanvas');
var ctx=canvas.getContext("2d");
var grad=ctx.createLinearGradient(0,0,190,0);
grad.addColorStop(0,colors);
grad.addColorStop(1,"white");
ctx.fillStyle=grad;
ctx.fillRect(0,0,200,0);
}
</script>
<table id="chart">
<tr>
<td bgColor="#FF8000" onClick="mygradient(this.bgColor);"></td>
<td bgColor="#FFBF00" onClick="mygradient(this.bgColor);"></td>
</tr>
</table>
<canvas id="mycanvas"style=""></canvas>
</body>
</html>
было бы здорово, если бы вы упомянули ошибки, которые я сделал в своем коде? –
высота 0 ничего не показывает: ctx.fillRect (0,0,200,0); он должен быть ctx.fillRect (0,0,200,150); –