Arduino Nano: DHT11 Temperature and Humidity Visual Instrumentation With Visuino

by BoianM in Circuits > Arduino

18013 Views, 93 Favorites, 0 Comments

Arduino Nano: DHT11 Temperature and Humidity Visual Instrumentation With Visuino

Arduino Nano: DHT11 Temperature and Humidity Visual Instrumentation with Visuino

DTH11/DTH21/DTH22 and AM2301 are very popular combined Temperature and Humidity Arduino sensors.

I already made one Instructable on how to use them and send text information for the Temperature and Humidity over Serial Port.

In this Instructable I will show you how you can use Packet communication and display the data in visual Thermometer and Gauge in Visuino.

Components

5683682e45bceb76990001bb.jpeg
  1. One Arduino compatible board (I use Arduino Nano, because I have one, but any other will be just fine)
  2. One DHT11 Sensor module I got from this cheap 37 sensors set
  3. 3 Female-Female jumper wires

Connect the Humidity/Thermometer Sensor to Arduino

5679c92f4936d4cbf3000aa0.jpeg
568366444936d486150001c7.jpeg
5676e6da67400ccf020005b8.jpeg
5676e6b645bcebb0760000a8.jpeg
5679cb53937ddb6ebe000eb5.jpeg
  1. Connect Ground(Black wire), Power(Red wire), and Data(Gray wire) to the DHT11 Module (Picture 1 shows 2 different types of DHT11 sensor modules. As you can see the pins may differ, so connect carefully!)
  2. Connect the other end of the Ground wire(Black wire) to Ground pin of the Arduino board(Picture 2)
  3. Connect the other end of the Power wire(Red wire) to the 5V power pin of the Arduino board(Picture 2)
  4. Connect the other end of the Data wire(Gray wire) to Digital pin 2 of the Arduino board(Picture 3, and 4)
  5. Picture 5 shows where are the Ground, 5V Power, and Digital 2 pins of the Arduino Nano

Start Visuino, and Select the Arduino Board Type

SelectBoard.png
SelectBoard.png

To start programming the Arduino, you will need to have the Arduino IDE installed from here: http://www.arduino.cc/ .

Please be aware that there are some critical bugs in Arduino IDE 1.6.6.

Make sure that you install 1.6.7 or higher, otherwise this Instructable will not work!

The Visuino: https://www.visuino.com also needs to be installed.

  1. Start Visuino as shown in the first picture
  2. Click on the "Tools" button on the Arduino component (Picture 1) in Visuino
  3. When the dialog appears, select Arduino Nano as shown in Picture 2

In Visuino: Add and Connect DHT11 Component

ComponentDHT11.png
ComponentDHT11Connect.png
  1. Type "dht" in the Filter box of the Component Toolbox then select the "Humidity and Thermometer DHT11/21/22/AM2301" component (Picture 1), and drop it in the design area
  2. Connect the "Sensor" pin of the HumidityThermometer1 component to the "Digital" input pin of the Digital[ 2 ] channel of the Arduino component (Picture 2)

In Visuino: Add Packet Component and Add 2 Binary Analog Elements in It

ComponentPacket.png
ComponentPacketAdd.png
PacketAddAnalog1.png
PacketAddAnalog2.png
  1. Type "pac" in the Filter box of the Component Toolbox then select the "Packet" component (Picture 1), and drop it in the design area
  2. Click on the "Tools" button of the Packet1 component(Picture 2)
  3. In the Elements editor, double click 2 times on the Binary Analog Element to add 2 of them (Picture 3, and 4)

In Visuino: Specify How the Temperature Will Be Displayed

SetTempText.png
SetThermometer.png
SetThermometerScale.png
  1. Select the first element in the Elements editor(Picture 1)
  2. In the Object Inspector set the value of the Name property to "Temperature" (Picture 1)
  3. In the Object Inspector, for the Instrumentation property, click on the "Down Arrow" and select the "Thermometer" from the list(Picture 2)
  4. In the Object Inspector expand the "Instrument" property, then the "Scale" sub property (Picture 3)
  5. Set the "Auto" sub property to False to disable the automatic scaling (Picture 3)
  6. Set the "Min" sub property to the minimal temperature that we will display as example -20 (Picture 3)
  7. Set the "Max" sub property to the maximal temperature that we will display as example 100 (Picture 3)

In Visuino: Specify How the Humidity Will Be Displayed

SetHumidity.png
SetHumidityScale.png
  1. Select the second element in the Elements editor (Picture 1)
  2. In the Object Inspector set the value of the Name property to "Humidity" (Picture 1)
  3. In the Object Inspector expand the "Instrument" property, then the "Scale" sub property (Picture 2)
  4. Set the "Auto" sub property to False to disable the automatic scaling (Picture 2)
  5. Set the "Max" sub property to 100 (Picture 2)

In Visuino: Specify Unique Packet Header

HeaderOpen.png
HeadMarkerValues.png

To make sure that Visuino will find the starting point of the packet, we need to have a unique header. The Packet component uses special algorithm to ensure that the header marker does not appear in the data.

  1. Select the Packet1 component (Picture 1)
  2. In the Object Inspector expand the HeadMarker property (Picture 1)
  3. In the Object Inspector click on the "..." button (Picture 1)
  4. In the Bytes editor type some numbers, as example 55 55
  5. Click on the OK button to confirm and close the editor

In Visuino: Connect the Packet Component, and Its Elements

PacketNewConnect1.png
PacketNewConnect2.png
PacketNewConnect3.png
  1. Connect the "Out" output pin of the Packet1 component to the "In" input pin of the "Serial[ 0 ]" channel of the "Arduino" component(Picture 1)
  2. Connect the "Temperature" output pin of the HumidityThermometer1 component to the "In" pin of the Elements.Temperature element of the Packet1 component (Picture 2)
  3. Connect the "Humidity" output pin of the HumidityThermometer1 component to the "In" pin of the Elements.Humidity element of the Packet1 component (Picture 3)

Generate, Compile, and Upload the Arduino Code

GenerateCtopped.png
Arduino IDE2.png
  1. In Visuino, Press F9 or click on the button shown on Picture 1 to generate the Arduino code, and open the Arduino IDE
  2. In the Arduino IDE, click on the Upload button, to compile and upload the code (Picture 2)

And Play...

SelectPacket.png
Connect.png
Communication.png
CommunicationScope.png
5683686050e1b65303000cbf.jpeg
VisuinoDiagramCrop.png
  1. In Visuino select the ComPort, and then click on the "Format:" drop down box, and select Packet1(Picture 1)
  2. Click on the "Connect" button(Picture 2)
  3. If you select the "Instruments" tab, you will see the Thermometer and the Gauge showing the Temperature and Humidity(Picture 3)
  4. If you select the "Scope" tab, you will see the the Scope plotting the Temperature and Humidity over time(Picture 4)

You can see the connected and running Humidity and Temperature sensor on Picture 5.

Congratulations! You have created a Temperature and Humidity measuring project in Arduino, with Visual Instrumentation.

On Picture 6 you can see the complete Visuino diagram.

Also attached is the Visuino project, that I created for this Instructable. You can download and open it in Visuino: https://www.visuino.com