A dashboard is a webpage that you can edit. Blocks are widgets that you can add to your dashboard.
To add a new block to your Dashboard, click the gear on the top right of the dashboard page. From the dropdown, click Create New Block.
You will then be presented with a list of block types to choose from. Clicking one of these blocks will bring up the block editor.
Once you have selected a new block type by clicking on the icon, you will be presented with a list of feeds. This will allow you to select a feed to attach to your new block. Some blocks, such as the stream and line graph blocks, allow you to attach multiple feeds.
Click on the checkbox next to the feed you'd like to connect to your block to select it and click the Next Step button to continue.
Next, you can customize the settings for the block type you selected. Each block will have common settings like block title, as well as custom options that vary per block like "slider minimum and maximum value".
Once you have finished customizing your block, click Create Block.
Repeat the process to add more blocks to your dashboard! Next, let's take a look at each of the available blocks!
Gauge Block
The gauge block allows you to quickly view the current value of a numeric feed. You can set a minimum and maximum value for the gauge, and it will automatically scale the value to a percentage and display it graphically. The gauge will update automatically whenever a new value is pushed to the feed.
Slider Block
The slider block allows you to quickly change the numeric value of a feed. You can set the minimum and maximum values for the slider, as well as change the amount the slider will increment when you drag the handle.
Momentary Button Block
The momentary button allows you to easily write a value to a feed. This can be useful if you wish to control devices attached to Adafruit IO. For example, if you wanted to feed your pet from your smartphone, you could use a momentary button to write a value to a feed monitored by the feeding device.
Toggle Button Block
A toggle button is useful if you have an ON or OFF type of state. You can configure what values are sent on press and release. Unlike the momentary button, the values will stay the same until you click the button again to toggle to the second value.
Color Picker Block
The color picker allows you to quickly select (or view) an RGB hex value for a color using a standard color picker interface. The new hex value will be pushed to the feed whenever you change the color.
Line Chart Block
The line graph block allows you to visualize numeric data over time. The line chart is used to graph one or more feeds. You can set the time range in hours that the chart will load, and set the labels for each axis of the chart. The chart will update dynamically whenever new values are pushed to the feed.
Text Box Block
A text block can be used to send data as well as view data. To publish, click on the text block, enter any text, and press enter to send.
Image Block
An image block can be used to view base64 encoded images. Drag and drop images onto the block to publish them back to the feed.
Stream Block
A stream block can be used to view the rolling history of data for multiple feeds. Up to 5 of your feeds can send data to this block.
Icon Block
The icon block displays the feed state using custom icons (click here to view them!). Send the icon name to the selected feed to display an icon inside the block.
If you are not changing the icon, select Static Icon to display a static icon on your dashboard.
Indicator Block
Want to display the status of your project on a dashboard? The indicator block is a simple on/off indicator lamp that looks like an LED.
Feed values are compared using the given conditions. If the conditions are true, then "On Color" is used, if false, "Off Color". All values are assumed to be numeric for comparison. If the current feed value can't be converted to a number, it will be treated as a string.
Number Pad Block
A telephone-style number pad for your dashboard. Based on the Membrane 3x4 Matrix Keypad sold by Adafruit, it produces numbers or symbols when clicked.
Remote Control Block
A Mini Remote Control for your dashboard! Based on the Mini Remote Control sold by Adafruit, it mimics the output of the Adafruit NEC remote control library.
Map Block
A map can track the locations of your feed's location metadata.
Dividing Line Block
This block is a horizontal or vertical dividing line element used for dashboard organization.
Battery Gauge Block
A simple battery level gauge. Feed values are compared using the given conditions. If one of the conditions is true, then that condition will be used for the color to be displayed. All values are assumed to be numeric for comparison and between 0-100.0. If the current feed value can't be converted to a number, it will be treated as a string.
Page last edited March 08, 2024
Text editor powered by tinymce.
