定积分累积过程与黎曼和关系 - 知达AI助教 | 教育人工智能案例

做一个动图：高亮曲线下的面积，动态移动上限来展示定积分的累积过程，并对比黎曼和与极限的关系
代码生成中...

知达任务回放中

定积分累积过程与黎曼和关系

代码

预览

66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
            justify-content: center;
            gap: 20px;
            margin-top: 10px;
            font-size: 14px;
        }
        .color-box {
            display: inline-block;
            width: 15px;
            height: 15px;
            margin-right: 5px;
        }
    </style>
</head>
<body>
    <h1>定积分动态演示：f(x) = x²</h1>
    <div class="container">
        <canvas id="myCanvas" width="800" height="500"
            ></canvas>
        
        <div class="controls">
            <button id="startBtn">开始动画</button>
            <button id="pauseBtn" disabled>暂停</button>
            <button id="resetBtn">重置</button>
            <label>分段数: <input type="number" id="rectCount" 
                value="20" min="1" max="100"></label>
        </div>
        <div class="legend">
            <div><span class="color-box" style="background
                -color: rgba(255, 99, 132, 0.6);"></span
                >黎曼和 (矩形)</
 
 
הההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההההה
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX