Укороченное взаимодействие Леннард-Джонса — различия между версиями

  1 // Укороченное взаимодействий Леннард-Джонса 
  2 // Short Lennard-Jones (SLJ) interaction
  3 // Разработчик А.М. Кривцов 
  4 // 17.05.2014 
  5 // 06.11.2014 коррекция - удаление const (Цветков)
  6 // Интернет: tm.spbstu.ru/SLJ
  7 
  8 function MainSLJ(canvas) {
  9 
 10     // Предварительные установки
 11 
 12 	var X_max = canvas.width;
 13  	var Y_max = canvas.height;
 14 	
 15     // Размерные параметры
 16     
 17     var a = 1.;    // длина связи
 18     var D = 1.;    // энергия связи
 19 
 20     // Расчет констант взаимодействия
 21 
 22     var b = a * Math.pow(13./7, 1./6);    // положение минимума силы Леннард-Джонса (= 1.1086834 a)
 23     var b2 = b * b;
 24     var P0 = 12 * D / a;                  // коэффициент в выражении для силы Леннард-Джонса
 25     var P = 42. / 169 * P0 / b;           // модуль минимума силы Леннард-Джонса
 26 
 27 	// Переменные параметры взаимодействия
 28 	
 29 	var ac;   								// радиус обрезания взаимодействия
 30 
 31 	var ac2;								// квадрат ac
 32 	
 33     // Задание начальных значений параметров
 34    
 35 	set_ac(1.4 * a);
 36 
 37     // Область построения графика
 38     var x_min = 0.9 * a;  
 39     var x_max = 2.5 * a;
 40     var y_min = -1.2 * P;    
 41     var y_max = 2 * P;      
 42 
 43  	var N = X_max;                 	// число точек по оси x
 44 	var dx = x_max / N;            	// шаг по оси x
 45 	var sx = X_max / x_max;        	// масштаб по оси x
 46 
 47 	var sy; 							// масштаб по оси y
 48 	var Y0;  							// положение 0 оси y в экранных координатах
 49 	var context;  						// на context происходит рисование
 50 
 51 	// Установка флажков чекбоксов
 52 	var LJ_flag = true;
 53 	var SLJ_flag = true;
 54 
 55     // настройка слайдеров и текстовых полей
 56  
 57 	Slider_01.min = 1.11 * a;       		// лучше было бы взять acSlider.min = b, но b не кратно значению acSlider.step, что портит слайдер
 58     Slider_01.max = x_max;
 59     Slider_01.step = 0.01 * a;
 60     Slider_01.value = ac;     	
 61     Text_01.value = ac;
 62 	
 63 	draw();
 64 
 65     // функция, запускающаяся при перемещении слайдера
 66     this.set_01 = function(input) { set_ac(input);	draw(); }  
 67     
 68 	// Функции, запускающиеся при изменении элементов управления
 69     this.setCheckbox_01 = function(bool) {LJ_flag = bool; 	 draw(); }
 70 	this.setCheckbox_02 = function(bool) {SLJ_flag = bool; 	 draw(); }	
 71 
 72 	function set_ac(value)
 73 	{
 74 		ac = Number(value);
 75 		ac2 = ac * ac;	
 76 	}
 77 
 78 	// Отображение
 79 	
 80 	function draw() 
 81 	{ 
 82 	   // Расчет параметров графики
 83 		
 84 		sy = Y_max / (y_max - y_min); 			// масштаб по оси y
 85 		Y0 = Y_max + y_min * sy;  				// положение 0 оси y в экранных координатах
 86 
 87 		context = canvas.getContext("2d");  	// на context происходит рисование
 88 
 89 		context.clearRect(0, 0, X_max, Y_max); 	// очистить экран
 90         
 91         // Горизонтальная ось
 92         context.strokeStyle = 'lightgrey';
 93         context.beginPath();
 94         context.moveTo(0, Y0);
 95         context.lineTo(X_max, Y0);
 96         context.stroke();
 97 
 98         // Пунктирные линии
 99         context.beginPath();
100         context.setLineDash([5]);
101         context.moveTo(b * sx, Y0);
102         context.lineTo(b * sx, Y0 + P * sy);
103         context.lineTo(0,      Y0 + P * sy);
104         context.stroke();
105         context.setLineDash([0]);
106 
107         // Надписи
108         context.fillStyle = 'black';
109         context.font = "italic 20px Times";
110         context.fillText("r", x_max * sx - 15, Y0 - 7);
111         context.fillText("F", 5, 20);
112         context.fillText("0", 3, Y0 - 3);
113         context.fillStyle = 'grey';
114         context.fillText("a", a * sx + 3, Y0 - 3);
115         context.fillText("b", b * sx - 3, Y0 - 3);
116         context.fillText("-P", 3, Y0 + P * sy - 5);
117         if (SLJ_flag)
118 		{
119 			var dX = 13, dY = 17;
120 			if (ac > 1.2)  { dX = 0; dY = 0; }        
121 			if (ac > 2.38) { dX = 0;  dY = 19; }
122 			context.fillText("a", ac * sx - 10 + dX, Y0 - 4 + dY);
123 			context.font = "12px Times";
124 			context.fillText("cut", ac * sx + dX, Y0 - 3 + dY);
125 		}
126 		
127 		// Графики сил
128 		Graph(F_SLJ, 	SLJ_flag, 	'red');
129 		Graph(F_LJ, 	LJ_flag, 	'black');
130 	}
131 
132 	// Построение графика функции
133 	
134 	function Graph(F, flag, color)
135 	{
136 		if (!flag) return;
137 		
138 		context.strokeStyle = color;
139 		context.beginPath();
140 		for (var x = x_min; x < x_max; x+=dx)
141 		{
142 			var y = F(x);
143 			var X = x * sx; 
144 			var Y = Y0 - y * sy; 
145 
146 			if (Y > -Y_max) context.lineTo(X, Y);	// Графика, сильно выходящяя за границы области, отключается
147 		}
148 		context.stroke();
149 	}	
150 	
151     // Потенциал Леннард-Джонса
152     
153     function U_LJ(r)
154     {
155         var s2 = 1 / (r * r);
156         var s6 = s2 * s2 * s2;
157         return D * s6 * (s6 - 2);
158     }    
159 	
160 	// Сила Леннард-Джонса
161     
162     function F_LJ(r)
163     {
164         var s2 = 1 / (r * r);
165         var s4 = s2 * s2;
166         return P0 * s4 * s4 * (s4 * s2 - 1) * r;
167     }
168 	
169 	// Укороченная сила Леннард-Джонса
170     
171     function F_SLJ(r)
172     {
173         return k(r) * F_LJ(r);
174     }
175 
176 	// Сглаживающий коэффициент
177  
178     function k(x)
179     {
180         if (x > ac) return 0; 
181         if (x < b) return 1; 
182 
183         var z = (x * x - b2) / (ac2 - b2)
184         var z2 = z * z;
185         return (1 - z2) * (1 - z2);
186     }
187 
188 }

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4     <meta charset="UTF-8" />
 5     <title>Short Lennard-Jones Interaction (SLJ)</title>
 6     <script src="SLJ.js"></script>
 7 </head>
 8 <body>
 9     <canvas id="canvasGraph" width="800" height="400" style="border:1px solid #000000;"></canvas>
10 
11  	<!--Выбор графика (чекбоксы)-->
12 	<div>
13         Сила взаимодействия Леннард-Джонса:
14 		<font color="#000000" size="5"><B>—</B></font>
15 		<input type="checkbox" id="checkbox_01" name="" onchange="app.setCheckbox_01(this.checked);" checked/>классическая,
16         <font color="#ff0000" size="5"><B>—</B></font>
17 		<input type="checkbox" id="checkbox_02" name="" onchange="app.setCheckbox_02(this.checked);" checked/>укороченная
18     </div>	
19 
20     <!--Установка параметров взаимодействия (текстовые поля и слайдеры)-->
21     <div>
22         <font face= "Times New Roman">
23 		Радиус обрезания:
24 		<I>a</I><SUB>cut</SUB> = <input id="Text_01" style="width: 4.2ex;" required pattern="[-+]?([0-9]*\.[0-9]+|[0-9]+)" oninput="
25             // если введено не число - строка не пройдет валидацию по паттерну выше, и checkValidity() вернет false
26             if (!this.checkValidity()) return;
27             app.set_01(this.value);
28             document.getElementById('Slider_01').value = this.value;
29         "><I> a</I>
30 		<input type="range" id="Slider_01" style="width: 100px;" oninput="app.set_01(this.value); document.getElementById('Text_01').value = this.value;">
31 		</font>
32 	</div>
33     
34 	<script type="text/javascript">var app = new MainSLJ(
35 		document.getElementById('canvasGraph')
36 	);</script>
37 
38 </body>
39 </html>