of 9

Arduino Sonar

Published on February 2017 | Categories: Documents | Downloads: 8 | Comments: 0
77 views

Comments

Content


By Miłosz Orzeł 2. October 2014 23:25
[ OoB] Shooting paintball maker with relay, Arduino and . NET WinForms
My fi rst Ardui no based project was Sonar wi th C#, JS and HTML5 . Now I conti nue the "Out of Boredom" seri es wi th a setup
that al l ows firing a paintball marker (gun) wi th a command sent from a computer :) Thi s ti me s oftware s tack i s s i mpl er - jus t a
smal l Ardui no sketch and uncompl i cated Wi nForms (.NET/C#) appl i cati on, but hardware requi res a bi t of el ectroni cs
knowl edge. Don't worry though, nothi ng too compl i cated - I'm defi ni tel y not an expert i n thi s fi el d...
The project i s based around an electromechanical relay. Such rel ay i s basi cal l y an el ectroni cal l y control l ed s wi tch that al l ows
you to turn powerful devi ces on and off by s endi ng a si gnal from Ardui no's output pi ns. You can control very l arge motors or
l i ght bul bs for exampl e. The beauty of thi s components i s the fact that you can govern external ci rcui ts - there i s no physi cal
l i nk between your control ci rcui t and the thi ng you want to turn on/off. You can us e a rel ay for devi ces that requi re huge
current but you can al so control more s ubtl e equi pment, and that's what I deci ded to do. I pl ay pai ntbal l /speedbal l and I
happen to own hi gh-end el ectro-pneumati c marker cal l ed DM13. Such marker has el ectroni cal l y operated tri gger and uses
sol enoi d val ve to s hoot... I thought: "Woul dn't i t be cool to pres s enter on my l aptop and make thi s gun fi re nearl y 20 bal l s
per s econd?"... See thi s vi deo to s ee how i t worked :)
Thi s i s a l i s t of hardware parts used:
Element Role
Ardui no Uno R3 Control l i ng tri gger vi a rel ay and communi cati ng wi th PC
JZC-11F 005-I Z SPDT rel ay Si mul ati ng tri gger pul l by cl osi ng tri gger ci rcui t
P2N2222AG NPN transi s tor Suppl yi ng current to operate rel ay
1.2k Ohm resi stor Li mi ti ng transi s tor base current
Green LED Si gnal l i ng ready state
Red LED Si gnal l i ng fi ri ng
2x 330 Ohm resi stor Li mi ti ng current goi ng through di odes
Pi ezo buzzer Si gnal l i ng read/fi re wi th di fferent tones
SPST swi tch Turni ng buzzer on/off
Breadboard and jumper wi res or uni vers al board Connecti ng components
And thi s i s the ci rcui t di agram:
LED connected to Pin 13 i s us ed to si gnal that devi ce i s ready, LED attached to Pin 12 i ndi cates fi ri ng (cl osed tri gger ci rcui t).
LEDs are of cours e not connected to Ardui no di rectl y, there are resi stors protecti ng them from overcurrent. Buzzer i s there to
make one tone when devi ce i s ready and another (hi gher) tone when devi ce i s fi ri ng. The purpose of a swi tch i s to make
your l i fe easi er whi l e testi ng. Buzzer s ound can get annoyi ng qui ckl y so you can turn i t off...
Thes e are the bori ng bi ts, the more interesting stuff i s on the l eft si de of the di agram. Pin 2 i s connected (vi a resi s tor) to a
base of NPN transi s tor and collector i s attached to relay coil. The transi stor i s needed because the coi l , whi ch control s the
swi tchi ng functi on, needs more power then Ardui no output pi ns can suppl y. In thi s ci rcui t transi s tor i s used not as
ampl i fi er but as a swi tch. When Pin 2 i s set to HIGH (base-emi tter vol tage = 5V) the transi stor reaches i ts ful l y-on state and
current fl ows through col l ector energi zi ng the coi l . Putti ng HIGH state on Pin 2 resul ts i n a connecti on between rel ay's COM
(Common) and NO (Normally Open) pi ns. I 've checked my marker wi th a mul ti meter (i n resi s tance mode) and I was abl e to
see that pul l i ng the tri gger resul ted i n a cl os ed ci rcui t between mi ddl e and l ower pi ns of the tri gger swi tch. Attachi ng one
cabl e between middle pin of the swi tch and COM pi n, and another cabl e between lower switch pin and Normally Open pi n
gi ves the abi l i ty to simulate trigger pull. I n other words: HIGH state on Ardui no's Pin 2 equal s tri gger pul l as far as maker i s
concerned*. I t's qui te si mpl e but as you've s een on the vi deo i t works real l y wel l ! One more thi ng: l ook on the di agram on
the ri ght-hand si de of JZC-11F rel ay - there's a si gnal di ode and i t's purpose i s to protect the transi stor from vol tage spi kes
that appear when Pin 2 to i s put to LOW s tate (when suppl y vol tage i s removed from rel ay's coi l ). Such di ode usage i s cal l ed
"fl yback" or "freewheel i ng"... I fi rst created thi s ci rcui t on a breadboard and then sol dered i t on a uni versal board... Keep i n
mi nd that there are mul ti pl e Ardui no rel ay shi el ds avai l abl e so you don't real l y have to create s uch transi stor bas ed ci rcui t
yoursel f. I di d i t becaus e I thi nk that i t's a ni ce way to refres h some very bas i c el ectroni cs knowl edge. Ok, we are done wi th
hardware!
Now time for software (thi s GitHub repository contai ns al l the code)!
- about me
What for ?
I can’t i magi ne worki ng as a programmer
wi thout hundreds of web pages on whi ch
peopl e "wasti ng" thei r free ti me s hare
what they managed to fi nd out. Therefore
I wi l l try to add a bi t of useful i nformati on
to the web’s res ources mysel f...
Also on CodePr oject !
260K reads si nce may 2012 :)
Language
Thi s bl og i s my fi rst attempt to wri te i n
Engl i sh so i f you s ee any l anguage
mi stakes pl ease l et me know. I di dn’t
have enough ti me to transl ate most of my
ol d posts but I wi l l try to make new ones
both i n Pol i sh and i n Engl i sh.
Znasz pol ski ? Kl i kni j tutaj.
Enter search term or APML url Szukaj
Include comments in search
Cat egories
.NET Framework/C# (13)
Ajax (5)
Ardui no (3)
Arti cl es (2)
ASP.NET MVC (2)
ASP.NET Web Forms (8)
Automati on (1)
CodeProject (19)
Depl oyment (1)
Ext JS (1)
Graphi cs (5)
HTML5 (3)
JavaScri pt (10)
JQuery (1)
Out Of Boredom (3)
Regex (2)
SVN (1)
Vi s ual Studi o (2)
WebSphere MQ (2)
Hist or y
2014
October (1)
September (2)
June (1)
May (1)
Apri l (1)
2013
2012
2011
2010
2009
2008
2007
Home Archive Contact Subscribe
Here's compl ete Arduino sketch:
Nothi ng compl i cated :) Fi rs t, the us ual (good) practi ce of creati ng constants for pi n numbers and other useful val ues . Then
there i s a setup method that confi gures pi n modes , i ni ti al i zes seri al connecti on (used to communi cate wi th PC), and turns
on the "ready" LED. There i s al so a cal l to tune functi on. tune i s used to generate s ound by maki ng pi ezoel ectri c el ement i n
buzzer vi brate at a desi gnated frequency. I n loop functi on program wai ts for data sent by PC vi a seri al port and checks i f thi s
data means a fi re command (ASCII l etter 'F'). I f s o, a tri gger pul l i s s i mul ated fol l owed by a sl i ght del ay and tri gger rel eas e.
The digitalWrite(fireRelayPin, HIGH); l i ne i s what makes pai ntbal l gun fi re. I f you've l ooked careful l y ,you've noti ced
Serial.write(readyToFireMessage); cal l s i n setup and releaseTrigger functi ons. Thes e exi s t to l et computer know that Ardui no i s
ready to recei ve fi rst fi re command or i s ready to proces s a new one.
Thi s i s the .NET 4.5 WinForms application bui l d to control pai ntbal l marker:
Pres si ng "Fi re" button once makes the marker fi re one shot, pressi ng and hol di ng i t makes i t fi re i n a s eri es . How many
bal l s per second wi l l be fi red depends of cours e on triggerPullDelayInMs val ue, rel ay s peed, marker setti ngs (mi ne DM13
was setup i n semi mode capped to around 20bps), pai ntbal l l oader speed etc. Shooti ng i s onl y possi bl e when "Devi ce i s
ready to fi re" shows "YES" and "Safe" checkbox i s not ti cked.
Here's the code behi nd the CommandWindow s how above (few parti cul ari ty dul l l i nes removed):
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
const byte fireRelayPin = 2;
const byte fireBuzzerPin = 11;
const byte fireLedPin = 12;
const byte readyLedPin = 13;

const byte readyToFireMessage = 6; // ASCII ACK
const byte fireCommand = 70; // ASCII F
const byte triggerPullDelayInMs = 30;
const byte fireBuzzerHz = 1000;
const byte readyBuzzerHz = 400;

void setup() {
pinMode(fireRelayPin, OUTPUT);
pinMode(fireBuzzerPin, OUTPUT);
pinMode(fireLedPin, OUTPUT);
pinMode(readyLedPin, OUTPUT);

Serial.begin(9600);

tone(fireBuzzerPin, readyBuzzerHz);
digitalWrite(readyLedPin, HIGH);

Serial.write(readyToFireMessage);
}

void loop() {
if (Serial.available()) {
byte data = Serial.read();

if (data == fireCommand) {
pullTrigger();
delay(triggerPullDelayInMs);
releaseTrigger();
}
}
}

void pullTrigger() {
digitalWrite(fireLedPin, HIGH);
digitalWrite(fireRelayPin, HIGH);
tone(fireBuzzerPin, fireBuzzerHz);
}

void releaseTrigger() {
digitalWrite(fireLedPin, LOW);
digitalWrite(fireRelayPin, LOW);
tone(fireBuzzerPin, readyBuzzerHz);

Serial.write(readyToFireMessage);
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
using System;
using System.Drawing;
using System.IO.Ports;
using System.Threading;
using System.Windows.Forms;

namespace PbFireApp
{
public partial class CommandWindow : Form
{
private const byte ReadyToFireMessage = 6; // ASCII ACK
private const byte FireCommand = 70; // ASCII F

private bool _isReadyToFire;
private bool IsReadyToFire
{
get
{
return _isReadyToFire;
}
set
{
_isReadyToFire = value;
SetIsReadyToFireLabel();
Submi t to DotNetKi cks...
Tags: rel ay, pai ntbal l , DM13, seri al , gun .NET Framework/C# | CodeProject | Out of Boredom | Ardui no
By Miłosz Orzeł 24. September 2014 00:07
The app i s s o si mpl e that I deci ded to put al l the code i n to form's cs fi l e... SerialPort component i s us ed to communi cate
wi th Ardui no (I 've wri tten a bi t more about seri al communi cati on i n Sonar project pos ts ). Pai ntbal l marker i s i nstructed to
fi re when 'F' command (short for "Fi re", ASCI I code 70) i s s ent to Ardui no. Thi s l i ne i s respons i bl e for i t:
DataReceivedHandler method i s us ed to set IsReadyToFire property to true when ACK (Acknowl edge, ASCI I 6) message i s
obtai ned from Ardui no...
The code i s qui te obvi ous except for the SetIsReadyToFireLabel method. Why i t i s needed? The col or and text of a Label control
are changed when IsReadyToFire property i s set. And that can happen when DataReceivedHandler i s executed. We can't
di rectl y change UI el ements from SerialPort.DataReceived event handl er becaus e thi s wi l l resul t i n an InvalidOperationException
wi th a mess age s uch as thi s: "Cross-thread operati on not val i d: Control 'l bl I s ReadyToFi re' access ed from a thread other
than the thread i t was created on.".
And that's i t, second "Out of Boredom" project is complete :)
1. It should be possible to control solenoid valve directly but that would be more complicated and might result in damaging my precious
DM13.…
Permal i nk | Comments (0)
[ OoB] Sonar with Arduino, C#, JavaScript and HTML5 (Part 2)
Part 1 des cri bed the general i dea behi nd Sonar project, hardware components us ed and Ardui no sketch... Thi s s econd
post i n "Out of Boredom" s eri es i s about C# and JavaScript programs that make i t possi bl e to di spl ay ul trasoni c range s ensor
data i n web browsers. The rol e of .NET appl i cati on i s to recei ve messages from Ardui no over seri al port and broadcas t i t to
cl i ents usi ng Si gnal R l i brary. JS/HTML5 cl i ents use jquery.signalR l i b to obtai n i nformati on about servo posi ti on wi th
di stance to obs tacl es and us e thi s data to render sonar i mage on canvas:
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
}
}

public CommandWindow()
{
InitializeComponent();

IsReadyToFire = false;
spArduino.DataReceived += new SerialDataReceivedEventHandler(DataReceivedHandler);
}

private void DataReceivedHandler(object sender, SerialDataReceivedEventArgs e)
{
byte data = (byte)spArduino.ReadByte();
IsReadyToFire = data == ReadyToFireMessage;
}

private void Fire()
{
if (!chkSafe.Checked && IsReadyToFire)
{
IsReadyToFire = false;
spArduino.Write(new byte[] { FireCommand }, 0, 1);
}
}

private void btnConnect_Click(object sender, EventArgs e)
{
try
{
if (spArduino.IsOpen)
{
spArduino.Close();

btnConnect.Text = "Connect";
gbFire.Enabled = false;
}
else
{
spArduino.BaudRate = (int)nudBaudRate.Value;
spArduino.PortName = txtPortName.Text;

spArduino.Open();

btnConnect.Text = "Disconnect";
gbFire.Enabled = true;
}
}
catch (Exception ex)
{
MessageBox.Show(ex.ToString(), "Oh no :(", MessageBoxButtons.OK, MessageBoxIcon.Error);
}
}

// ... more ...

delegate void SetIsReadyToFireLabelCallback();

private void SetIsReadyToFireLabel()
{
if (lblIsReadyToFire.InvokeRequired)
{
SetIsReadyToFireLabelCallback d = new SetIsReadyToFireLabelCallback(SetIsReadyToFireLabel);
Invoke(d, new object[] { });
}
else
{
lblIsReadyToFire.Text = IsReadyToFire ? "YES" : "NO";
lblIsReadyToFire.ForeColor = IsReadyToFire ? Color.Orange : Color.Black;
}
}
}
}
1 spArduino.Write(new byte[] { FireCommand }, 0, 1);
Thes e l i nks are i n previ ous pos t, but jus t to remi nd you:
Thi s Gi tHub reposi tory contai ns al l the code of Sonar project.
Thi s short vi deo shows worki ng Sonar.

1. SonarServer
SonarServer i s a .NET 4.5 console app created i n Vi s ual Studi o Expres s 2013 for Wi ndows Desktop. I t uses
Microsoft.AspNet.SignalR.SelfHost and Microsoft.Owin.Cors NuGet packages to create self-hosted SignalR server. ASP.NET Si gnal R
i s a l i brary des i gned to make i t eas y to create appl i cati ons that are abl e to push data to cl i ents runni ng i n web browsers.
Thi s i s i n contrast to normal web pages /apps behavi or where the cl i ent (browser) asks server for acti on by i s sui ng a
request (s uch as GET or POST). Si gnal R al l ows cl i ents to listen for mes sages send by a server... I f pos si bl e Si gnal R wi l l use
WebSockets to enabl e effi ci ent bi -di rectori al connecti on. I f that opti on i s not avai l abl e due to ei ther browser or server
l i mi tati ons, i t wi l l automati cal l y s wi tch to other pus h techni ques l i ke long polling or Server-Sent Events. When I tested the
code on my l aptop wi th Wi ndows 7 Home Premi um SP1, l ong pol l i ng was used on IE 11 and SSE i n Chrome 37. Server was
sendi ng about 20 messages per s econd and cl i ents di dn't have any probl ems wi th handl i ng that l oad (communi cati on was
on l ocal host). Sel f-hosti ng means that Si gnal R s erver doesn't have to be run on a web s erver s uch as I I S - i t can exi st i n
pl ai n ol d consol e project! If you are compl etel y new to Si gnal R check thi s tutori al ...
Thi s i s SonarServer project structure:
SonarData.cs fi l e contai ns s uch struct:
Server wi l l s end a l i s t of such objects to cl i ents.
SonarHub.cs contai ns a cl as s deri ved form Hub. I t doesn't decl are any methods but i s nonethel ess useful . Li brary wi l l us e i t
to generate JavaScri pt proxy objects...
Startup.cs fi l e l ooks l i ke thi s:
I t confi gures the Si gnal R s erver, l etti ng i t support cross -domai n connecti on thanks to UseCors cal l .
Bel ow are the mos t i mportant bi ts of Program.cs fi l e. Thi s code:
1
2
3
4
5
6
7
8
namespace SonarServer
{
public struct SonarData
{
public byte Angle { get; set; }
public byte Distance { get; set; }
}
}
1
2
3
4
5
6
7
8
9
using Microsoft.AspNet.SignalR;

namespace SonarServer
{
public class SonarHub : Hub
{

}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
using Microsoft.Owin.Cors;
using Owin;

namespace SonarServer
{
class Startup
{
public void Configuration(IAppBuilder app)
{
app.UseCors(CorsOptions.AllowAll);
app.MapSignalR();
}
}
}
1
2
3
4
5
using (SerialPort sp = new SerialPort())
{
sp.PortName = "COM3";
sp.ReceivedBytesThreshold = 3;
sp.DataReceived += new SerialDataReceivedEventHandler(DataReceivedHandler);
i s res ponsi bl e for opening a connection with Arduino over seri al port named "COM3" and starting SignalR server
on localhost:8080. ReceivedBytesThreshold property al l ows us to control the amount of bytes recei ved from Ardui no before
DataReceivedHandler i s cal l ed. You can i ncrease thi s val ue i f you want bi gger packages of data to be broadcasted by s erver
and rendered by cl i ents. Thi s i s the part of DataReceivedHandler method that l oads seri al port data i nto a byte array:
Such array of bytes i s l atter on added to cus tom buffer and process ed to create a l i st of SonarData objects sent to Si gnal R
cl i ents . Part 1 menti oned that Ardui no s ends data to PC i n bytes (array) packages contai ni ng three el ements : [255, angle,
distance]. The purpose of s peci al 255 val ue i s to s eparate angl e-di s tance pai rs of val ues whi ch are used to create sonar
i mage. We can't jus t send [angle, distance] stream from Ardui no to PC, becaus e the Server coul d eas i l y l oos e track of whi ch
val ue i s angl e and whi ch i s di stance. Thi s mi ght happen due to del ays, bufferi ng etc. Sure i t's not a bul l etproof protocol
but i t work wel l when I tested i t. Lot's not get crazy wi th that - i t's a hobby project, remember? :) Check ProcessSonarData
method i n reposi tory i f you want to s ee how an array of bytes i s turned i nto SonarData l i s t (wi th bufferi ng taken i nto
account)...
The l ast mi ss i ng pi ece of SonarServer puzzl e i s SendSonarDataToClients method:
Thi s i s the thi ng that actual l y broadcasts data to clients runni ng i n web browsers. You may be wonderi ng why SonarHub
i nstance i s not created di rectl y wi th new operator and i ns tead GetHubContext method i s used. Thi s i s because Si gnal R i s
respons i bl e for i ts hubs l i fe cycl e. Such code:
woul d resul t i n the excepti on: System.InvalidOperationException: Using a Hub instance not created by the HubPipeline is
unsupported." .

2. SonarClient
SonarCl i ent i s the s ubproject respons i bl e for drawing sonar image. It's not a Vi s ual Studi o s ol uti on - jus t a few fi l es :
I 've tested SonarCl i ent code i n I E 11 and Chrome 37 and i t worked real l y wel l . The as sumpti on i s that you run modern
browser too. I di dn't bother wi th any feature detecti on, i t's enough for me that I have to wri te for I E9 at work - wel l , at l eas t
i t's not I E 6, huh? ;) But i f you want to do such thi ng I can recommend Moderni zr l i brary...
Thi s i s content of index.html fi l e (wi th some bori ng parts removed for brevi ty):
Mos t i mportant bi t of thi s HTML5 markup i s the canvas el ement used to create s onar i mage. The page i mports jquery and
6
7
8
9
10
11
12
13
14
15
16

sp.Open();

Console.WriteLine("Serial port opened!");

using (WebApp.Start<Startup>("http://localhost:8080/"))
{
Console.WriteLine("Server running!");
Console.ReadKey();
}
}
1
2
3
int count = sp.BytesToRead;
[] data = new byte[count];
sp.Read(data, 0, count);
1
2
3
4
5
6
7
private static void SendSonarDataToClients(List<SonarData> sonarDataForClients)
{
var hub = GlobalHost.ConnectionManager.GetHubContext<SonarHub>();
hub.Clients.All.sonarData(sonarDataForClients);

Console.WriteLine("Sonar data items sent to clients. Samples count=" + sonarDataForClients.Count);
}
1
2
SonarHub sonarHub = new SonarHub();
sonarHub.Clients.All.sonarData(sonarDataForClients);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<!DOCTYPE html>
<html>
<head>
<title>Sonar - sample code from morzel.net blog post</title>
<style>
/* more */
</style>
</head>
<body>
<div>
<canvas id="sonarImage" width="410" height="210"></canvas>

<table>
<!-- more -->
</table>
</div>

<a href="http://morzel.net" target="_blank">morzel.net</a>

<script src="lib/jquery-1.6.4.js"></script>
<script src="lib/jquery.signalR-2.1.1.js"></script>
<script src="http://localhost:8080/signalr/hubs"></script>
<script src="sonarStats.js"></script>
<script src="sonarImage.js"></script>
<script src="sonarConnection.js"></script>

<script>
$(function () {
sonarImage.init('sonarImage');
sonarConnection.init('http://localhost:8080/signalr');
});
</script>
</body>
</html>
jquery.signalR l i brari es that make i t pos si bl e to communi cate wi th the Server. That l i ne i s parti cul arl y i nteres ti ng:
<s cri pt s rc="http://l ocal hos t:8080/si gnal r/hubs"></s cri pt>
Si ngal R automati cal l y creates JavaScri pt proxy objects for server-cl i ent messagi ng, that l i ne l ets us l oad them i nto
page. Last three scri pt references are for JS modul es respons i bl e for: di spl ayi ng i nfo about data recei ved from SonarServer,
renderi ng sonar i mage and communi cati on wi th server, respecti vel y. Later there's a s hort scri pt whi ch i ni ti al i zes the
modul es after pages DOM i s ready.
I wi l l s ki p the descri pti on of sonarStats.js fi l e (nothi ng fancy there - just fi l l i ng some tabl e cel l s ). But sonarConnection.js
shoul d be i nteresti ng for you. Thi s i s the whol e content:
The init method sets Si gnal R hub URL al ong wi th sonarData handler and starts a connection wi th the .NET app. There i s al so
some very bas i c hub avai l abi l i ty check (jquery.signalR l i brary has extensi ve support for connecti on rel ated events but l ets
keep thi ngs s i mpl e here). processSonarData i s i nvoked i n response to Server cal l i ng
hub.Clients.All.sonarData(sonarDataForClients). The processSonarData functi on recei ves an array of objects contai ni ng
i nformati on about servo angl e and di stance to obs tacl es. Si gnal R takes care of proper seri al i zati on/des eri al i zati on of data
- you don't have to pl ay wi th JSON yoursel f. $.each functi on (part of jQuery) i s used to i nvoke sonarImage.draw and
sonarStats.fillTable methods for every i tem i n sonarData array...
And here comes the modul e that changes pai rs of angl e-di stance val ues i nto o ni ce s onar i mage (whol e code of
sonarImage.js):
Agai n we have an init method. I t obtai ns 2d drawing context from canvas and us es i t to s et l i ne wi dth and col or (green). I t
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
var sonarConnection = (function () {
'use strict';

var sonarHub, startTime, numberOfMessages, numberOfSamples;

var processSonarData = function (sonarData) {
numberOfMessages++;
$.each(sonarData, function (index, item) {
numberOfSamples++;
sonarImage.draw(item.Angle, item.Distance);
sonarStats.fillTable(item.Angle, item.Distance, startTime, numberOfMessages, numberOfSamples);
});
};

return {
init: function (url) {
$.connection.hub.url = url;

sonarHub = $.connection.sonarHub;

if (sonarHub) {
sonarHub.client.sonarData = processSonarData;

startTime = new Date();
numberOfMessages = 0;
numberOfSamples = 0;

$.connection.hub.start();
} else {
alert('Sonar hub not found! Are you sure the server is working and URL is set correctly?'
}
}
};
}());
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
var sonarImage = (function () {
'use strict';

var maxDistance = 100;
var canvas, context;

var fadeSonarLines = function () {
var imageData = context.getImageData(0, 0, canvas.width, canvas.height),
pixels = imageData.data,
fadeStep = 1,
green,
fadedGreen;

for (var i = 0; i < pixels.length; i += 4) {
green = pixels[i + 1];

fadedGreen = green - fadeStep;
pixels[i + 1] = fadedGreen;
}

context.putImageData(imageData, 0, 0);
};

return {
init: function (canvasId) {
canvas = document.getElementById(canvasId);
context = canvas.getContext('2d');

context.lineWidth = 2;
context.strokeStyle = '#00FF00';
context.fillStyle = "#000000";

context.fillRect(0, 0, canvas.width, canvas.height);

context.translate(canvas.width / 2, 0);
context.scale(2, 2);
},

draw: function (angle, distance) {
context.save();

context.rotate((90 - angle) * Math.PI / 180);
context.beginPath();
context.moveTo(0, 0);
context.lineTo(0, distance || maxDistance); // Treat 0 as above range
context.stroke();

context.restore();

fadeSonarLines();
}
};
}());
Submi t to DotNetKi cks...
Tags: Si gnal R, JavaScri pt, HTML5, canvas , C#, .NET, Ardui no, HC-SR04, s ervo
.NET Framework/C# | CodeProject | HTML5 | JavaScri pt | Out of Boredom | Ardui no
By Miłosz Orzeł 16. September 2014 00:41
al so s ets i nner col or (bl ack) and fi l l s the whol e canvas wi th i t. context.translate cal l i s used to move ori gi n of coordi nate
system to the mi ddl e of canvas (hori zontal l y). By defaul t i t s i ts i n upper l eft corner. context.scale i s us ed to make i mage two
ti mes bi gger than i t woul d be drawn i n defaul t setti ngs. Read thi s post i f you want to know more about canvas
coordi nates .
The draw method i s i nvoked for each data s ampl e (angl e-di stance pai r) produced by Ardui no and broadcasted wi th
SonarServer. The distance to obstacl es measured by HC-SR04 s ensor i s repres ented as a l i ne. The bi gger the di stance the
l onger the l i ne. Thi s happens thanks to beginPath, moveTo, lineTo, and stroke cal l s. context.rotate method i s responsi bl e for
showi ng the angle i n whi ch the s ensor was poi nti ng whi l e measuri ng di stance (angl e of servo arm). As the servo moves
around we want to change the di recti on i n whi ch di s tance l i ne i s drawn. Noti ce that code responsi bl e for drawi ng the l i ne
i s s urrounded by context.save and context.restore cal l s. These two ensure that rotati on transformati on does n't accumul ate
between draw method cal l s...
fadeSonarLines functi on i s responsi bl e for creati ng the effect of ol der s onar l i nes disappearing i n a ni ce gradual way.
context.getImageData method returns an array of RGBA val ues representi ng the pi xel s that create current canvas i mage. The
functi on l oops through i mage data and progressi vel y reduces the i ntens i ty of green col or component. Thi s way s onar l i nes
fade to bl ack.
And vi ol a - sonar i mage can be rendered i n a browser :)
I sn't i t amazing what i s now pos si bl e on the web pl atform? I 'm not exactl y a di nosaur but I remember when di s pl ayi ng a di v
overl ay on a page requi red us e of hi dden i frame (because sel ect el ements were otherwi s e rendered above the overl ay)...
Crazy ti mes ;)
Permal i nk | Comments (0)
[ OoB] Sonar with Arduino, C#, JavaScript and HTML5
Thi s post marks the begi nni ng of "Out of Boredom" seri es. I t wi l l be about creati ng s tuff wi th my recentl y purchas ed Arduino
Uno. Let's have a break from chores of profes si onal programmi ng and create somethi ng just for fun :)
My fi rst Ardui no based project i s Sonar. I t uti l i zes ul tras oni c range sens or, servo, Si gnal R and canvas to create s onar i mage:
I am s pl i tti ng the descri pti on i nto two posts . Fi rst pos t wi l l focus on hardware components and Ardui no sketch and the
second wi l l be about .NET and JavaScript appl i cati ons . You can get compl ete code i n thi s GitHub repository. You can al so cl i ck
here to see short video of the whol e thi ng worki ng.
Here are hardware elements used:
Element Role
Ardui no Uno R3 Handl i ng HC-SR04, control l i ng servo and communi cati ng wi th PC
HC-SR04 Ul trasoni c Rangi ng Modul e Measuri ng ti me i t takes s ound to bounce back from objects
9g Tower Pro Mi cro Servo Movi ng sensor to get 180 degree vi ew
Red LED Si gnal l i ng ready state
330 Ohm res i s tor Li mi ti ng current goi ng through di ode
Breadboard and few jumper wi res Connecti ng components wi thout sol deri ng
That's i t, just a few cheap components! Vi rtual l y no el ectroni cs ski l l s are requi red to compl ete thi s project. I ass ume,
however, that you have basi c Ardui no knowl edge and you know a bi t about C# and JavaScri pt.
Here i s the software stack:
Element Role
Ardui no s ketch (fi rmware) Measuri ng di s tance, movi ng servo and sendi ng data to PC over s eri al port
.NET/C# 4.5 consol e appl i cati on wi th
Si gnal R l i brary
Recei vi ng data from Ardui no us i ng SerialPort cl ass and broadcas ti ng angl e and
di s tance i nformati on to cl i ents
HTML5 page wi th JavaScri pt Si gnal R
l i brary
Recei ves data from s erver and creates sonar i mage usi ng canvas el ement
Above mi ght s ound a bi t overwhel mi ng but I assure you that the code i s short and not that compl i cated.
The basic idea goes like this: HC-SR04 sensor measures ti me i t takes an ul trasoni c si gnal to bounce from obstacl es and thi s
gi ves as a chance to cal cul ate di stance to these obs tacl es. Posi ti on of the s ensor i s control l ed by servo. I nformati on about
di stance to objects and di recti on i n whi ch the s ensor i s poi nti ng i s sent to PC that i s runni ng consol e appl i cati on wi th
SignalR sever. PC recei ves the data and sends i t to JavaScri pt cl i ents that are capabl e of presenti ng s onar data i n ni ce vi sual
way us i ng HTML5 canvas el ement...
More details!
The mai n component (except for the Ardui no of course) i s the HC-SR04 Ultrasonic Ranging Module. Thi s s ensor works by
sendi ng sound s i gnal at 40 kHz (so above human percepti on l i mi ts) and detecti ng the echo. That's why thi s project i s cal l ed
"Sonar" and not "Radar" - i t us es sound waves (not radi o waves) do detect objects . The sensor s houl d work i n ranges from
2cm up to 400cm at accuracy of few mi l l i metres . But keep i n mi nd that the shape an materi al of objects mi ght affect
performance. I tested i t at maxi mum di s tance of about 2 meters and was happy wi th the res ul ts . You can us e thi s s ensor
wi thout any l i brari es. That requi res doi ng thi ngs l i ke putti ng HIGH val ue on Trig pi n for 10uS to emi t ul trasoni c si gnal ,
meas uri ng durati on of HIGH pul se on Echo pi n and cal cul ati ng di stance knowi ng that s peed of sound i n the ai r i s around
340m/s... But there's a better way: you can use NewPing l i b (l i nk) to get the di s tance. I f you don't know how to i ncl ude new
l i brary i n your Ardui no sketch cl i ck here .
The second i mportant component i s the servo. HC-SR04 sensor has measuri ng angl e of about 15 degrees. But i f we move i t
around by attachi ng i t to s ervo's arm we can eas i l y get 180 degree vi ew. I won't get i nto detai l s on how s ervo works and
how i t i s control l ed i n thi s post. I pl an to make another post about shooti ng pai ntbal l marker wi th Ardui no+l aptop and I
wi l l des cri be i t then. For now al l you need to know i s that Ardui no comes wi th Servo l i brary whi ch makes i t very easy to
move servo i nto desi red posi ti on (angl e)... I uti l i zed 9g Tower Pro Micro Servo i n thi s project. I t's powerful enough to move
the s ensor yet can be powered di rectl y from Ardui no's +5V pi n.
Last physi cal components are LED used to si gnal the ready s tate (that i s when setup functi on had compl eted) wi th i ts
accompanyi ng resi stor. Maki ng a di ode s hi ne i s el ectroni cs equi val ent of "Hel l o Worl d!" s o I 'm s ure you know how to
handl e LED. Even i f not, you can al ways use the ti ny bui l t-i n LED connected to pi n 13 of Ardui no Uno...
Thi s di agram shows how hardware components s houl d be connected:
Here's the whole code that should be uploaded to Arduino:
As stated before, I assume that you know somethi ng about Ardui no programmi ng and thi ngs l i ke const, pinMode, delay, setup
and loop don't requi re expl anati on...
Fi rst l i nes whi ch s houl d capture your attenti on are:
Above l i nes l et us us e NewPing and Servo cl asses to measure di stance and move the sensor. Noti ce al so that setup functi on
has such l i nes:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
#include <NewPing.h>
#include <Servo.h>

const byte setupReadyLedPin = 8;
const byte triggerPin = 10;
const byte echoPin = 11;
const byte servoPin = 12;

const byte maxDistanceInCm = 100;

byte angle;
byte angleStep;
byte angleStepDelayInMs = 50;

NewPing sonar(triggerPin, echoPin, maxDistanceInCm);
Servo servo;

void setup() {
pinMode(setupReadyLedPin, OUTPUT);

angle = 0;
angleStep = 1;

servo.attach(servoPin);
servo.write(angle);

Serial.begin(9600); // Open connection with PC

digitalWrite(setupReadyLedPin, HIGH);
}

void loop() {
alterServoMoveDirection();

measureAndSendDistance();

angle += angleStep;
servo.write(angle); // Move servo

delay(angleStepDelayInMs);
}

void alterServoMoveDirection() {
if (angle == 180) {
angleStep = -1;
} else if (angle == 0) {
angleStep = 1;
}
}

void measureAndSendDistance() {
byte distanceInCm = sonar.ping_cm(); // Use ultrasound to measure distance

byte sonarData[] = {255, angle, distanceInCm};
Serial.write(sonarData, 3); // Send data to PC
}
1
2
3
4
5
#include <NewPing.h>
#include <Servo.h>

NewPing sonar(triggerPin, echoPin, maxDistanceInCm);
Servo servo;
Submi t to DotNetKi cks...
Tags: Si gnal R, JavaScri pt, HTML5, canvas , C#, .NET, Ardui no, HC-SR04, servo
.NET Framework/C# | CodeProject | HTML5 | JavaScri pt | Out of Boredom | Ardui no
Thes e exi st to s et the pi n used to control the servo and to move the servo i nto i ni ti al posi ti on at 0 degrees.
Thi s l i ne:
al l owes Ardui no to tal k to PC (i n my case a l aptop wi th Wi ndows 7) over serial port. That's ri ght, even though Ardui no Uno i s
connected to computer vi a USB cabl e i t actual l y us es COM port to communi cate. On my machi ne i ts cal l ed "COM3" (screen
shown bel ow comes from Devi ce Manager - my Wi ndows i s i n Pol i sh):
The val ue passed to begi n method determi nates baud rate (communi cati on s peed). I t's i mportant to have the s ame val ue
used i n software that communi cats wi th Ardui no.
The loop functi on moves s ervo and i nvokes measureAndSendDistance functi on whi ch uses NewPing to cal cul ate di s tance and
Serial to send data to PC. Thi s i s how eas y i t i s to get di s tance i n cm thanks to NewPing l i b:
I f meas ured di stance exceeds the maxi mum val ue speci fi ed as l as t parameter to NewPing cons tructor the val ue of 0 i s
returned. Check NewPing docs to s ee other us eful functi ons of thi s l i b.
And fi nal l y thi s i s how Ardui no sends data to PC:
The fi rs t array el ement (255) i s us ed as a marker/separator to easi l y di sti ngui s h pairs of angle-distance values. I ts rol e wi l l
become cl ear i n the s econd post whi ch wi l l des cri be Si gnal R server and cl i ents... I as sume that maxDistanceInCm cons t wi l l
never be s et above 200 so distanceInCm wi l l never have val ue of 255. 255 wi l l never be sent as an angle too becaus e our
servo moves i n 0..180 degrees range. Sure i t mi ght be a good i dea to create const and avoi d 255 magi c number. Some
val i dati on woul d be useful too... But s crew i t, thi s project i s just for fun! :)
Ok, you s urvi ved to the end of the fi rst pos t about Ardui no/.NET/JS/HTML s onar. The second pos t shoul d be ready i n about a
week.
Update 2014-09-29: Here's the Part 2 .
Permal i nk | Comments (0)
Powered by BlogEngine.NET
Theme by Mads Kristensen (with some modifications!)
1
2
servo.attach(servoPin);
servo.write(angle);
1 Serial.begin(9600);
1 byte distanceInCm = sonar.ping_cm()
1
2
byte sonarData[] = {255, angle, distanceInCm};
Serial.write(sonarData, 3); // Send data to PC

Sponsor Documents

Or use your account on DocShare.tips

Hide

Forgot your password?

Or register your new account on DocShare.tips

Hide

Lost your password? Please enter your email address. You will receive a link to create a new password.

Back to log-in

Close