HTML CSS JS 画的效果图


html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>title>
		<style type="text/css">
			#d1{
				
				background: #CCCCFF;
				border: 2px red solid;
				position: absolute;
				left:50%;
				right: 50%;
				transform: translate(-50%);
							
				
			}
		style> 
		
	head>
	<body>
		<canvas id="d1">
			
		canvas>
		
			<script type="text/javascript">
			var canvas=document.querySelector("#d1");
			canvas.width="600";
			canvas.height="600";
			var cxt=canvas.getContext("2d");
			cxt.beginPath();
			cxt.strokeStyle="#008B8B";
		 
			
			var w=600;
			var h=600;
			let points=new Array(24);
			for(let i=0;ilength;i++)
			points[i]= new Array(2);
			
			var num =24;
			for(var i=0;i
				var x=300*Math.cos(2*3.14*i/num);
				var y=300*Math.sin(2*3.14*i/num);
				points[i][0] = x+300;
				points[i][1] = y+300;
				document.writeln(x+" "+y);
			}
			
			for(var i=0;i
			for(var j=0;j
				
			cxt.moveTo(points[i][0],points[i][1]);
			cxt.lineTo(points[j][0],points[j][1]);
			}
			cxt.stroke();		
			
		script>
		
		
	body>
html>

相关阅读:
C语言版：统计1-2019范围中出现数字9的个数
【每日练习】LeetCode24
A的闭包+B的闭包包含于A+B的闭包
图的存储 ——边集数组 & 邻接表
荧光聚苯乙烯AIE微球，氨基的产品波长和粒径范围
如何修复和解决 IP 地址冲突
数据结构课程设计——用单链表存储多项式实现多项式相加（提供源码和报告）
alsa pcm设备之設置软件相关参数
计算机毕业设计：基于html制作大学生网上报到系统响应式模板项目源码
Spring Boot 2.x源码系列【3】启动流程深入解析之创建引导上下文

原文地址：https://blog.csdn.net/laocooon/article/details/134289071