Численное интегрирование

Материал из Department of Theoretical and Applied Mechanics
Перейти к: навигация, поиск
Виртуальная лаборатория > Численное интегрирование

Данное интерактивное приложение позволяет вычислить интеграл заданной с клавиатуры функции с помощью метода прямоугольников.

Можно использовать любые функции и свойства объекта Math языка JavaScript (описание на русском, английском), например:

  • функции: sin(x), exp(x), round(x), abs(x), min(x);
  • свойства: PI, E, SQRT2, LN10.


Важно! Чтобы возвести число в степень, вместо x^3 нужно писать pow(x, 3)

(оператор ^ в JavaScript означает логическую операцию "Исключающее ИЛИ").


Скачать Integrate_v3-6_release.zip.

Текст программы на языке JavaScript (разработчик Цветков Денис):

Файл "Integrate.js"

  1 window.addEventListener("load", Main_Integrate, true);
  2 function Main_Integrate() {
  3 
  4     Integrate_canvas.onselectstart = function () {return false;};     // запрет выделения canvas
  5     var context = Integrate_canvas.getContext("2d");                  // на context происходит рисование
  6 
  7     var w = Integrate_canvas.width;
  8     var h = Integrate_canvas.height;
  9 
 10     // функции и переменные, объявленные через this, можно будет вызывать по сокращенному названию (например, sin(x), PI)
 11     var math_methods = Object.getOwnPropertyNames(Math);
 12     for (var i in math_methods)
 13         this[math_methods[i]] = Math[math_methods[i]];
 14 
 15     calculate_button.onclick = get_and_calc;
 16     function get_and_calc() {
 17         var script = document.createElement('script');
 18         script.innerHTML = "function f(x) {return " + function_text.value + "};" +
 19             "x1 = " + x1_text.value + ";" +
 20             "x2 = " + x2_text.value + ";";
 21         document.getElementsByTagName('head')[0].appendChild(script);
 22         integral(f, x1, x2, accuracy_number.value);
 23     }
 24 
 25     function on_enter_up(e) {
 26         e = e || window.event;
 27         if (e.keyCode === 13) {
 28             get_and_calc();
 29         }
 30         return false;                                                   // отменяем действие по умолчанию
 31     }
 32 
 33     function_text.onkeyup = on_enter_up;
 34     x1_text.onkeyup = on_enter_up;
 35     x2_text.onkeyup = on_enter_up;
 36     accuracy_number.onkeyup = on_enter_up;
 37 
 38     function calculate(f, x1, x2, n) {
 39         var integral = {};
 40         integral.D = {};
 41         integral.D.x = [];
 42         integral.D.fx = [];
 43         var summ = 0;
 44         var k1 = Math.floor(n / w);         // каждый k1-ый элемент будет отправлен на рисование
 45         if (k1 < 1) k1 = 1;
 46 
 47         var interval = (x2 - x1) / n;
 48         for (var i = 0; i < n; i++) {
 49             var x = x1 + interval * i;
 50             var fx = f(x);
 51             if (fx == Number.POSITIVE_INFINITY || fx == Number.NEGATIVE_INFINITY || isNaN(fx)) continue;
 52             summ += interval * fx;
 53 
 54             if (i % k1 == 0) {
 55                 integral.D.x.push(x);
 56                 integral.D.fx.push(fx);
 57             }
 58         }
 59         integral.summ = summ;
 60         return integral;
 61     }
 62 
 63     function integral(f, x1, x2, n) {
 64         var I = calculate(f, x1, x2, n);
 65         result_span.innerHTML = I.summ.toPrecision(accuracy_number.value.length);
 66         draw(I.D, x1, x2);
 67     }
 68 
 69     function draw(D, x1, x2) {
 70         context.clearRect(0, 0, w, h);
 71         context.beginPath();
 72 
 73         // найдем минимум и максимум функции (точнее не всей функции, а только точек, отправленных на рисование)
 74         var len = x2 - x1;
 75         var f_max = Number.NEGATIVE_INFINITY, f_min = Number.POSITIVE_INFINITY;
 76         for (var i = 0; i < D.fx.length; i++) {
 77             f_max = (f_max > D.fx[i]) ? f_max : D.fx[i];
 78             f_min = (f_min < D.fx[i]) ? f_min : D.fx[i];
 79         }
 80 
 81         // график
 82         var h_center = f_max / (f_max - f_min) * h;
 83         context.moveTo(0, h_center);
 84         for (var i = 0; i < D.fx.length; i++) {
 85             var x = D.x[i];
 86             context.lineTo((x - x1) / len * w, h_center - D.fx[i] / (f_max - f_min) * h);
 87         }
 88         context.lineTo(w, h_center);
 89         context.fill();
 90 
 91         // интерфейс
 92         context.beginPath();
 93         context.moveTo(0, h_center);
 94         context.lineTo(w, h_center);
 95         context.moveTo(-x1 / (x2 - x1) * w, 0);
 96         context.lineTo(-x1 / (x2 - x1) * w, h);
 97         context.stroke();
 98     }
 99 
100     context.fillStyle = "#888888";
101     get_and_calc();
102 }

Файл "Integrate.html"

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4     <meta charset="UTF-8" />
 5     <title>Integrate</title>
 6     <script src="Integrate.js"></script>
 7 </head>
 8 <body>
 9     <canvas id="Integrate_canvas" width="600" height="600" style="border:1px solid #000000;"></canvas><br>
10     f(x) = <input type="text" id="function_text" style="width: 80ex;" value="sin(sqrt(x)) * sin(x * x)"/><br>
11     x1 = <input type="text" id="x1_text" style="width: 25ex;" value="0"/><br>
12     x2 = <input type="text" id="x2_text" style="width: 25ex;" value="PI * 3"/><br><br>
13     Точность: <input type="number" id="accuracy_number" min=2 style="width: 12ex;" value="100000"/><br>
14     <input type="button" id="calculate_button" value="Посчитать"/><br><br>
15     Результат: <span id="result_span"></span>
16 </body>
17 </html>

Предлагаемые направления развития стенда

  • Применить другие методы численного интегрирования (например, метод трапеций или метод Монте-Карло)
  • Научиться определять сходимость функции, и в случае, если функция не сходится - выдавать предупреждение.
  • Математически определять и выводить погрешность результата.

Заметка разработчику

В данной программе использована возможность языка JavaScript создавать и запускать программный код "на лету", без перезапуска программы. Это очень важная возможность (которую достаточно трудно, а, порой, невозможно применить в других языках), которая позволяет разработчику без особых усилий создавать максимально гибкий интерфейс. Например, можно дать пользователю возможность быстро задать специфические граничные условия, или позволить исследовать полученную систему, просматривать данные и выводить нужные графики прямо в окне браузера.