キャンバス内のテキストは、スクリプトを使用してテキストを表示していません。 ctx.fillTextを使用している場合は何も表示されません。 このコードは正しく機能しませんでした。 以下のコードでこれらの行をコメントすると、コードの動作のみが行われます。キャンバスの中心にある円キャンバス内のテキスト
//ctx.font(30px Arial);
//ctx.fillText(Hello World,10,5);
PLZチェックと答え、
<html>
<head>
<style>
canvas: {
position: absolute;
top: 50%;
left: 50%;
margin-left: -250px;
margin-top: -100px;
border: 2px solid red;
}
</style>
</head>
<body>
<canvas height="300" width="500" id="canvas"></canvas>
<script>
var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
var centerX = canvas.width/2;
var centerY = canvas.height/2;
var radius = 100;
ctx.beginPath(); ctx.arc(centerX,centerY,radius,0,2*Math.PI,false);
ctx.font(30px Arial);
ctx.fillText(Hello World,10,5);
ctx.fillStyle='teal';
ctx.fill();
</script>
</body>
</html>
コンソールを開く(F12を押す)。構文エラーがいくつかあります。 –