编程3d效果图
```html
canvas {
border: 1px solid black;
}
// 获取 canvas 元素
var canvas = document.getElementById('myCanvas');
var ctx = canvas.getContext('2d');
// 创建立方体的坐标点
var vertices = [
[50, 50, 50],
[150, 50, 50],
[150, 150, 50],
[50, 150, 50],
[50, 50, 150],
[150, 50, 150],
[150, 150, 150],
[50, 150, 150]
];
// 定义连接顶点的边
var edges = [
[0, 1],
[1, 2],
[2, 3],
[3, 0],
[4, 5],
[5, 6],
[6, 7],
[7, 4],
[0, 4],
[1, 5],
[2, 6],
[3, 7]
];
// 绘制立方体函数
function drawCube() {
ctx.clearRect(0, 0, canvas.width, canvas.height);
// 绘制边
ctx.strokeStyle = 'black';
ctx.beginPath();
for (var i = 0; i < edges.length; i ) {
var startVertex = vertices[edges[i][0]];
var endVertex = vertices[edges[i][1]];
ctx.moveTo(startVertex[0], startVertex[1]);
ctx.lineTo(endVertex[0], endVertex[1]);
}
ctx.stroke();
}
// 调用绘制立方体函数
drawCube();