c
#include <stdio.h>
int main
{
int a;
a=30;
while(true)
{
printf("%d\n",a);
}
return 0;
}
arduino1.8.10
#include "Arduino.h"
void setup()
{
[程式區塊]
}
void loop()
{
[程式區塊]
}
(1)只執行一次，變數初始值設定，腳位模式設定，運算一次的邏輯-->檔名.ino-->檔名.hex
(2)無限循環，無線訊號傳送，反覆運行的邏輯
++++++++++++++++++++++++++
wifibasic
#include<ESP8266WiFi.h>
#include<ESP8266WebServer.h>
ESP8266WebServer server(80);
char ssid[]="bsnet-1";
char pass[]="062230542";
void setup() {
// put your setup code here, to run once:
Serial.begin(115200);
WiFi.begin(ssid,pass);
delay(3000);
server.on("/",fun1);
server.begin();
Serial.println();
Serial.println(WiFi.localIP());
}
void fun1()
{
Serial.println();
server.send(200,"text/html","Hello Webserver");
}
void loop() {
// put your main code here, to run repeatedly:
server.handleClient();
}
======================
wifi
begin()
webserver-----------○localIP
伺服器啟動
||
on()-------GET---> / --->send()
/led1-->send() HMI
/led2-->send()
brower http://
++++++++++++++++++==
#include<ESP8266WiFi.h>
#include<ESP8266WebServer.h>
ESP8266WebServer server(80);
char ssid[]="bsnet-1";
char pass[]="062230542";
void setup() {
// put your setup code here, to run once:
Serial.begin(115200);
WiFi.begin(ssid,pass);
delay(3000);
server.on("/",fun1);
server.on("/led1",fun2);
server.on("/led2",fun3);
server.on("/led3",fun4);
server.begin();
Serial.println();
Serial.println(WiFi.localIP());
}
void fun1()
{
Serial.println();
server.send(200,"text/html","Hello Webserver");
}
void fun2()
{
Serial.println();
server.send(200,"text/html","LED1 ON");
}
void fun3()
{
Serial.println();
server.send(200,"text/html","LED2 ON");
}
void fun4()
{
Serial.println();
server.send(200,"text/html","LED3 ON");
}
void loop() {
// put your main code here, to run repeatedly:
server.handleClient();
}
http://192.168.0.152/led1
+++++++++++++++++++++++++++++
<style>
#bt1,#bt2,#bt3,#bt4,#bt5
{
background-color:#FCF;
height:50px;
}
</style>
<script language="javascript" src="jquery-3.4.1.min.js"></script>
<script language="javascript">
function fun1()
{
$.get("http://192.168.0.152/led1",{},function(data)
{
alert(data);
});
}
function fun2()
{
$.get("http://192.168.0.152/led2",{},function(data)
{
alert(data);
});
}
function fun3()
{
$.get("http://192.168.0.152/led3",{},function(data)
{
alert(data);
});
}
function fun4()
{
$.get("http://192.168.0.152/allon",{},function(data)
{
alert(data);
});
}
function fun5()
{
$.get("http://192.168.0.152/alloff",{},function(data)
{
alert(data);
});
}
</script>
<body>
<input type="button" id="bt1" name="btn" value="LED1" onclick="fun1()" />
<input type="button" id="bt2" name="btn" value="LED2" onclick="fun2()" />
<input type="button" id="bt3" name="btn" value="LED3" onclick="fun3()" />
<input type="button" id="bt4" name="btn" value="ALL ON" onclick="fun4()" />
<input type="button" id="bt5" name="btn" value="ALL OFF" onclick="fun5()" />
</body>
++++++++++++++++++++++++++++++++++++++++++++++++++++++
char ssid[]="bsnet-1";
char pass[]="062230542";
void setup() {
// put your setup code here, to run once:
Serial.begin(115200);
WiFi.begin(ssid,pass);
delay(3000);
server.on("/led1",fun1);
server.on("/led2",fun2);
server.on("/led3",fun3);
server.on("/allon",fun4);
server.on("/alloff",fun5);
server.begin();
Serial.println();
Serial.println(WiFi.localIP());
}
void fun1()
{
Serial.println("1");
server.send(200,"text/html","LED1 ON");
}
void fun2()
{
Serial.println("2");
server.send(200,"text/html","LED2 ON");
}
void fun3()
{
Serial.println("3");
server.send(200,"text/html","LED3 ON");
}
void fun4()
{
Serial.println("4");
server.send(200,"text/html","ALL ON");
}
void fun5()
{
Serial.println("5");
server.send(200,"text/html","ALL OFF");
}
void loop() {
// put your main code here, to run repeatedly:
server.handleClient();
}
#http://192.168.0.152/led1
===================
function fun1(x)
{
$.get("http://192.168.0.152/"+x,{},function(data)
{
alert(data);
});
}
</script>
<body>
<input type="button" id="bt1" name="btn" value="LED1" onclick="fun1('led1')" />
<input type="button" id="bt2" name="btn" value="LED2" onclick="fun1('led2')" />
<input type="button" id="bt3" name="btn" value="LED3" onclick="fun1('led3')" />
<input type="button" id="bt4" name="btn" value="ALL ON" onclick="fun1('allon')" />
<input type="button" id="bt5" name="btn" value="ALL OFF" onclick="fun1('alloff')" />
</body>
======================
void setup() {
// put your setup code here, to run once:
Serial.begin(115200);
WiFi.begin(ssid,pass);
delay(3000);
server.on("/",HTTP_POST,fun1);
server.begin();
Serial.println();
Serial.println(WiFi.localIP());
}
void fun1()
{
String s=server.arg("t1");
Serial.println(s);
server.send(200,"text/html","Success");
}
void loop() {
// put your main code here, to run repeatedly:
server.handleClient();
}
=========
<style>
#bt1,#bt2,#bt3,#bt4,#bt5
{
background-color:#FCF;
height:50px;
}
</style>
<script language="javascript" src="jquery-3.4.1.min.js"></script>
<script language="javascript">
function fun1()
{
$.post("http://192.168.0.152/",{t1:1},function(data)
{
alert(data);
});
}
function fun2()
{
$.get("http://192.168.0.152/",{t2:2},function(data)
{
alert(data);
});
}
function fun3()
{
$.get("http://192.168.0.152/",{t3:3},function(data)
{
alert(data);
});
}
function fun4()
{
$.get("http://192.168.0.152/",{t3:4},function(data)
{
alert(data);
});
}
function fun5()
{
$.get("http://192.168.0.152/",{t5:5},function(data)
{
alert(data);
});
}
</script>
<body>
<input type="button" id="bt1" name="btn" value="LED1" onclick="fun1()" />
<input type="button" id="bt2" name="btn" value="LED2" onclick="fun2()" />
<input type="button" id="bt3" name="btn" value="LED3" onclick="fun3()" />
<input type="button" id="bt4" name="btn" value="ALL ON" onclick="fun4()" />
<input type="button" id="bt5" name="btn" value="ALL OFF" onclick="fun5()" />
</body>
================
ESP8266WebServer server(80);
char ssid[]="bsnet-1";
char pass[]="062230542";
void setup() {
// put your setup code here, to run once:
Serial.begin(115200);
WiFi.begin(ssid,pass);
delay(3000);
server.on("/",HTTP_POST,fun1);
server.begin();
Serial.println();
Serial.println(WiFi.localIP());
}
void fun1()
{
String s=server.arg("t1");
int pwms=s.toInt();
Serial.println(s);
server.send(200,"text/html",s+":pwM值執行成功");
}
void loop() {
// put your main code here, to run repeatedly:
server.handleClient();
}
==================
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文件</title>
</head>
<script language="javascript" src="jquery-3.4.1.min.js"></script>
<script language="javascript">
function fun1()
{
var qs=document.getElementById("t1").value;
if (qs !="")
{
if (parseInt(qs)>=0 && parseInt(qs)<=255)
{
$.post("http://192.168.0.153/",{t1:qs},function(data)
{
$("#dv1").text("");
$("#dv1").text(data);
});
}
else
{
alert("請輸入0_255數值");
document.getElementById("t1").value="";
document.getElementById("t1").focus();
}
}
else
{
alert("不可為空請輸入0_255數值，");
}
}
function fun2()
{
document.getElementById("t1").value="";
$.post("http://192.168.0.153/",{t1:0},function(data)
{
$("#dv1").text("");
$("#dv1").text("無PWM值輸入");
});
}
</script>
<body>
<table width="200" height="200">
<tr>
<td>PWM值：</td>
<td><input type="text" id="t1" width="50"/>
</td>
</tr>
<tr>
<td height="73"><input type="button" id="bt1" name="btn" value="傳送" onclick="fun1()" /></td>
<td><input type="button" id="bt2" name="btn" value="清除" onclick="fun2()" /></td></tr>
<td colspan="2">
<div id="dv1"></div>
</td>
</table>
</body>
</html>
================
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文件</title>
</head>
<script language="javascript" src="jquery-3.4.1.min.js"></script>
<script language="javascript">
function fun1()
{
var sv2=document.getElementById("slider1").value;
document.getElementById("t1").value=sv2;
if (sv2 !="")
{
$.post("http://192.168.0.153/",{t1:qs},function(data)
{
$("#dv1").text("");
$("#dv1").text(data);
});
}
}
function fun2()
{
document.getElementById("t1").value="";
$.post("http://192.168.0.153/",{t1:0},function(data)
{
$("#dv1").text("");
$("#dv1").text("無PWM值輸入");
});
}
</script>
<body>
<table width="200" height="200" border="1">
<tr>
<td>馬達一：</td>
<td><input type="range" min="0" max="100" value="0" class="slider" id="slider1"></td>
<td><input type="text" id="t1" width="50" onchange="fun1()"/>
</td>
</tr>
<tr>
<td>馬達二：</td>
<td><input type="range" min="0" max="100" value="0" class="slider" id="slider2"></td>
<td><input type="text" id="t2" width="50" onchange="fun2()"/>
</td>
</tr>
<tr>
<td>馬達三：</td>
<td><input type="range" min="0" max="100" value="0" class="slider" id="slider3"></td>
<td><input type="text" id="t3" width="50" onchange="fun3()"/>
</td>
</tr>
<tr>
<td>馬達四：</td>
<td><input type="range" min="0" max="100" value="0" class="slider" id="slider4"></td>
<td><input type="text" id="t4" width="50"/ onchange="fun4()">
</td>
</tr>
<tr>
<td colspan="3" align="center"><input type="button" id="bt1" name="btn" value="歸零" onclick="fu5()" /></td>
</tr>
<td colspan="3">
<div id="dv1"></div>
</td>
</table>
</body>
</html>
===
// put your setup code here, to run once:
Serial.begin(115200);
WiFi.begin(ssid,pass);
delay(3000);
server.on("/",HTTP_POST,fun1);
server.begin();
Serial.println();
Serial.println(WiFi.localIP());
}
void fun1()
{
String s=server.arg("t1");
int ch=s.toInt();
if (ch==1))
{
int sv1=server.arg("t2").toInt();
Serial.println("1:"+(s);
server.send(200,"text/html","伺服馬達一執行"＋（String)sv1+"度成功");
}
}
void loop() {
// put your main code here, to run repeatedly:
server.handleClient();
}
++++++++++++++++++++++++++
var url="";
function funload()
{
document.getElementById("uconn1").disabled=true;
}
function funconn()
{
url="http://"+document.getElementById("ip1").value;
document.getElementById("ip1").disabled=true;
document.getElementById("conn1").disabled=true;
document.getElementById("uconn1").disabled=false;
}
function funuconn()
{
url="";
document.getElementById("ip1").value="";
}
function fun1()
{
var ipa=document.getElementById("ip1").value;
if (ipa=="")
{
alert("請輸入IP位址");
document.getElementById("t1").value="";
}
else
{
var sv1=document.getElementById("slider1").value;
document.getElementById("t1").value=sv1;
if (sv1 !="")
{
$.post("http://192.168.0.153/",{t2:1,t1:sv1},function(data)
{
$("#sp1").text("");
$("#sp1").text(data);
});
}
}
}
---------------------
<body onload="funload()">
<table width="200" height="200" border="1">
<tr>
<td>WiFiIp:</td>
<td colspan="2"><input type="text" id="ip1" /></td>
</tr>
<tr>
<td><input type="button" id="conn1" value="連線" onclick="funconn()" /></td>
<td><input type="button" id="uconn1" value="斷線" onclick="funuconn" /></td>
</tr>
<tr>
=====================================
++++++++++++++++++++++++++
var url="";
function funload()
{
document.getElementById("uconn1").disabled=true;
}
function funconn()
{
url="http://"+document.getElementById("ip1").value;
document.getElementById("ip1").disabled=true;
document.getElementById("conn1").disabled=true;
document.getElementById("uconn1").disabled=false;
}
function funuconn()
{
url="";
document.getElementById("ip1").value="";
}
function fun1()
{
var ipa=document.getElementById("ip1").value;
if (ipa=="")
{
alert("請輸入IP位址");
document.getElementById("t1").value="";
}
else
{
var sv1=document.getElementById("slider1").value;
document.getElementById("t1").value=sv1;
if (sv1 !="")
{
$.post("http://192.168.0.153/",{t2:1,t1:sv1},function(data)
{
$("#sp1").text("");
$("#sp1").text(data);
});
}
}
}
---------------------
<body onload="funload()">
<table width="200" height="200" border="1">
<tr>
<td>WiFiIp:</td>
<td colspan="2"><input type="text" id="ip1" /></td>
</tr>
<tr>
<td><input type="button" id="conn1" value="連線" onclick="funconn()" /></td>
<td><input type="button" id="uconn1" value="斷線" onclick="funuconn" /></td>
</tr>
<tr>
=====================================
var time;
var i=1;
function fun1()
{
var t=document.getElementById("a1").innerHTML;
if (t=="啟動")
{
time=setInterval(fun2,1000);
document.getElementById("a1").innerHTML="修止"
}
else
{
clearInterval(time);
document.getElementById("a1").innerHTML="啟動";
}
}
function fun2()
{
document.getElementById("sp1").innerHTML=i;
i=i+1;
if (i>=10)
{
i=1;
}
}
</script>
<body>
<a href="javascript:void;" id="a1" onclick="fun1()" >啟動</a>
<p></p>
<span id="sp1>"</span>
</body>
</html>
var i=1;
function fun1()
{
var t=document.getElementById("a1").innerHTML;
if (t=="啟動")
{
time=setInterval(fun2,1000);
document.getElementById("a1").innerHTML="修止"
}
else
{
clearInterval(time);
document.getElementById("a1").innerHTML="啟動";
}
}
function fun2()
{
document.getElementById("sp1").innerHTML=i;
i=i+1;
if (i>=10)
{
i=1;
}
}
</script>
<body>
<a href="javascript:void;" id="a1" onclick="fun1()" >啟動</a>
<p></p>
<span id="sp1>"</span>
</body>
</html>
++++++++++++++++++++++++++++++++++
7
#include<ESP8266WiFi.h>
#include<ESP8266WebServer.h>
ESP8266WebServer server(80);
char ssid[]="bsnet-1";
char pass[]="062230542";
int count=0;
void setup() {
// put your setup code here, to run once:
Serial.begin(115200);
WiFi.begin(ssid,pass);
delay(3000);
server.on("/",HTTP_POST,fun1);
server.begin();
Serial.println();
Serial.println(WiFi.localIP());
}
void fun1()
{
String s=server.arg("t1");
int p=s.toInt();
if (p==1)
{
count=count+1;
if (count>=10)
{
count=0;
}
Serial.println(count);
server.send(200,"text/html",（String)count+"_類比值讀取成功");
}
else
{
server.send(200,"text/html","類比值讀取不進行");
}
}
void loop() {
// put your main code here, to run repeatedly:
server.handleClient();
}
+++++++++++++++++++++++++++++
<script language="javascript" src="jquery-3.4.1.min.js"></script>
<script language="javascript">
var time;
var i=1;
function fun0()
{
time=setInterval(fun1,1000);
}
function fun1()
{
$.post("http://192.168.0.153/",{t1:1},function(data)
{
var tdata=data.split("-")
$("#sp1").text(tdata[0]);
$("#sp2").text(tdata[1]);
});
}
</script>
<body onload="fun0()">
類比值；<span id="sp1" ></span>
<p></p>
狀態；<span id="sp2"></span>
</body>
+++++++++++++++++++++++++++
8
#include<ESP8266WiFi.h>
#include<ESP8266WebServer.h>
ESP8266WebServer server(80);
char ssid[]="bsnet-1";
char pass[]="062230542";
int count=0;
void setup() {
// put your setup code here, to run once:
Serial.begin(115200);
WiFi.begin(ssid,pass);
delay(3000);
server.on("/",HTTP_POST,fun1);
server.begin();
Serial.println();
Serial.println(WiFi.localIP());
}
void fun1()
{
String s=server.arg("t1");
int p=s.toInt();
int rv=random(0,9);
Serial.println(rv);
server.send(200,"text/html",rv);
}
void loop() {
// put your main code here, to run repeatedly:
server.handleClient();
}
+++++++++++++++++++++++++++++
12/05
hmi ui 引入
Javascript
jquery ]==> UI==>body==>Javacript自訂程式==>設計
css
++++++++++++++++
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文件</title>
</head>
<link rel="stylesheet" href="./hmili/jqwidgets/styles/jqx.base.css" type="text/css" />
<script type="text/javascript" src="./jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="./hmili/jqwidgets/jqxcore.js"></script>
<script type="text/javascript" src="./hmili/jqwidgets/jqxdraw.js"></script>
<script type="text/javascript" src="./hmili/jqwidgets/jqxknob.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#knob').jqxKnob({
value: 60,
min: 0,
max: 255,
startAngle: 150,
endAngle: 510,
snapToStep: true,
rotation: 'clockwise',
style: { stroke: '#dfe3e9', strokeWidth: 3, fill: { color: '#fefefe', gradientType: "linear", gradientStops: [[0, 1], [50, 0.9], [100, 1]] } },
marks: {
colorRemaining: '#333',
colorProgress: '#333',
type: 'line',
offset: '71%',
thickness: 1,
size: '6%',
majorSize: '9%',
majorInterval: 10,
minorInterval: 2
},
labels: {
offset: '88%',
step: 10
},
progressBar: {
style: { fill: { color: '#00a644', gradientType: "linear", gradientStops: [[0, 1], [50, 0.9], [100, 1]] }, stroke: '#00a644' },
background: { fill: { color: '#ff8b1e', gradientType: "linear", gradientStops: [[0, 1], [50, 0.9], [100, 1]] }, stroke: '#ff8b1e' },
size: '9%',
offset: '60%'
},
spinner: {
style: { fill: { color: '#00a4e1', gradientType: "linear", gradientStops: [[0, 1], [50, 0.9], [100, 1]] }, stroke: '#00a4e1' },
innerRadius: '45%', // specifies the inner Radius of the dial
outerRadius: '60%', // specifies the outer Radius of the dial
marks: {
colorRemaining: '#fff',
colorProgress: '#fff',
type: 'line',
offset: '46%',
thickness: 2,
size: '14%',
majorSize: '14%',
majorInterval: 10,
minorInterval: 10
},
},
dial:
{
style: { fill: { color: '#dfe3e9', gradientType: "linearHorizontal", gradientStops: [[0, 0.9], [50, 1], [100, 1]] }, stroke: '#dfe3e9' },
innerRadius: '0%', // specifies the inner Radius of the dial
outerRadius: '45%'
},
pointer:
{
type: 'circle',
style: { fill: '#ef6100', stroke: '#ef6100' },
size: '5%',
offset: '38%',
thickness: 20
}
});
var lastValue;
var newValue = 0;
var min = 0;
var max = 255;
$('#knob').on('change', function (event) {
lastValue = newValue;
newValue = event.args.value;
if (newValue >= min && newValue <= min + 10 && lastValue <= max && lastValue >= max - 10){
min = max;
max += 100;
$('#knob').jqxKnob({ value: max, max: max, min: min });
} else if (newValue >= max - 10 && newValue <= max && lastValue >= min && lastValue <= min + 10){
max = min;
min -= 100;
$('#knob').jqxKnob({ value: min, min: min, max: max });
}
document.getElementById("sp1").innerHTML=newValue;
});
$("#bt1").click(function()
{
var rv=document.getElementById("sp1").innerHTML;
alert(rv);
$.post("http://192.168.0.113/",{t1:1,t2:rv},function(data)
{
//$("#sp2").text("");
$("#sp2").text(data);
});
});
});
function fun2()
{
$.post("http://192.168.0.113/",{t1:1,t2:rv},function(data)
{
$("#sp2").text("");
$("#sp2").text(data[1]);
});
}
</script>
<body class='default'>
<div id='knob'>
</div>
<p>
<table width="400" rules="rows">
<tr>
<td >
調整值 :</td><td ><span id="sp1" size="30" ></span></td>
<td> <input type="button" id="bt1" value="確定" onclick="fun1" />
</td>
</tr>
<tr>
<td colspan="3" >
狀態列：<span id="sp2" > </span>脈衝值瀉入成功
</td>
</tr>
</table>
</body>
</html>
___________________
#include<ESP8266WiFi.h>
#include<ESP8266WebServer.h>
ESP8266WebServer server(80);
char ssid[]="bsnet-1";
char pass[]="062230542";
int count=0;
void setup() {
// put your setup code here, to run once:
Serial.begin(115200);
WiFi.begin(ssid,pass);
delay(3000);
server.on("/",HTTP_POST,fun1);
server.begin();
Serial.println();
Serial.println(WiFi.localIP());
}
void fun1()
{
String s=server.arg("t1");
int p=s.toInt();
if (p==1)
{
int rv=server.arg("t2").toInt();
Serial.println(rv);
server.send(200,"text/html",(String)rv+"-脈衝值傳送成功");
}
//int rv=random(0,9);
else
{
server.send(200,"text/html","未進行脈衝值傳送成功");
}
}
void loop() {
// put your main code here, to run repeatedly:
server.handleClient();
}
________________________
#include<ESP8266WiFi.h>
#include<ESP8266WebServer.h>
ESP8266WebServer server(80);
char ssid[]="bsnet-1";
char pass[]="062230542";
int count=0;
void setup() {
// put your setup code here, to run once:
Serial.begin(115200);
WiFi.begin(ssid,pass);
delay(3000);
server.on("/",HTTP_POST,fun1);
server.begin();
Serial.println();
Serial.println(WiFi.localIP());
}
void fun1()
{
String s=server.arg("t1");
int p=s.toInt();
int rv=random(0,9);
Serial.println(rv);
server.send(200,"text/html",rv);
}
void loop() {
// put your main code here, to run repeatedly:
server.handleClient();
}
+++++++++++++++++++++++++++++
12/05
hmi ui 引入
Javascript
jquery ]==> UI==>body==>Javacript自訂程式==>設計
css
++++++++++++++++
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文件</title>
</head>
<link rel="stylesheet" href="./hmili/jqwidgets/styles/jqx.base.css" type="text/css" />
<script type="text/javascript" src="./jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="./hmili/jqwidgets/jqxcore.js"></script>
<script type="text/javascript" src="./hmili/jqwidgets/jqxdraw.js"></script>
<script type="text/javascript" src="./hmili/jqwidgets/jqxknob.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#knob').jqxKnob({
value: 60,
min: 0,
max: 255,
startAngle: 150,
endAngle: 510,
snapToStep: true,
rotation: 'clockwise',
style: { stroke: '#dfe3e9', strokeWidth: 3, fill: { color: '#fefefe', gradientType: "linear", gradientStops: [[0, 1], [50, 0.9], [100, 1]] } },
marks: {
colorRemaining: '#333',
colorProgress: '#333',
type: 'line',
offset: '71%',
thickness: 1,
size: '6%',
majorSize: '9%',
majorInterval: 10,
minorInterval: 2
},
labels: {
offset: '88%',
step: 10
},
progressBar: {
style: { fill: { color: '#00a644', gradientType: "linear", gradientStops: [[0, 1], [50, 0.9], [100, 1]] }, stroke: '#00a644' },
background: { fill: { color: '#ff8b1e', gradientType: "linear", gradientStops: [[0, 1], [50, 0.9], [100, 1]] }, stroke: '#ff8b1e' },
size: '9%',
offset: '60%'
},
spinner: {
style: { fill: { color: '#00a4e1', gradientType: "linear", gradientStops: [[0, 1], [50, 0.9], [100, 1]] }, stroke: '#00a4e1' },
innerRadius: '45%', // specifies the inner Radius of the dial
outerRadius: '60%', // specifies the outer Radius of the dial
marks: {
colorRemaining: '#fff',
colorProgress: '#fff',
type: 'line',
offset: '46%',
thickness: 2,
size: '14%',
majorSize: '14%',
majorInterval: 10,
minorInterval: 10
},
},
dial:
{
style: { fill: { color: '#dfe3e9', gradientType: "linearHorizontal", gradientStops: [[0, 0.9], [50, 1], [100, 1]] }, stroke: '#dfe3e9' },
innerRadius: '0%', // specifies the inner Radius of the dial
outerRadius: '45%'
},
pointer:
{
type: 'circle',
style: { fill: '#ef6100', stroke: '#ef6100' },
size: '5%',
offset: '38%',
thickness: 20
}
});
var lastValue;
var newValue = 0;
var min = 0;
var max = 255;
$('#knob').on('change', function (event) {
lastValue = newValue;
newValue = event.args.value;
if (newValue >= min && newValue <= min + 10 && lastValue <= max && lastValue >= max - 10){
min = max;
max += 100;
$('#knob').jqxKnob({ value: max, max: max, min: min });
} else if (newValue >= max - 10 && newValue <= max && lastValue >= min && lastValue <= min + 10){
max = min;
min -= 100;
$('#knob').jqxKnob({ value: min, min: min, max: max });
}
document.getElementById("sp1").innerHTML=newValue;
});
$("#bt1").click(function()
{
var rv=document.getElementById("sp1").innerHTML;
alert(rv);
$.post("http://192.168.0.113/",{t1:1,t2:rv},function(data)
{
//$("#sp2").text("");
$("#sp2").text(data);
});
});
});
function fun2()
{
$.post("http://192.168.0.113/",{t1:1,t2:rv},function(data)
{
$("#sp2").text("");
$("#sp2").text(data[1]);
});
}
</script>
<body class='default'>
<div id='knob'>
</div>
<p>
<table width="400" rules="rows">
<tr>
<td >
調整值 :</td><td ><span id="sp1" size="30" ></span></td>
<td> <input type="button" id="bt1" value="確定" onclick="fun1" />
</td>
</tr>
<tr>
<td colspan="3" >
狀態列：<span id="sp2" > </span>脈衝值瀉入成功
</td>
</tr>
</table>
</body>
</html>
___________________
#include<ESP8266WiFi.h>
#include<ESP8266WebServer.h>
ESP8266WebServer server(80);
char ssid[]="bsnet-1";
char pass[]="062230542";
int count=0;
void setup() {
// put your setup code here, to run once:
Serial.begin(115200);
WiFi.begin(ssid,pass);
delay(3000);
server.on("/",HTTP_POST,fun1);
server.begin();
Serial.println();
Serial.println(WiFi.localIP());
}
void fun1()
{
String s=server.arg("t1");
int p=s.toInt();
if (p==1)
{
int rv=server.arg("t2").toInt();
Serial.println(rv);
server.send(200,"text/html",(String)rv+"-脈衝值傳送成功");
}
//int rv=random(0,9);
else
{
server.send(200,"text/html","未進行脈衝值傳送成功");
}
}
void loop() {
// put your main code here, to run repeatedly:
server.handleClient();
}
________________________
