代码之家  ›  专栏  ›  技术社区  ›  joe

交互式数学表格

  •  0
  • joe  · 技术社区  · 6 年前

    背景:
    这是我第一个数学和物理模拟的小项目。我知道怎么做 dispatch 一种状态 Component 让他们改变自己。但我对可视化还不太熟悉,尤其是 Javascript

    要求:
    1。他们至少得3分。 First 以及 last 时间线
    2。 numberOfBreakPoints 正在根据 form
    三。 maximumRuntime 线内反射 形式

    图片中的示例

    picture

    问题:
    如何使用 javascript 画一条像图片中那样的线?

    2 回复  |  直到 6 年前
        1
  •  1
  •   Rohith Murali    6 年前

    对于这样的视图,可以使用antd npm模块的step组件轻松地完成这项工作。

    你可以从这里得到更多的信息 link

        2
  •  1
  •   Sheshank S.    6 年前

    请看一看画布,这应该对你有帮助:)

    这是w3schools.com的文章: https://www.w3schools.com/graphics/canvas_drawing.asp

    下面是一些示例代码

    var canvas = document.getElementById("myCanvas");
    var ctx = canvas.getContext("2d");
    ctx.fillStyle = "#191919";
    ctx.fillRect(0,0,400,5);
    <!DOCTYPE html>
    <html>
    <body>
    
    <canvas id="myCanvas" width="200" height="100">
    Your browser does not support the canvas element.
    </canvas>
    
    
    </body>
    </html>