<!DOCTYPE html>
<html lang="en">
<head>
<!-- Basic Page Needs
================================================== -->
<meta charset="utf-8">
<!--[if IE]><meta http-equiv="x-ua-compatible" content="IE=9" /><![endif]-->
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>week_12 Interface and Application Programming </title>
<meta name="description" content="Your Description Here">
<meta name="keywords" content="FabLab Taipei,FabLab,Zihao Lin,FabLab SCU">
<meta name="author" content="Lin Zihao">
<!-- Favicons
================================================== -->
<link rel="shortcut icon" href="img/favicon.ico" type="image/x-icon">
<link rel="apple-touch-icon" href="img/apple-touch-icon.png">
<link rel="apple-touch-icon" sizes="72x72" href="img/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="114x114" href="img/apple-touch-icon-114x114.png">
<!-- Bootstrap -->
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="fonts/font-awesome/css/font-awesome.css">
<!-- Slider
================================================== -->
<link href="css/owl.carousel.css" rel="stylesheet" media="screen">
<link href="css/owl.theme.css" rel="stylesheet" media="screen">
<!-- Stylesheet
================================================== -->
<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="stylesheet" type="text/css" href="css/responsive.css">
<script type="text/javascript" src="js/modernizr.custom.js"></script>
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<!-- Navigation
==========================================-->
<nav id="tf-menu" class="navbar navbar-default navbar-fixed-top">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.html">Lin Zihao</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li><a href="index.html" class="page-scroll">Home</a></li>
<li><a href="Final Project.html" class="page-scroll">Final Project</a></li>
<li><a href="#tf-testimonials" class="page-scroll">Contact</a></li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<!-- Home Page
==========================================-->
<div id="tf-home" class="text-center">
<div class="overlay">
<div class="content">
<h1><strong><span class="color">week_12</span></strong></h1>
<p class="lead"><strong>Interface and Application Programming</strong></p>
<a href="#tf-services" class="fa fa-angle-down page-scroll"></a>
</div>
</div>
</div>
<!-- Services Section
==========================================-->
<div id="tf-services">
<div class="container">
<div class="text-center">
<div class="section-title center" >
<h2><strong>Objectives/strong></h2>
<div class="line">
<hr>
</div>
</div>
</div>
<ul class="about-list">
<li>
<span class="fa fa-dot-circle-o"></span>
<strong>1)</strong> - <em>Master application development skills.</em>
</li>
<li>
<span class="fa fa-dot-circle-o"></span>
<strong>2)</strong> - <em>Master application debugging.</em>
</li>
</ul>
<br />
<div class="text-center">
<div class="section-title center" >
<h2><strong>Assignments</strong></h2>
<div class="line">
<hr>
</div>
</div>
</div>
<ul class="about-list">
<li>
<span class="fa fa-dot-circle-o"></span>
<strong>1)</strong> - <em>Individual assignment: write an application that interfaces a user with an input /or output device that you made.</em>
</li>
<li>
<span class="fa fa-dot-circle-o"></span>
<strong>2)</strong> - <em>Group assignment: compare as many tool options as possible.</em>
</li>
</ul>
<br />
<div class="text-center">
<div class="section-title center" >
<h2><strong>MATLAB</strong></h2>
<div class="line">
<hr>
</div>
</div>
</div>
<div class="section-title center" >
<h4><strong>Hello.HC-SR04</strong></h4>
</div>
</div>
<p>
I used the program of Arduino to call the serial port in MATLAB to read the data, and I needed to use serial object in MATLAB.<br/>
But there is a problem which is "A timeout occurred before the Terminator was reached".
</p>
<p style="text-align:center"><img src="img/week_12/Picture01.jpg" class="img-responsive" alt="..."></p><br/>
<p>Later, I found that the data I output in the serial port has English letters, which cannot be used for picture drawing. So I got rid of the code"So I got rid of the code",But it didn't work. So i serach in the interner. I found that i cannot write the code" Serial.print(cm);". I need to write the code "Serial.println(cm)". Then it worked.</p>
<p style="text-align:center"><img src="img/week_12/Picture02.jpg" class="img-responsive" alt="..."></p><br/>
<iframe width="864" height="684" src="https://www.youtube.com/embed/qUoNypkmrsU" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<div class="section-title center" >
<h4><strong>Hello.HC-SR04</strong></h4>
</div>
</div>
<p>Interfacing serial port with MATLAB is also quite simple: If your device is connected to port COM3, this is the code that reads the port into 256byte buffer and selects the maximum value. Then the script starts to update the plot figure by adding a new value every time new value is ready. This is a way to collect longer period of history data from a sensor.</p>
<p style="text-align:center"><img src="img/week_12/Picture03.jpg" class="img-responsive" alt="..."></p><br/>
<p>
Then I run the program, here is the movie：<br/>
<iframe width="864" height="486" src="https://www.youtube.com/embed/wisEjsptEa8" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</p>
<div class="text-center">
<div class="section-title center" >
<h2><strong>Processing</strong></h2>
<div class="line">
<hr>
</div>
</div>
</div>
<p>I visit <a href="https://processing.org/download/support.html">the processing.org website</a> download and installed it. I read and watched different tutorials for understanding how to do my assignment. I got a lot of information at www.processing.org website. </p>
<div class="section-title center" >
<h4><strong>Hello.light.45</strong></h4>
</div>
</div>
<p>I started doing my weekly assignment, I took hall sensor board from week_09, hello.light.45 board. The resulting code looks like this.</p>
<p style="text-align:center"><img src="img/week_12/Picture04.jpg" class="img-responsive" alt="..."></p><br/>
<p>
Here is the Movie, you can see how it worked.<br/>
<iframe width="864" height="486" src="https://www.youtube.com/embed/hCqyZ749-2U" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</p>
<div class="text-center">
<div class="section-title center" >
<h2><strong>File Download</strong></h2>
<div class="line">
<hr>
</div>
</div>
</div>
<p> <a href="Files/week_12/Matlab.rar">Matlab</a> </p>
<p> <a href="Files/week_12/Processing.rar">Processing</a> </p>
</div>
</div>
<!-- Testimonials Section
==========================================-->
<div id="tf-testimonials" class="text-center">
<div class="overlay">
<div class="container">
<div class="section-title center">
<div class="section-title center">
<h2><strong>contact Me</strong></h2>
<div class="line">
<hr>
</div>
<div class="clearfix"></div>
<small><em>
Address: No.10, Kehua street, Wuhou District, Chengdu, Sichuan Province, China<br />
TEL: (028) 85406538 (+86)18981085882<br />
E-mail: linzihao@scuspark.com<br />
QQ: 386866966
</em></small>
</div>
<form>
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label for="exampleInputEmail1">Email address</label>
<input type="email" class="form-control" id="exampleInputEmail1" placeholder="Enter email">
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label for="exampleInputPassword1">Password</label>
<input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
</div>
</div>
</div>
<div class="form-group">
<label for="exampleInputEmail1">Message</label>
<textarea class="form-control" rows="3"></textarea>
</div>
<button type="submit" class="btn tf-btn btn-default">Submit</button>
</form>
</div>
</div>
</div>
</div>
<nav id="footer">
<div class="container">
<div class="pull-left fnav">
<p>Science Park of Sichuan University Co.Ltd. All rights reserved. © 2020. Designed by Lin Zihao</p>
</div>
<div class="pull-right fnav">
<ul class="footer-social">
<li><a href="https://www.facebook.com/zihao.lin.7399"><i class="fa fa-facebook"></i></a></li>
<li><a href="#"><i class="fa fa-dribbble"></i></a></li>
<li><a href="#"><i class="fa fa-google-plus"></i></a></li>
<li><a href="#"><i class="fa fa-twitter"></i></a></li>
</ul>
</div>
</div>
</nav>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.1.11.1.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script type="text/javascript" src="js/bootstrap.js"></script>
<script type="text/javascript" src="js/SmoothScroll.js"></script>
<script type="text/javascript" src="js/jquery.isotope.js"></script>
<script src="js/owl.carousel.js"></script>
<!-- Javascripts
================================================== -->
<script type="text/javascript" src="js/main.js"></script>
</body>
</html>