Javascript 如何在三条边上画一个三角形？

我将有3个输入和一个按钮。单击此按钮时，应绘制一个三角形，其中3条边的长度等于输入中的值。如何组织？我发现：

context.beginPath();
context.moveTo(30, 20);
context.lineTo(some_value1,some_value2);
context.lineTo(some_value3,some_value4);
context.closePath();

但这种方法适用于双面绘制。

---

我希望现在我已经详细描述了这个问题。提前感谢。

您需要先计算每个点的笛卡尔坐标。您可以将第一个点设置为

[0,0]

，第二个点将位于

[x1,0]

，其中

x1

是第一行的长度。第三点需要计算，请看如何计算：

//硬编码，但您可以从用户那里获得
var AB=40；
var BC=50；
var AC=30；
变量A=[0，0]；//起始坐标
VarB=[0，AB]；
var C=[]；
//计算第三点
C[1]=（AB*AB+AC*AC-BC*BC）/（2*AB）；
C[0]=Math.sqrt（AC*AC-C[1]*C[1]）；
控制台日志（A、B、C）；
var canvas=document.getElementById（'canvas'）；
var ctx=canvas.getContext（'2d'）；
ctx.beginPath（）；
ctx.moveTo（A[0]，A[1]）；
ctx.lineTo（B[0]，B[1]）；
ctx.lineTo（C[0]，C[1]）；
ctx.fill（）
您需要首先计算每个点的笛卡尔坐标。您可以将第一个点设置为
[0,0]
，第二个点将位于
[x1,0]
，其中
x1
是第一行的长度。第三点需要计算，请看如何计算：



//硬编码，但您可以从用户那里获得
var AB=40；
var BC=50；
var AC=30；
变量A=[0，0]；//起始坐标
VarB=[0，AB]；
var C=[]；
//计算第三点
C[1]=（AB*AB+AC*AC-BC*BC）/（2*AB）；
C[0]=Math.sqrt（AC*AC-C[1]*C[1]）；
控制台日志（A、B、C）；
var canvas=document.getElementById（'canvas'）；
var ctx=canvas.getContext（'2d'）；
ctx.beginPath（）；
ctx.moveTo（A[0]，A[1]）；
ctx.lineTo（B[0]，B[1]）；
ctx.lineTo（C[0]，C[1]）；
ctx.fill（）
您需要首先计算每个点的笛卡尔坐标。
上下文。lineTo
方法有两个参数-
x
和
y
坐标。@MartinAdámek，您知道任何方法吗？您从用户那里得到了哪些参数？只有三条边的长度吗？@MartinAdámek是的。只有三条边的长度。编辑
lineTo
您需要首先计算每个点的笛卡尔坐标。另外
上下文。lineTo
方法有两个参数-
x
和
y
坐标。@MartinAdámek，您知道任何方法吗？您从用户那里得到了哪些参数？只有三条边的长度吗？@MartinAdámek是的。只有三条边的长度。编辑
lineTo
非常感谢！非常感谢你！