Потенциал Морзе — различия между версиями

Материал из Department of Theoretical and Applied Mechanics
Перейти к: навигация, поиск
 
(не показаны 32 промежуточные версии 6 участников)
Строка 1: Строка 1:
<math>
+
[[ТМ|Кафедра ТМ]] > [[Научный справочник]] > [[Потенциалы взаимодействия]] > [[Парные силовые потенциалы взаимодействия | Парные силовые]] > [[Потенциал Морзе | Морзе]]<HR>
 +
 
 +
 
 +
Парный силовой потенциал взаимодействия.
 +
Определяется формулой:
 +
::<math>
 
     \varPi(r) =  
 
     \varPi(r) =  
     \frac{D}
+
     D\left[e^{-2\alpha(r-a)}-2e^{-\alpha(r-a)}\right],
    \left[e^{-2\alpha(r-a)}-2e^{-\alpha(r-a)}\right],
 
 
</math>
 
</math>
  
<math>
+
где
     e^{-2\alpha(r-a)}-2e^{-\alpha(r-a)},
+
* <math>D</math> — энергия связи,
 +
* <math>a</math> — длина связи,
 +
* <math>\alpha</math> — параметр, характеризующий ширину потенциальной ямы.
 +
 
 +
Потенциал имеет один безразмерный параметр <math>\alpha a</math>. Сила, соответствующая потенциалу Морзе, вычисляется по формуле
 +
::<math>
 +
     F(r) = -\varPi'(r) =
 +
    2\alpha D\left[e^{-2\alpha(r-a)}-e^{-\alpha(r-a)}\right].
 
</math>
 
</math>
  
где
+
Для потенциала Морзе жесткость связи, критическая длина связи и прочность связи, соответственно, равны
* <math>D</math> - энергия связи,
+
 
* <math>a</math> - длина связи,
+
::<math>C = \varPi''(a) = 2\alpha^2D, \qquad b = a + \frac{\ln2}{\alpha}, \qquad P = |F(b)| = \frac{\alpha D}2.</math>
* <math>\alpha</math> - параметр, характеризующий ширину потенциальной ямы.
+
 
 +
Сравнение взаимодействия Морзе с взаимодействием [[Потенциал Леннард-Джонса|Леннард-Джонса]] приведено на интерактивных графиках ниже. Показана зависимость от расстояния потенциала <math>\varPi</math> и силы <math>F</math>. Сравнение проведено при одинаковых значениях энергии связи <math>D</math> и длины связи <math>a</math>. Перемещение слайдера позволяет проследить влияние безразмерного параметра <math>\alpha a</math>, при этом энергия связи <math>D</math> и длина связи <math>a</math> остаются неизменными. Значения критической длины связи <math>b</math> и прочности связи <math>P</math>, отмеченные на графиках, соответствуют потенциалу Леннард-Джонса.
 +
 
 +
<htmlet nocache="yes">Krivtsov/MLJ_TM</htmlet>
 +
 
 +
Из графиков видно, что при <math>\alpha a = 6</math> взаимодействия Морзе и Леннард-Джонса близки. В частности, в этом случае для них совпадает жесткость связи <math>C = \varPi''(a)</math>. При увеличении <math>\alpha a</math> ширина потенциальной ямы для взаимодействия Морзе уменьшается, взаимодействие становится более жестким и хрупким. Уменьшение <math>\alpha a</math> приводит к противоположным изменениям — потенциальная яма расширяется, жесткость падает.
 +
 
 +
<div class="mw-collapsible mw-collapsed" style="width:100%" >
 +
'''Текст программы построения графиков на языке JavaScript:''' <div class="mw-collapsible-content">
 +
Файл '''"MLJ.js"'''
 +
<syntaxhighlight lang="javascript" line start="1" enclose="div">
 +
// Сравнение взаимодействий Морзе и Леннард-Джонса
 +
// Разработчики А.М. Кривцов и Д.В. Цветков
 +
// 16.05.2014
 +
// 06.11.2014 коррекция - удаление const (Цветков)
 +
// Интернет: tm.spbstu.ru/Morse
 +
 
 +
function MainMorse(canvas_1, canvas_2) {
 +
 
 +
    // Предварительные установки
 +
 
 +
var X_max = canvas_1.width;
 +
var Y_max = canvas_1.height;
 +
 +
    // Размерные параметры
 +
   
 +
    var a = 1.;    // длина связи
 +
    var D = 1.;    // энергия связи
 +
 
 +
    // Расчет параметров взаимодействия
 +
 
 +
    var b = a * Math.pow(13./7, 1./6);    // положение минимума силы Леннард-Джонса (= 1.1086834 a)
 +
    var b2 = b * b;
 +
    var P0 = 12 * D / a;                  // коэффициент в выражении для силы Леннард-Джонса
 +
    var P = 42. / 169 * P0 / b;          // модуль минимума силы Леннард-Джонса
 +
 
 +
    // Задаваемые параметры
 +
 
 +
    var kappa = 6;  // параметр взаимодействия Морзе
 +
 
 +
    // Область построения графика
 +
    var x_min = 0.3 * a; 
 +
    var x_max = 2.5 * a;
 +
    var y_min_1 = -1.5 * D;   
 +
    var y_min_2 = -1.5 * P;   
 +
 
 +
    var y_max_1 = -y_min_1;   
 +
    var y_max_2 = -y_min_2;   
 +
 +
var N = X_max;                // число точек по оси x
 +
var dx = x_max / N;            // шаг по оси x
 +
var sx = X_max / x_max;        // масштаб по оси x
 +
 
 +
var y_min;   
 +
var y_max;   
 +
var sy; // масштаб по оси y
 +
var Y0;  // положение 0 оси y в экранных координатах
 +
var context;  // на context происходит рисование
 +
 
 +
// Установка флажков чекбоксов
 +
var LJ_flag = true;
 +
var Morse_flag = true;     
 +
 
 +
    Slider_02.min = 2;     
 +
    Slider_02.max = 18;
 +
    Slider_02.step = 0.1;
 +
    Slider_02.value = kappa;   
 +
    Text_02.value = kappa;
 +
 +
draw();
 +
 
 +
    // функция, запускающаяся при перемещении слайдера
 +
    this.set_02 = function(input) { kappa = Number(input); draw(); } 
 +
   
 +
// Функции, запускающиеся при изменении элементов управления
 +
    this.setCheckbox_01 = function(bool) {LJ_flag = bool; draw(); }
 +
this.setCheckbox_02 = function(bool) {Morse_flag = bool; draw(); }
 +
 
 +
// Отображение
 +
 +
function draw()
 +
{
 +
draw_1();
 +
draw_2();
 +
}
 +
 
 +
function draw_1()
 +
    {
 +
  // Расчет параметров графики
 +
 +
y_min = y_min_1;   
 +
y_max = y_max_1;   
 +
 +
sy = Y_max / (y_max - y_min); // масштаб по оси y
 +
Y0 = Y_max + y_min * sy;  // положение 0 оси y в экранных координатах
 +
 
 +
context = canvas_1.getContext("2d");  // на context происходит рисование
 +
 
 +
context.clearRect(0, 0, X_max, Y_max);  // очистить экран
 +
       
 +
        // Горизонтальная ось
 +
        context.strokeStyle = 'lightgrey';
 +
        context.beginPath();
 +
        context.moveTo(0, Y0);
 +
        context.lineTo(X_max, Y0);
 +
        context.stroke();
 +
 
 +
        // Пунктирные линии
 +
        context.beginPath();
 +
        context.setLineDash([5]);
 +
        context.moveTo(a * sx, Y0);
 +
        context.lineTo(a * sx, Y0 + D * sy);
 +
        context.lineTo(0,      Y0 + D * sy);
 +
        context.stroke();
 +
        context.setLineDash([0]);
 +
 
 +
        // Надписи
 +
        context.fillStyle = 'black';
 +
        context.font = "italic 20px Times"
 +
        context.fillText("r", x_max * sx - 15, Y0 - 7);
 +
        context.fillText("Π", 5, 20);
 +
        context.fillText("0", 3, Y0 - 3);
 +
        context.fillStyle = 'grey';
 +
        context.fillText("a", a * sx - 5, Y0 - 3);
 +
        context.fillText("-D", 3, Y0 + D * sy - 5);
 +
 
 +
// Графики потенциалов
 +
Graph(U_LJ, LJ_flag, 'grey');
 +
Graph(U_Morse, Morse_flag, 'magenta');
 +
}
 +
 
 +
    function draw_2()
 +
    {
 +
  // Расчет параметров графики
 +
 +
y_min = y_min_2;   
 +
y_max = y_max_2;   
 +
 +
sy = Y_max / (y_max - y_min); // масштаб по оси y
 +
Y0 = Y_max + y_min * sy;  // положение 0 оси y в экранных координатах
 +
 
 +
context = canvas_2.getContext("2d");  // на context происходит рисование
 +
 
 +
context.clearRect(0, 0, X_max, Y_max); // очистить экран
 +
       
 +
        // Горизонтальная ось
 +
        context.strokeStyle = 'lightgrey';
 +
        context.beginPath();
 +
        context.moveTo(0, Y0);
 +
        context.lineTo(X_max, Y0);
 +
        context.stroke();
 +
 
 +
        // Пунктирные линии
 +
        context.beginPath();
 +
        context.setLineDash([5]);
 +
        context.moveTo(b * sx, Y0);
 +
        context.lineTo(b * sx, Y0 + P * sy);
 +
        context.lineTo(0,      Y0 + P * sy);
 +
        context.stroke();
 +
        context.setLineDash([0]);
 +
 
 +
        // Надписи
 +
        context.fillStyle = 'black';
 +
        context.font = "italic 20px Times";
 +
        context.fillText("r", x_max * sx - 15, Y0 - 7);
 +
        context.fillText("F", 5, 20);
 +
        context.fillText("0", 3, Y0 - 3);
 +
        context.fillStyle = 'grey';
 +
        context.fillText("a", a * sx + 3, Y0 - 3);
 +
        context.fillText("b", b * sx - 3, Y0 - 3);
 +
        context.fillText("-P", 3, Y0 + P * sy - 5);
 +
 +
// Графики сил
 +
Graph(F_LJ, LJ_flag, 'g');
 +
Graph(F_Morse, Morse_flag, 'magenta');
 +
}
 +
 
 +
// Построение графика функции
 +
 +
function Graph(F, flag, color)
 +
{
 +
if (!flag) return;
 +
 +
context.strokeStyle = color;
 +
context.beginPath();
 +
for (var x = x_min; x < x_max; x+=dx)
 +
{
 +
var y = F(x);
 +
var X = x * sx;
 +
var Y = Y0 - y * sy;
 +
 
 +
if (Y > -Y_max) context.lineTo(X, Y); // Графика, сильно выходящяя за границы области, отключается
 +
}
 +
context.stroke();
 +
}
 +
 
 +
    // Потенциал Морзе
 +
   
 +
    function U_Morse(r)
 +
    {
 +
        var al = kappa / a;
 +
var s = Math.exp(al * (a - r));
 +
        return D * s * (s - 2);
 +
    }
 +
 
 +
// Сила Морзе
 +
   
 +
    function F_Morse(r)
 +
    {
 +
        var al = kappa / a;
 +
var s = Math.exp(al * (a - r));
 +
        return 2 * al * D * s * (s - 1);
 +
    }
 +
 +
    // Потенциал Леннард-Джонса
 +
   
 +
    function U_LJ(r)
 +
    {
 +
        var s2 = 1 / (r * r);
 +
        var s6 = s2 * s2 * s2;
 +
        return D * s6 * (s6 - 2);
 +
    }   
 +
 +
// Сила Леннард-Джонса
 +
   
 +
    function F_LJ(r)
 +
    {
 +
        var s2 = 1 / (r * r);
 +
        var s4 = s2 * s2;
 +
        return P0 * s4 * s4 * (s4 * s2 - 1) * r;
 +
    }
 +
 
 +
}
 +
 
 +
</syntaxhighlight>
 +
Файл '''"MLJ.html"'''
 +
<syntaxhighlight lang="html5" line start="1" enclose="div">
 +
<!DOCTYPE html>
 +
<html>
 +
<head>
 +
    <meta charset="UTF-8" />
 +
    <title>LJ & Morse Interaction</title>
 +
    <script src="MLJ.js"></script>
 +
</head>
 +
<body>
 +
    <canvas id="canvasGraph_1" width="800" height="300" style="border:1px solid #000000;"></canvas>
 +
    <canvas id="canvasGraph_2" width="800" height="300" style="border:1px solid #000000;"></canvas>
 +
 
 +
<!--Выбор графика (чекбоксы)-->
 +
<div>
 +
        Взаимодействие:
 +
<font color="#000000" size="5"><B>—</B></font>
 +
<input type="checkbox" id="checkbox_01" name="" onchange="app.setCheckbox_01(this.checked);" checked/>Леннард-Джонса,
 +
        <font color="#0000ff" size="5"><B>—</B></font>
 +
<input type="checkbox" id="checkbox_02" name="" onchange="app.setCheckbox_02(this.checked);" checked/>Морзе:
 +
<font face= "Times New Roman"><I>
 +
αa = 
 +
<input id="Text_02" style="width: 4.2ex;" required pattern="[-+]?([0-9]*\.[0-9]+|[0-9]+)" oninput="
 +
            if (!this.checkValidity()) return;
 +
            app.set_02(this.value);
 +
            document.getElementById('Slider_02').value = this.value;
 +
        ">
 +
<input type="range" id="Slider_02" style="width: 100px;" oninput="app.set_02(this.value); document.getElementById('Text_02').value = this.value;">
 +
</I></font>
 +
</div>
 +
 +
<script type="text/javascript">var app = new MainMorse(
 +
document.getElementById('canvasGraph_1'),
 +
document.getElementById('canvasGraph_2')
 +
);</script>
  
Потенциал имеет один безразмерный параметр <math>\alpha a</math>.
+
</body>
 +
</html> 
 +
</syntaxhighlight>
 +
</div>
 +
</div>
  
== Ссылки ==
+
== См. также ==
 +
* [[Потенциал Леннард-Джонса]]
 
* [[Парные силовые потенциалы взаимодействия]]
 
* [[Парные силовые потенциалы взаимодействия]]
* [[Потенциалы взаимодействия]]
+
 
 +
 
 +
[[Category: Потенциальные взаимодействия|Мо]]
 +
[[Category: Виртуальная лаборатория]]

Текущая версия на 09:11, 11 марта 2015

Кафедра ТМ > Научный справочник > Потенциалы взаимодействия > Парные силовые > Морзе


Парный силовой потенциал взаимодействия. Определяется формулой:

[math] \varPi(r) = D\left[e^{-2\alpha(r-a)}-2e^{-\alpha(r-a)}\right], [/math]

где

  • [math]D[/math] — энергия связи,
  • [math]a[/math] — длина связи,
  • [math]\alpha[/math] — параметр, характеризующий ширину потенциальной ямы.

Потенциал имеет один безразмерный параметр [math]\alpha a[/math]. Сила, соответствующая потенциалу Морзе, вычисляется по формуле

[math] F(r) = -\varPi'(r) = 2\alpha D\left[e^{-2\alpha(r-a)}-e^{-\alpha(r-a)}\right]. [/math]

Для потенциала Морзе жесткость связи, критическая длина связи и прочность связи, соответственно, равны

[math]C = \varPi''(a) = 2\alpha^2D, \qquad b = a + \frac{\ln2}{\alpha}, \qquad P = |F(b)| = \frac{\alpha D}2.[/math]

Сравнение взаимодействия Морзе с взаимодействием Леннард-Джонса приведено на интерактивных графиках ниже. Показана зависимость от расстояния потенциала [math]\varPi[/math] и силы [math]F[/math]. Сравнение проведено при одинаковых значениях энергии связи [math]D[/math] и длины связи [math]a[/math]. Перемещение слайдера позволяет проследить влияние безразмерного параметра [math]\alpha a[/math], при этом энергия связи [math]D[/math] и длина связи [math]a[/math] остаются неизменными. Значения критической длины связи [math]b[/math] и прочности связи [math]P[/math], отмеченные на графиках, соответствуют потенциалу Леннард-Джонса.

Взаимодействие: Леннард-Джонса, Морзе: αa =

Из графиков видно, что при [math]\alpha a = 6[/math] взаимодействия Морзе и Леннард-Джонса близки. В частности, в этом случае для них совпадает жесткость связи [math]C = \varPi''(a)[/math]. При увеличении [math]\alpha a[/math] ширина потенциальной ямы для взаимодействия Морзе уменьшается, взаимодействие становится более жестким и хрупким. Уменьшение [math]\alpha a[/math] приводит к противоположным изменениям — потенциальная яма расширяется, жесткость падает.

Текст программы построения графиков на языке JavaScript:

Файл "MLJ.js"

  1 // Сравнение взаимодействий Морзе и Леннард-Джонса 
  2 // Разработчики А.М. Кривцов и Д.В. Цветков
  3 // 16.05.2014
  4 // 06.11.2014 коррекция - удаление const (Цветков)
  5 // Интернет: tm.spbstu.ru/Morse
  6 
  7 function MainMorse(canvas_1, canvas_2) {
  8 
  9     // Предварительные установки
 10 
 11 	var X_max = canvas_1.width;
 12  	var Y_max = canvas_1.height;
 13 	
 14     // Размерные параметры
 15     
 16     var a = 1.;    // длина связи
 17     var D = 1.;    // энергия связи
 18 
 19     // Расчет параметров взаимодействия
 20 
 21     var b = a * Math.pow(13./7, 1./6);    // положение минимума силы Леннард-Джонса (= 1.1086834 a)
 22     var b2 = b * b;
 23     var P0 = 12 * D / a;                  // коэффициент в выражении для силы Леннард-Джонса
 24     var P = 42. / 169 * P0 / b;           // модуль минимума силы Леннард-Джонса
 25 
 26     // Задаваемые параметры
 27    
 28     var kappa = 6;  						// параметр взаимодействия Морзе
 29 
 30     // Область построения графика
 31     var x_min = 0.3 * a;  
 32     var x_max = 2.5 * a;
 33     var y_min_1 = -1.5 * D;    
 34     var y_min_2 = -1.5 * P;    
 35 
 36     var y_max_1 = -y_min_1;    
 37     var y_max_2 = -y_min_2;    
 38 	
 39 	var N = X_max;                 	// число точек по оси x
 40 	var dx = x_max / N;            	// шаг по оси x
 41 	var sx = X_max / x_max;        	// масштаб по оси x
 42 
 43 	var y_min;    
 44 	var y_max;    
 45 	var sy; 							// масштаб по оси y
 46 	var Y0;  							// положение 0 оси y в экранных координатах
 47 	var context;  						// на context происходит рисование
 48 
 49 	// Установка флажков чекбоксов
 50 	var LJ_flag = true;
 51 	var Morse_flag = true;       
 52 
 53     Slider_02.min = 2;       	
 54     Slider_02.max = 18;
 55     Slider_02.step = 0.1;
 56     Slider_02.value = kappa;     
 57     Text_02.value = kappa;
 58 	
 59 	draw();
 60 
 61     // функция, запускающаяся при перемещении слайдера
 62     this.set_02 = function(input) { kappa = Number(input); 		draw(); }  
 63     
 64 	// Функции, запускающиеся при изменении элементов управления
 65     this.setCheckbox_01 = function(bool) {LJ_flag = bool; 	 draw(); }
 66 	this.setCheckbox_02 = function(bool) {Morse_flag = bool; draw(); }	
 67 
 68 	// Отображение
 69 	
 70 	function draw() 
 71 	{ 
 72 		draw_1(); 
 73 		draw_2(); 
 74 	}
 75 
 76 	function draw_1()
 77     {
 78 	   // Расчет параметров графики
 79 		
 80 		y_min = y_min_1;    
 81 		y_max = y_max_1;    
 82 		
 83 		sy = Y_max / (y_max - y_min); 			// масштаб по оси y
 84 		Y0 = Y_max + y_min * sy;  				// положение 0 оси y в экранных координатах
 85 
 86 		context = canvas_1.getContext("2d");  	// на context происходит рисование
 87 
 88 		context.clearRect(0, 0, X_max, Y_max);  // очистить экран
 89         
 90         // Горизонтальная ось
 91         context.strokeStyle = 'lightgrey';
 92         context.beginPath();
 93         context.moveTo(0, Y0);
 94         context.lineTo(X_max, Y0);
 95         context.stroke();
 96 
 97         // Пунктирные линии
 98         context.beginPath();
 99         context.setLineDash([5]);
100         context.moveTo(a * sx, Y0);
101         context.lineTo(a * sx, Y0 + D * sy);
102         context.lineTo(0,      Y0 + D * sy);
103         context.stroke();
104         context.setLineDash([0]);
105 
106         // Надписи
107         context.fillStyle = 'black';
108         context.font = "italic 20px Times"
109         context.fillText("r", x_max * sx - 15, Y0 - 7);
110         context.fillText("Π", 5, 20);
111         context.fillText("0", 3, Y0 - 3);
112         context.fillStyle = 'grey';
113         context.fillText("a", a * sx - 5, Y0 - 3);
114         context.fillText("-D", 3, Y0 + D * sy - 5);
115 
116 		// Графики потенциалов
117 		Graph(U_LJ, 	LJ_flag, 	'grey');
118 		Graph(U_Morse, 	Morse_flag, 'magenta');
119 	}
120 
121     function draw_2()
122     {
123 	   // Расчет параметров графики
124 		
125 		y_min = y_min_2;    
126 		y_max = y_max_2;    
127 		
128 		sy = Y_max / (y_max - y_min); 			// масштаб по оси y
129 		Y0 = Y_max + y_min * sy;  				// положение 0 оси y в экранных координатах
130 
131 		context = canvas_2.getContext("2d");  	// на context происходит рисование
132 
133 		context.clearRect(0, 0, X_max, Y_max); 	// очистить экран
134         
135         // Горизонтальная ось
136         context.strokeStyle = 'lightgrey';
137         context.beginPath();
138         context.moveTo(0, Y0);
139         context.lineTo(X_max, Y0);
140         context.stroke();
141 
142         // Пунктирные линии
143         context.beginPath();
144         context.setLineDash([5]);
145         context.moveTo(b * sx, Y0);
146         context.lineTo(b * sx, Y0 + P * sy);
147         context.lineTo(0,      Y0 + P * sy);
148         context.stroke();
149         context.setLineDash([0]);
150 
151         // Надписи
152         context.fillStyle = 'black';
153         context.font = "italic 20px Times";
154         context.fillText("r", x_max * sx - 15, Y0 - 7);
155         context.fillText("F", 5, 20);
156         context.fillText("0", 3, Y0 - 3);
157         context.fillStyle = 'grey';
158         context.fillText("a", a * sx + 3, Y0 - 3);
159         context.fillText("b", b * sx - 3, Y0 - 3);
160         context.fillText("-P", 3, Y0 + P * sy - 5);
161 		
162 		// Графики сил
163 		Graph(F_LJ, 	LJ_flag, 	'g');
164 		Graph(F_Morse, 	Morse_flag, 'magenta');
165 	}
166 
167 	// Построение графика функции
168 	
169 	function Graph(F, flag, color)
170 	{
171 		if (!flag) return;
172 		
173 		context.strokeStyle = color;
174 		context.beginPath();
175 		for (var x = x_min; x < x_max; x+=dx)
176 		{
177 			var y = F(x);
178 			var X = x * sx; 
179 			var Y = Y0 - y * sy; 
180 
181 			if (Y > -Y_max) context.lineTo(X, Y);	// Графика, сильно выходящяя за границы области, отключается
182 		}
183 		context.stroke();
184 	}	
185 
186     // Потенциал Морзе
187     
188     function U_Morse(r)
189     {
190         var al = kappa / a;
191 		var s = Math.exp(al * (a - r));
192         return D * s * (s - 2);
193     }
194 
195 	// Сила Морзе
196     
197     function F_Morse(r)
198     {
199         var al = kappa / a;
200 		var s = Math.exp(al * (a - r));
201         return 2 * al * D * s * (s - 1);
202     }
203  
204     // Потенциал Леннард-Джонса
205     
206     function U_LJ(r)
207     {
208         var s2 = 1 / (r * r);
209         var s6 = s2 * s2 * s2;
210         return D * s6 * (s6 - 2);
211     }    
212 	
213 	// Сила Леннард-Джонса
214     
215     function F_LJ(r)
216     {
217         var s2 = 1 / (r * r);
218         var s4 = s2 * s2;
219         return P0 * s4 * s4 * (s4 * s2 - 1) * r;
220     }
221 
222 }

Файл "MLJ.html"

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4     <meta charset="UTF-8" />
 5     <title>LJ & Morse Interaction</title>
 6     <script src="MLJ.js"></script>
 7 </head>
 8 <body>
 9     <canvas id="canvasGraph_1" width="800" height="300" style="border:1px solid #000000;"></canvas>
10     <canvas id="canvasGraph_2" width="800" height="300" style="border:1px solid #000000;"></canvas>
11 
12  	<!--Выбор графика (чекбоксы)-->
13 	<div>
14         Взаимодействие:
15 	<font color="#000000" size="5"><B></B></font>
16 	<input type="checkbox" id="checkbox_01" name="" onchange="app.setCheckbox_01(this.checked);" checked/>Леннард-Джонса,
17         <font color="#0000ff" size="5"><B></B></font>
18 	<input type="checkbox" id="checkbox_02" name="" onchange="app.setCheckbox_02(this.checked);" checked/>Морзе:
19  		<font face= "Times New Roman"><I>
20 		αa =  
21 		<input id="Text_02" style="width: 4.2ex;" required pattern="[-+]?([0-9]*\.[0-9]+|[0-9]+)" oninput="
22             if (!this.checkValidity()) return;
23             app.set_02(this.value);
24             document.getElementById('Slider_02').value = this.value;
25         ">
26 		<input type="range" id="Slider_02" style="width: 100px;" oninput="app.set_02(this.value); document.getElementById('Text_02').value = this.value;">
27 		</I></font>
28 	</div>
29 		
30 	<script type="text/javascript">var app = new MainMorse(
31 		document.getElementById('canvasGraph_1'), 
32 		document.getElementById('canvasGraph_2')
33 	);</script>
34 
35 </body>
36 </html>

См. также[править]