【BPI-BPI-Webduino Smart 物联网无线控制模块试用体验】光控角度

图片
无线
物联网
程序
网页

xukejing
LV5工程师
| 2017-02-14 20:55:25
浏览量 1163
回复：1

前几天我们测试过Webduino Smart控制网页上的图片。今天我们在做个稍微花式点的功能，让角度连续地变化，并且程序输入量使用光敏电阻的信号。 Webduino Smart上面有个光敏电阻接在adc脚上，随着光强变化输出是0到1的浮点数据。我们一起用积木组个小程序，让网页上的图片的角度随着光线变化。搭好的积木是下图这样的光控图1.JPG

程序如下所示

var button;

var photocell;





boardReady({board: 'Smart', url: '172.25.204.3'}, function (board) {

  board.systemReset();

  board.samplingInterval = 50;

  document.getElementById("demo-area-03-image").setAttribute("src",'http://static.ickimg.com/assets/release3.001/img/pic/logo-300-72.png?v=20160723');

  button = getPullupButton(board, 4);

  photocell = getPhotocell(board, 0);

  var imageWidth = 281;

  var imageHeight = 61;

  document.getElementById("demo-area-03-image").style.width = imageWidth+"px";

  document.getElementById("demo-area-03-image").style.height = imageHeight+"px";

  photocell.on(function(val){

    photocell.detectedVal = val;

    var deg = (90 * photocell.detectedVal);

    document.getElementById("demo-area-03-image").style.transform = "rotate("+deg+"deg)";

  });

});

程序运行效果：光线弱的时候的效果光控图2.JPG

光线强的时候的效果

我给大伙儿提供个思路：你可以换一个图片链接，换个指针的图片，做个指针式的光强计，随着光线变化，指针偏转不同的角度。最后，感谢Webduino和云汉提供的这次评测机会，我会在接下来的文章里多发一点干货，与大伙儿一起学习和分享该开发板的相关知识。

程序如下所示

var button;

var photocell;





boardReady({board: 'Smart', url: '172.25.204.3'}, function (board) {

  board.systemReset();

  board.samplingInterval = 50;

  document.getElementById("demo-area-03-image").setAttribute("src",'http://static.ickimg.com/assets/release3.001/img/pic/logo-300-72.png?v=20160723');

  button = getPullupButton(board, 4);

  photocell = getPhotocell(board, 0);

  var imageWidth = 281;

  var imageHeight = 61;

  document.getElementById("demo-area-03-image").style.width = imageWidth+"px";

  document.getElementById("demo-area-03-image").style.height = imageHeight+"px";

  photocell.on(function(val){

    photocell.detectedVal = val;

    var deg = (90 * photocell.detectedVal);

    document.getElementById("demo-area-03-image").style.transform = "rotate("+deg+"deg)";

  });

});

程序运行效果：光线弱的时候的效果光控图2.JPG

光线强的时候的效果