Редактирование: Интерактивная модель простейшей автоколебательной системы с пружиной

[[Виртуальная лаборатория]] > [[Простейшая колебательная система с двумя степенями свободы]] <HR>

Рассматривается простейшая колебательная система тело-пружина-конвейер. Пружина крепится к стенке. Грузик на пружинке колеблется посредством постоянной силы F, с которой тянет конвейер. 
Запишем уравнения движения системы :
::<math>
m \ddot{x} = - c x + F(V - \dot{x} )  = 0 </math>  ,  где <math>m</math>  - масса грузика, <math>c</math> - жесткость пружины,<math>V</math>  - скорость конвейера, <math>\dot{x}</math> - изменение скорости тела  

Делаем замену переменных. <math>z = x - xo</math>, где <math>xo</math> - начальная координата тела. Затем раскладываем силу в ряд Тейлора, получаем новое уравнение :
<math>
m \ddot{z} + F'(V) \dot{z} - 0.5*F''(V - \dot{z}) + 1/6*F'''(V - \dot{z}) + c z = 0 </math>

Переобозначим переменные. Пусть : 
<math> b1 = F'(V)/m \\ 
b2 = F''(V)/2m \\
b3 = F'''(V)/6m </math>

Получим новое уравнение :
<math>
\ddot{z} + ko^2 z = b1 \dot{z} - b3 \dot{z}^3 </math> , где <math> ko = c/m </math> - частота колебаний.



{{#widget:Iframe |url=http://tm.spbstu.ru/htmlets/BondarevS/SeregaTrouble/1_7.html |width=860 |height=1800 |border=0 }}


Скачать [[Медиа:SeregaTrouble.rar|SeregaTrouble.rar]].

<div class="mw-collapsible mw-collapsed" style="width:100%" >
'''Текст программы на языке JavaScript (разработчик [[Бондарев Сергей]]):''' <div class="mw-collapsible-content">
Файл '''"2_7.js"'''
<syntaxhighlight lang="javascript" line start="1" enclose="div">

function MainParticle(canvas, canvas_gr, canvas_gr2) {
    // Предварительные установки
    var context    = canvas.getContext("2d");  // на context происходит рисование
	var context_gr = canvas_gr.getContext("2d");  // на context происходит рисование
	var context_gr2 = canvas_gr2.getContext("2d");
	
   //  Задание констант	
    const Pi = 3.1415926;                   // число "пи"
    const m0 = 1;                           // масштаб массы
    const T0 = 1;                           // масштаб времени (период колебаний исходной системы)
    const a0 = 1;                            // масштаб расстояния (диаметр шара)
	const mu = 0.4;                           // коэф. трения
                                           

    const g0 = a0 / T0 / T0;                // масштаб ускорения (ускорение, при котором за T0 будет пройдено расстояние a0)
    const k0 = 2 * Pi / T0;                 // масштаб частоты
    const C0 = m0 * k0 * k0;                // масштаб жесткости
	var scale1 = 0.2;
	/* var scale2 = 0.2; */
    // *** Задание физических параметров ***
	var xShift= 0;
    const Ny = 15;                           // число шаров, помещающихся по вертикали в окно (задает размер шара относительно размера окна)
    const Nx = 15;							 // число шаров, помещающихся по вертикали в окно (задает размер шара относительно размера окна)
	const l1 =  15*a0;						// длина первой пружины
	const lmax = 2*l1;                      // максимальное растяжение  первой пружины
	/* const l2 =  5*a0;	 */					// длина второй пружины
	var m = 5 * m0;  						// масса шара
	//var v.x = 0;                             // скорость шара
	var k = 1;    	                // силовой коэффициент
	var b1 = 0.1;
	var b3 = 0.1;
	var N = m*9.8;                          // сила трения
	var Ftr = -mu * N ;
	/* var m2 = 10 * m0; 						// масса второго шара */
    const Cwall = 10 * C0;                  // жесткость стен
    const r = 1 * a0;                     // радиус частицы в расчетных координатах
	var c = 100;                    	    // "жесткость" пружинки 1
	/* var c2 = 100;   */                   		// "жесткость" пружинки 1
	var vx0 = 0 * a0/T0;					//начальная скорость
	var delt = 0*a0;						//начальное смещение
	var E = 0;								//энергия системы
	var Vmax = 0; var Mmin = 0; var Vprov = 0;

     var A = Math.sqrt((-4*b1*m*m)/(3*b3*c*c));
	var Mmax= Math.max(m,10);
	//*** Передача значений слайдерам и текстовым окнам***
	Text_delt.value  = delt;
	Text_m.value  = m;
	Text_c.value  = c;
	Text_b1.value = b1;
	Text_b3.value = b3;
	
	
	Slider_b1.min = -1;          			
    Slider_b1.max = 1;
    Slider_b1.step = 0.1;
    Slider_b1.value = Text_b1.value;  
	
	Slider_b3.min = -1;          			
    Slider_b3.max = 1;
    Slider_b3.step = 0.1;
    Slider_b3.value = Text_b3.value;  
	
	Slider_delt.min = -5;          			
    Slider_delt.max = 5;
    Slider_delt.step = 0.1;
    Slider_delt.value = Text_delt.value;  
	
	Slider_m.min = 0.1;          
    Slider_m.max = 10;
    Slider_m.step = 0.1;
    Slider_m.value = Text_m.value; 
	
    Slider_c.min = 1;   
    Slider_c.max = 200;
    Slider_c.step = 1;	
    Slider_c.value = Text_c.value; 	
	Slider_delt.focus();
	
    // *** Задание вычислительных параметров ***

    const fps = 550;                         // frames per second - число кадров в секунду (качеcтво отображения)
    const spf = 260;                        // steps per frame   - число шагов интегрирования между кадрами (скорость расчета)
    const dt  = 0.1 * T0 / fps;           // шаг интегрирования 
	
	// Задание констант для рисования
	const scale    = canvas.height / Ny / a0;  // масштабный коэффициент для перехода от расчетных к экранным координатам
	const scale_gr = canvas_gr.height / Ny / a0;  // масштабный коэффициент для перехода от расчетных к экранным координатам
	const scale_gr2 = canvas_gr2.height / Ny / a0;
	
	
    var w = canvas.width / scale;		 // ширина окна в расчетных координатах
	var h = canvas.height / scale;       // высота окна в расчетных координатах
	var w1 = canvas_gr.width / scale;		 // ширина окна в расчетных координатах
	var h1 = canvas_gr.height / scale;       // высота окна в расчетных координатах
             
	
    // -------------------------------         Выполнение программы              ------------------------------------------
	// Добавление шара 1
    var b = [];
	var time = 1;
	b.x  = l1;            b.y   = h / 2;   // расчетные координаты шара
	b.x_ = b.x;              b.y_  = b.y; 
	b.fx = 0;                b.vx = 0;               // начальная скорость
	b.cx = 0;                b.ax = 0;               // начальное ускорение
	
	// центр рамки 
	var origin = [];
	origin.x = w/2;	origin.y = h/2;
	// стенка 
	var wall1 = [];
	wall1.x = w/2 - 9*a0;	wall1.y = h/2;

	// Основной цикл программы
	setInterval(control, 1500 / fps);  // функция control вызывается с периодом, определяемым вторым параметром
	
// ---------------------------------------------------------------------------------------------------------------------
// ---------------------------------           Определение всех функций              -----------------------------------
// ---------------------------------------------------------------------------------------------------------------------
	
	// функция запускается при нажатии клавиши мыши
    canvas.onmousedown = function(e) 
	{
        var m = mouseCoords(e);                     // получаем координаты курсора мыши
		context.clearRect(0, 0, w * scale, h* scale);      
		context_gr.clearRect(0, 0, w1 * scale_gr, h1 * scale_gr);      
		context_gr2.clearRect(0, 0, w1 * scale_gr, h1 * scale_gr);  
        context_gr.closePath();
		context_gr2.closePath();
		context.closePath();
        context.fill();
        var x = b.x*scale - m.x;                     // расстояние от центра шара до курсора по оси x
        var y = b.y*scale - m.y;  					 // расстояние от центра шара до курсора по оси y
        var rLen2 = x * x + y * y;                   // квадрат расстояния между курсором и центром шара
		//console.log(rLen2);
		//console.log(100*r*r);
        if (rLen2 <= 500 * r * r)					 // если курсор нажал на шар
		{                       
            xShift = b.x*scale - m.x;                // сдвиг курсора относительно центра шара по x
            canvas.onmousemove = mouseMove; 		 // пока клавиша нажата - работает функция перемещения
			
        }
    }
		
 
    // функция запускается при отпускании клавиши мыши
    document.onmouseup = function() 
	{
        canvas.onmousemove = null;        // когда клавиша отпущена - функции перемещения нету
    }
 
    // функция запускается при перемещении мыши (много раз, в каждый момент перемещения)
    // в нашем случае работает только с зажатой клавишей мыши
    function mouseMove(e) {
		context.clearRect(0, 0, w * scale, h* scale);      
		context_gr.clearRect(0, 0, w1 * scale_gr, h1 * scale_gr);      
		context_gr2.clearRect(0, 0, w1 * scale_gr, h1 * scale_gr);  
        var m = mouseCoords(e); 		// получаем координаты курсора мыши
        b.x = (m.x + xShift)/scale;
		delt = b.x - l1;
		b.vx = 0;
		b.ax = 0;
		//console.log(b.x);
		Text_delt.value  = delt;
		Slider_delt.value = Text_delt.value;  
		//var scale1 = 0.0000000002;
		//var scale2 = 0.2;
		
    }
 
    // функция возвращает координаты курсора мыши
    function mouseCoords(e) {
        var m = [] ;
        var rect = canvas.getBoundingClientRect();
        m.x = e.clientX - rect.left;
        m.y = e.clientY - rect.top;
        return m;
    }
	// основная функция, вызываемая в программе
	function control() 
	{
        physics(); // делаем spf шагов интегрирование
		draw();
		draw_gr();
		draw_gr2();
		
    }

	// Реакция на изменение значения в чекбоксе
	this.set_delt = function(input) 
	{
		delt = Number(input);   		//записываем значение начального смещения
		time = 1;
		b.x = l1 + delt;   //изменение начальных координат шаров   
		b.x_ = b.x; 
		b.vx = 0;  			//задание начальных скоростей шаров
		b.ax = 0;
		Text_delt.value  = delt;
		Slider_delt.value = Text_delt.value;  
        context.clearRect(0, 0, w * scale, h* scale);      
		context_gr.clearRect(0, 0, w1 * scale_gr, h1 * scale_gr);      
		context_gr2.clearRect(0, 0, w1 * scale_gr, h1 * scale_gr);  
		
	}
	
	this.set_m = function(input) 
	{
		m = Number(input);   
		time = 1;
        context.clearRect(0, 0, w * scale, h* scale);      
		context_gr.clearRect(0, 0, w1 * scale_gr, h1 * scale_gr);      
		context_gr2.clearRect(0, 0, w1 * scale_gr, h1 * scale_gr);   
	}
	
	this.set_c = function(input) 
	{
		c = Number(input);   
		time = 1;
      context.clearRect(0, 0, w * scale, h* scale);      
		context_gr.clearRect(0, 0, w1 * scale_gr, h1 * scale_gr);      
		context_gr2.clearRect(0, 0, w1 * scale_gr, h1 * scale_gr);   
		
	}
	
	this.set_b1 = function(input) 
	{
		b1 = Number(input);   
		time = 1;
        context.clearRect(0, 0, w * scale, h* scale);      
		context_gr.clearRect(0, 0, w1 * scale_gr, h1 * scale_gr);      
		context_gr2.clearRect(0, 0, w1 * scale_gr, h1 * scale_gr);   
	}
	
	this.set_b3 = function(input) 
	{
		b3 = Number(input);   
		time = 1;
        context.clearRect(0, 0, w * scale, h* scale);      
		context_gr.clearRect(0, 0, w1 * scale_gr, h1 * scale_gr);      
		context_gr2.clearRect(0, 0, w1 * scale_gr, h1 * scale_gr);   
	}

	/*this.set_scale1 = function(input) 
	{
		//scale1 = Number(input); 
		var Cmax = Math.max(c1, c2); var Mmax = Math.max(m1, m2); 
		scale1 =  h*Mmax/(Cmax*delt);
		console.log(scale1);
		time = 1;
        context.clearRect(0, 0, w * scale, h * scale);  
		context_gr.clearRect(0, 0, w * scale, h * scale);
		context_gr2.clearRect(0, 0, w * scale, h * scale); 
	}
	
	this.set_scale2 = function(input) 
	{
		
		scale2 = Number(input);   
		time = 1;
        context.clearRect(0, 0, w * scale, h * scale);  
		context_gr.clearRect(0, 0, w * scale, h * scale);
		context_gr2.clearRect(0, 0, w * scale, h * scale); 
	}*/   
    // Функция, делающая spf шагов интегрирования
    function physics()
	{     
      	b.x_ = b.x;  b.vx_= b.vx; b.ax_ = b.ax;						//записываем старые координаты, скорости и ускорения
		//c.x_ = c.x;  c.vx_= c.vx;
		E_ = E;
			for (var s = 1; s <= spf; s++) 	
			{
			b.ax  =  1*(-c*(b.x - l1) + b1*b.vx - b3*b.vx*b.vx*b.vx  )/m*dt; //расчет ускорения первого шара
			//console.log(Ftr);
			//console.log(b.vx);
			/* c.vx  += -c2*(c.x - b.x - l2)/m2*dt;					//расчет скорости второго шара */
			b.vx += 100*b.ax*dt;											//расчет скорости первого шара
			b.x += b.vx*dt
			/* c.x += c.vx*dt; */											//расчет координаты второго шара
			//console.log(b.x - 2*a0)
			/* if (b.x - 2*a0 >  w/2 - 9*a0)                              // условие на пружину сжатую.
			{
			b.x += 10000*b.vx*dt ;
			console.log(b.x);
			}                                      // расчет координаты первого шара
		    else
			{	
			b.vx = 0 ;
			b.ax = 0;
			
			for (var s = 1; s <= spf; s++) 
			{
			b.ax  =  100*(-c1*(b.x - l1)+ k*b.vx  -  Ftr)/m1*dt; //расчет ускорения первого шара
			console.log(b.x)
			b.vx += b.ax*dt;
			b.x += b.vx*dt; */
			/* } */
			}
			  
			//console.log(b.x)
			E = 0.5*c*(b.x-l1)*(b.x - l1); //рачсет энергии системы
			//Vprov = Math.max(b.vx, c.vx);
			//if ((Vprov) > Vmax) Vmax = b.vx;		   
		  
		 
			
	  
	   time = time + 1;
	   
    }
	
    // определение функций, рисующих частицу, стенки и графики
    
    function draw() //функция, рисующая шары, стенку и пружины
	{
			context.clearRect(0, 0, w * scale, h * scale);      // очистить экран
           
		    // линия, соединяющая первую частицу со стенкой
		   	context.beginPath();
			context.moveTo(b.x*scale, b.y*scale);
        	context.lineTo(wall1.x*scale, wall1.y*scale);
			// стенка 
			context.moveTo(wall1.x*scale, (wall1.y + a0)*scale );
        	context.lineTo(wall1.x*scale, (wall1.y - a0)*scale );	
			context.closePath();
			context.stroke();
			
			//частица первая
			context.fillStyle = 'blue';
         	context.beginPath();
            context.arc(b.x * scale, b.y * scale, 0.5*r * scale, 0,  2*Math.PI, false);
			context.fill();
			
			
    }


	
	function draw_gr() // Определение функции, рисующей первый график
	{
		scale2 = h /5* delt;
		//console.log (Math.abs(b.vx_ - b.vx));
		if(Math.abs(b.vx_ - b.vx) > 0.00005)
		{
		Graph(b, 'blue'); //график для шара при положительном ускорении
		}
		else
		{
		Graph(b, 'red'); //график для шара при отрицательном ускорении
		}
		GraphAxex('black');	//оси
		
	
				
    }
	
	
	
	
	function Graph(b, color)
    {
        context_gr2.lineWidth = 2; 
        context_gr.strokeStyle = color;
        context_gr.beginPath();
	    context_gr.moveTo(time*scale2/3, (b.x-l1)*scale*2*scale2 + h1*scale/2);
	    context_gr.lineTo( (time+1)*scale2/3, (b.x_- l1)*scale*2*scale2 + h1*scale/2);
		context_gr.stroke();
        context_gr.closePath();
		
    }  
	
	function GraphAxex(color)
	{
	context_gr2.lineWidth = 2;
		context_gr.strokeStyle = color;
        context_gr.beginPath();
	  	// ось горизонтальная
		context_gr.moveTo(w1/2*scale, 0);
		context_gr.lineTo(w1/2*scale, h1*scale);
		// ось вертикальная
		context_gr.moveTo(0, (h1/2)*scale);
		context_gr.lineTo((w1)*scale, (h1/2)*scale);
        context_gr.closePath();
		context_gr.stroke();
	
	}
	
	function Graph1(b, color)
    {
         context_gr2.lineWidth = 2;
        context_gr.strokeStyle = color;
        context_gr.beginPath();
		context_gr.moveTo(time*scale2/3, (b.x-l1)*scale*2*scale2 + scale*h1/2);
		context_gr.lineTo( (time+1)*scale2/3, (b.x_- l1)*scale*2*scale2 + scale*h1/2);
		context_gr.stroke();
		context_gr.closePath();
		
    }  
	
	
	function draw_gr2() // Определение функции, рисующей второй график
	{
	  
		scale1 = 6* (h1*Mmax)/( c*delt*delt);	
        scale2 = A;		
		GraphVel(b, 'blue'); //график для шара
		//GraphVel2(b, 'red'); //график для амплитудного коэффициента для шара
		GraphVel3(b, 'green');
		GraphAxex2('black'); //оси	
		//console.log(A);
		
  			
    }
	
	/* function draw_gr3() // Определение функции, рисующей амплитудный график сходимости
	{
	
		var A = Math.sqrt((-4*b1)m*m/(3*b3*c*c));
		scale1 = A;		 
		GraphVel(b, 'yellow'); //график для первого шара
		//GraphVel2(c, 'red'); //график для второго шара
		GraphAxex2('black'); //оси	
		
  			
    } */
	
	
	
	function GraphVel(b, color)
    {
        
		context_gr2.lineWidth = 2;
        context_gr2.strokeStyle = color;
      
		context_gr2.beginPath();
		
		context_gr2.moveTo((b.x-l1)*2*scale1 + scale*w1/2, b.vx*scale1 + scale*h1/2 );
		context_gr2.lineTo((b.x_- l1)*2*scale1 + scale*w1/2, b.vx_*scale1 + scale*h1/2);
		
		context_gr2.closePath();
		context_gr2.stroke();	
		
        
    }
	
	    function GraphVel2(b, color)
    {
         context_gr2.lineWidth = 2;
        context_gr2.strokeStyle = color;
      
		context_gr2.beginPath();
		
		context_gr2.moveTo((b.x-l1)*2*scale2 + scale*w1/2, b.vx*scale2 + scale*h1/2 );
		context_gr2.lineTo((b.x_- l1)*2*scale2 + scale*w1/2, b.vx_*scale2 + scale*h1/2);
		
		context_gr2.closePath();
		context_gr2.stroke();	

	
        
    }
	function GraphVel3(b, color)
	
	{
			
		//Grafic A
		A = Math.sqrt((-4*b1*m*m)/(3*b3*c*c));
		context_gr2.lineWidth = 1;
		context_gr2.strokeStyle = color;
        console.log(A);
		context_gr2.beginPath();
		
		context_gr2.moveTo(1*A*Math.sin(time)+ scale*w1/2, 1*A*Math.cos(time)+ scale*h1/2);
		context_gr2.lineTo(1*A*Math.sin(time)+ scale*w1/2, 1*A*Math.cos(time)+ scale*h1/2);
		//context_gr2.moveTo(A*Math.sin(b.x-l1)+ scale*w1/2, A*Math.cos(b.x-l1)+ (h1/2)*scale);
		//context_gr2.lineTo(A*Math.sin(b.x_-l1)+ scale*w1/2,A*Math.cos(b.x_-l1) + (h1/2)*scale);
		
		context_gr2.closePath();
		context_gr2.stroke();
	}
	
	function GraphAxex2(color)
	{
		context_gr2.lineWidth = 1;
		context_gr2.strokeStyle = color;
        context_gr2.beginPath();
	  	// ось горизонтальная
		context_gr2.moveTo(w1/2*scale, 0);
		context_gr2.lineTo(w1/2*scale, h1*scale);
		// ось вертикальная
		context_gr2.moveTo(0, (h1/2)*scale);
		context_gr2.lineTo((w1)*scale, (h1/2)*scale);
        context_gr2.closePath();
		context_gr2.stroke();
	
	}
	 
 
}
</syntaxhighlight>
Файл '''"1_7.html"'''
<syntaxhighlight lang="html5" line start="1" enclose="div">
	<!DOCTYPE html>
<html>
<head>
    <title> 2 </title>
    <script src="2_7.js"></script>
</head>
<body>
	<!-- Добавление области для рисования частицы -->
    <canvas id="canvasBalls" width="800" height="300" style="border:1px solid #000000;"></canvas>
	<!-- Добавление области для рисования графика -->
	 <div>
        Координаты от времени:
        <font color="#0000FF" size="5"><B>—</B></font> Тело
        
    </div>    
	<canvas id="canvasGraph" width="800" height="600" style="border:1px solid #000000;"></canvas>	
	<!-- Добавление чекбокса для ввода скорости частицы -->
	<div>
         Фазовая плоскость:
        <font color="#0000FF" size="5"><B>—</B></font> Тело
        
    </div>     	
	<canvas id="canvasGraph1" width="800" height="600" style="border:1px solid #000000;"></canvas>	
	
    <div>
	    delt =
        <input id="Text_delt" style="width: 4.2ex;" required pattern="[-+]?([0-9]*\.[0-9]+|[0-9]+)" oninput="
            if (!this.checkValidity()) return;
            app.set_delt(this.value);
			document.getElementById('Slider_delt').value = this.value;
         
        ">
		<input type = "range"  id="Slider_delt" style="width: 100px;" oninput="app.set_delt(this.value); document.getElementById('Text_delt').value = this.value;">
        </I></font>
    </div>
	
	<!-- Масса 1 -->
	<div>
	    m =
        <input id="Text_m" style="width: 4.2ex;" required pattern="[-+]?([0-9]*\.[0-9]+|[0-9]+)" oninput="
            if (!this.checkValidity()) return;
            app.set_m(this.value);
            document.getElementById('Slider_m').value = this.value;
        ">
		<input type = "range"  id="Slider_m" style="width: 100px;" oninput="app.set_m(this.value); document.getElementById('Text_m').value = this.value;">
        </I></font>
    </div>
	
	<!-- Жесткость 1-->
	<div>
	    c =
        <input id="Text_c" style="width: 4.2ex;" required pattern="[-+]?([0-9]*\.[0-9]+|[0-9]+)" oninput="
            if (!this.checkValidity()) return;
            app.set_c(this.value);
            document.getElementById('Slider_c').value = this.value;
        ">
		<input type = "range"  id="Slider_c" style="width: 100px;" oninput="app.set_c(this.value); document.getElementById('Text_c').value = this.value;">
        </I></font>
    </div>
	<!-- Первый коэффициент -->
	<div>
	    b1 =
        <input id="Text_b1" style="width: 4.2ex;" required pattern="[-+]?([0-9]*\.[0-9]+|[0-9]+)" oninput="
            if (!this.checkValidity()) return;
            app.set_b1(this.value);
			document.getElementById('Slider_b1').value = this.value;
         
        ">
		<input type = "range"  id="Slider_b1" style="width: 100px;" oninput="app.set_b1(this.value); document.getElementById('Text_b1').value = this.value;">
        </I></font>
    </div>
	
	<!-- Второй коэффициент -->
	<div>
	    b3 =
        <input id="Text_b3" style="width: 4.2ex;" required pattern="[-+]?([0-9]*\.[0-9]+|[0-9]+)" oninput="
            if (!this.checkValidity()) return;
            app.set_b3(this.value);
			document.getElementById('Slider_b3').value = this.value;
         
        ">
		<input type = "range"  id="Slider_b3" style="width: 100px;" oninput="app.set_b3(this.value); document.getElementById('Text_b3').value = this.value;">
        </I></font>
    </div>
    <script type="text/javascript"> app = new MainParticle(document.getElementById('canvasBalls'),document.getElementById('canvasGraph'),document.getElementById('canvasGraph1'));</script>
</body>
</html>	
</syntaxhighlight>
</div>
</div>

[[Category: Виртуальная лаборатория]]