а вот градиент, нарисованный с помощью canvas и однопиксельного изображения
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<canvas id="canvas" width="64" height="64"></canvas>
<script type="text/javascript">
var tmpCtx = document.getElementById('canvas').getContext('2d');
var img = new Image();
img.onload = function(){
for( var i=0; i<64; i++ )
for( var j=i; j<i+64; j++ )
tmpCtx.drawImage(this, j, 0, 1, 1, j-i, i, 1, 1);
};
img.src = 'http://javascript.ru/forum/attachment.php?attachmentid=645&stc=1&d=1295143633';
</script>
</body>
</html>
|
Сообщение от x-yuri
|
|
под windows?
|
|
Сообщение от monolithed
|
|
ага
|
ну они за safari под windows меньше следят
и, наконец... сферический градиент в вакууме
промежуточный вариант:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<canvas id="canvas" width="128" height="128"></canvas>
<script type="text/javascript">
var ctx = document.getElementById('canvas').getContext('2d');
var img = new Image();
img.onload = function(){
for( var r=0; r<img.width; r++ )
for( var phi=0; phi<2*Math.PI; phi++ )
ctx.drawImage(this, r, 0, 1, 1, 64+r*Math.cos(phi), 64+r*Math.sin(phi), 1, 1);
};
img.src = 'http://javascript.ru/forum/attachment.php?attachmentid=647&stc=1&d=1295146484';
</script>
</body>
</html>
окончательный:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<canvas id="canvas" width="128" height="128"></canvas>
<script type="text/javascript">
var ctx = document.getElementById('canvas').getContext('2d');
var img = new Image();
img.onload = function(){
for( var y=0; y<128; y++ )
for( var x=0; x<128; x++ ){
var r = Math.round(
Math.sqrt(Math.pow(x-64, 2) + Math.pow(y-64, 2))
);
if( r < 64 )
ctx.drawImage(this, r, 0, 1, 1, x, y, 1, 1);
}
};
img.src = 'http://javascript.ru/forum/attachment.php?attachmentid=647&stc=1&d=1295146484';
</script>
</body>
</html>