<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
body {
background: #2c3e50;
}
#leftTopCanvas {
border: 1px solid red;
}
</style>
</head>
<body>
<canvas id="leftTopCanvas" width="900" height="400"></canvas>
<script>
//写文字
function writeText(context, font, color, text, x, y) {
context.font = font;
context.fillStyle = color;
context.textAlign = "center";
context.textBaseline = "middle";
context.fillText(`${
text}`, x, y);
}
//画异型
function writeAnomaly(ctx, rectX, rectY, i, height) {
ctx.beginPath();
ctx.lineWidth = 2;
if (i === 4) {
ctx.strokeStyle = '#34FB7F';
ctx.fillStyle = '#00DA55';
} else {
ctx.strokeStyle = '#FBED00';
ctx.fillStyle = '#DA6D00';
}
rectX += i * 130;
rectY -= i * height;
ctx.
Canvas渐变色
最新推荐文章于 2024-01-13 00:00:00 发布