![](/img/trans.png)
[英]I want to increase and decrease the font size and brightness of number inside the circle. How to do that?
[英]I want to increase the circle size to radius 200 and then decrease it in JavaScript
因此,在這里,我嘗試制作一個半徑為1的圓,並將其增加到200,然后希望它變小到1,然后循環。
我知道g_radius ++
和g_radius --
正在創建一種效果,好像它已經停止但無法找出解決方案。
到目前為止,這是我嘗試過的。 我可以增加或減少。
<html>
<canvas width="800" height="600" id="myCanvas"> </canvas>
<script>
var g_canvas = document.getElementById("myCanvas");
var g_context = g_canvas.getContext("2d");
var g_radius = 10 ;
function f_drawCircle()
{
g_context.fillStyle = "blue" ;
g_context.beginPath();
g_context.arc(400,300,g_radius,0,2*Math.PI) ;
g_context.fill();
}
function f_clearCanvas()
{
g_context.clearRect(0,0,g_canvas.width,g_canvas.height);
g_context.strokeRect(0,0,g_canvas.width,g_canvas.height);
}
function f_varySize()
{
g_radius ++ ;
if(g_radius > 200)
{
g_radius -- ;
}
}
function f_loop()
{
f_varySize();
f_clearCanvas();
f_drawCircle();
}
setInterval(f_loop,10);
</script>
創建一個用於大小變化方向的變量,然后將其值添加到g_radius
。 像這樣:
var dir = 1;
function f_varySize() {
if (g_radius > 200) {
dir = -1;
}
if (g_radius < 2) {
dir = 1;
}
g_radius += dir;
}
看到它在行動 。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.