Microsoft IoT Camp for developers

January 24th, 2018

Amazing day of learning Azure IoT with Lwin Maung, Eric Franz and Jeff Rand at Microsoft, Edina.  There was an incredible volume of knowledge shared today.  efranz

GitHub Microsoft Intel IoT Camp 

GitHub Microsoft Intel IoT Camp latest 

Containing source code, slides, queries, installations and more.



Setup for the NUC


Lab instruction, tutorial


Logging on to NUC over WI-FI and running Node-RED.

Screen Shot 2018-01-24 at 7.26.27 PM

Using Node-Red to build, configure and deploy temperature sensing on Ardunio with Azure IoT Hub.

Screen Shot 2018-01-24 at 7.08.07 PM

Confirm data being send to Azure.

Screen Shot 2018-01-24 at 7.09.29 PM

Reading the temperature data with npm iothub-explorer.

Screen Shot 2018-01-24 at 7.08.29 PM

Connect database, execute SQL script from Visual Studio Code IDE.

Screen Shot 2018-01-24 at 7.39.41 PM

Select for other starter kits.


STM32L4 Discovery Kit IoT Node Azure seminar

January 19th, 2018

What an incredible ST Microelectronics seminar last month, we had a full day of lessons, labs and a STM32L4 Discovery kit to keep for personal development.  Wayne, Wade and Colleagues trained us with 5 labs with topics on sensors, NFC, Azure IoT, mobile and more.  STM32 Discovery kit is packed with features !   

Here are some prerequisite installations and literature to start.


Getting Started with the STM32L4 Azure Seminar


Wade Chin and colleague showing us all the amazing features of the discovery board.


Wayne Salata shared some history and inspiring vision.  Now I know ST stands for SGS-Thomson !


This is a massive board of features compared to Arduino robotic kits and those used in class.  As if it is not exciting enough, I am performing the lab exercise on a Windows VM with a MacBook Pro.  Everything works great until lab 4.  A reboot of my virtual machine was necessary to fix my USB connectivity.

Keil MDK-ARM v5.24a, uvision software (IDE) was an impressive professional tool for developing and managing the binaries.


Thanks to Wade for all the prepared labs and Azure accounts.  We found instant gratifications with the results below.  We were able to obtain near real-time temperature & humidity data, accelerometer information.

Screen Shot 2017-11-30 at 2.00.54 PM

Wade trained us to configure Azure IoT edge to ingest, process and display data across multiple devices and accounts.








Exercise: ReactJS + ES6 + SVG + cubic spline interpolation

November 25th, 2017

This is an upgrade of a previous cubic spline code-kata.  It is now written in ES6 class that is wrapped in ReactJS components to render SVG elements.  The previous version renders as pixels on a canvas. The original source is from Numeric Recipes in C.

For this demo, click anywhere on the SVG to append knot points to the curve.
Screen Shot 2017-11-26 at 5.16.37 PM

This project source is available on Github build with Visual Studio Code and npm.

Viewing auto-stereo images on VR headset

July 29th, 2017

Recently upgraded my google cardboard experience with a Utopia360 Virtual Reality 3D headset for $20 bucks from Microcenter.  Really impressed with WebVR, Android cardboard and daydream sdks.  While there is  lots of content in vextex rendering as well as 360 degree images, I am starting from the tradition auto-stereo images.  Thanks to professor Davidhazy from RIT for giving some that were originally photographed on sliver halide film.

In this exercise, I am loading two sets of images, Andy’s portrait and balloon explosion — highspeed.  The code is implemented in javascript, available on Github, StereoView project.  device orientation triggers next image set upload.  This code is tested on a Samsung Note II with Chrome browser.  Try it out here.

Spatial convolution and bokeh

January 17th, 2017

On my path to gaining proficiency in ecmascript6, I am exercising with a windows bitmap decoder, spatial convolution and bokeh effect filter.


Windows Bitmap decoder

This decoder is capable only of loading 24bpp uncompressed RGB image from your local drive at current.  The source code is based on a comprehensive version written in actionscript back in August 1, 2009.  The Windows 3.x Bitmap format (BMP) is defined by four sections below.  Please consider reference text below for detail.

  1. BITMAP File-Header
  2. Bitmap Info (Bitmap Info-header)
  3. Bitmap palette (if exists)
  4. BITMAP-Picture data

Spatial Convolution

Filters, blur, laplacian and sharpen have been implemented for testing.  For blur, a RECT function of 5×5 kernel is set for default and configurable.  For laplacian, it is an isotropic derivative filter for detecting high frequencies.  It has a 3×3 kernel [-1, -1, -1, -1, 8, -1, -1, -1, -1]. For sharpening, the high frequency result from a laplacian filter is added to an identity.  Please consider reference text below for detail and mathematics.


kernel graph

At the center of the image, an identity kernel is applied.  As the convolution is applied on pixels away from center, a larger RECT function is utilized.  Illustrated in the above kernel graph on the right, black spot marks the identity kernel and lighter intensity mark larger kernels.  Source code is available on Github.

Future work

Currently working on code quality which includes ES6 modules to divide decoder from filter.  Also, large format camera, scheimpflug principle, is being implemented to simulate a plane shift image effect.


  1. Digital Image Processing by Rafael C. Gonzalez, Richard E. Woods, Addison Wesley Publishing, 1992.  ISBN 0-201-50803-6
  2. The file formats handbook by Gunter Born, International Thomson computer press, 1995.  ISBN 1-850-32128-0

MachWaves – iOS

January 3rd, 2017

This is a retro of MachWave mobile application written on June 26th, 2014.  The Objective-C, source code for iOS is now on Github.  However, the application is no longer available on iTune for download.  This camera application has a custom view that supports 2 lines being drawn via touch-points (below).screen-shot-2017-01-03-at-10-30-30-am

When there are four touch points, two lines are drawn.  Tt calculates the mach number base on the touch point coordinates and intersecting angle. The values are posted at the top of the photo (below).


Link for detail and references.


Learning Hadoop basics

January 2nd, 2017

Greatly appreciate a lesson on Apache Hadoop this fall semester.  Over the winter break, I am posting one assigned problem to help cement my understanding.  This is a personal reference for moving forward to learn Apache Spark and Hadoop image processing interface (HIPI).

This hadoop exercise involves installing on Windows 10, adding JSON library, and performing a page rank.

Windows10 installation

At the time of implementation, I was not aware of Cloudera quickstart VM and Hortonworks’ sandboxes.  So, I embarked on Windows so it can be shared among team members of my class.

I am following ‘s article to install Hadoop 2.7.1 and Java 1.7 on Windows10 without cygwin.  Also, a self reminder to set Java path.  The final step of the article is to start the hadoop file system.




Adding JSON library

To process JSON input, I need to include an external java library.  From this article on StackOverflowDoug Crockford references a Java JSON library authored by Sean Leary.  With my working directory at c:\Hwork, I place the java files in sub-directory c:\Hwork\org\json\.


Compiling the JSON library: javac org/json/*.javacompile-json

Build JSON jar file: jar -cvf json.jar org/json/*.class


Page Rank

As a beginner, I am using the famous wordcount example in Hadoop documentation as a starting point.  My task is to sort and rank below text file (one example) with multiple lines of JSON.  

{“page”:”http://marys_flowers/main.html”, “list”:[{“rose”:”http://bobs-flowers/page1″},{“rose”:”http://bettys-flowers/rose_page.html”},{“lily”:”http://flowers-r-us/lily”},{“rose”:”http://bobs-flowers/page1″}]}

From the wordcount example, I renamed it pagerank and include the JSON library and change methods’ signatures to handle Text for keys and values (download download PageRank.jar).




The input and output for Map() and Reduce() methods are key and Iteratable values of type Text and IntWriteable by default.  In above screenshots, I edit this to Text for both key and values.  They must be consistent across both methods.  I have to set the job output type in main (below).


The map() code is straight forward.  I parse the JSONObject value list into JSONArray and then write each key and value for reduce() to rank.


The reduce() code is also straight forward.  I aggregate the values for the same key.  Ranking is a numeric count of values per key (below).


The output result is as follow.  The second column of integers is the number of values associated with that row key.

1 1 lily http://flowers-r-us/lily
1 1 mums http://flowerpage/page2.html
1 4 rose http://bobs-flowers/page1,http://bobs-flowers/page1,http://bettys-flowers/rose_page.html,http://bobs-flowers/page1

Build + Execution

Compile:   C:\Hwork>javac -classpath c:\dev\hadoop-2.7.1\share\hadoop\common\hadoop-common-2.7.1.jar;c:\dev\hadoop-2.7.1\share\hadoop\mapreduce\hadoop-mapreduce-client-core-2.7.1.jar;c:\dev\hadoop-2.7.1\share\hadoop\common\lib\gson-2.2.4.jar;c:\dev\hadoop-2.7.1\share\hadoop\common\lib\commons-cli-1.2.jar
Build JAR:   C:\Hwork>jar -cvf PageRank.jar *.class


CREATE input directory on HDFS and copy input file there for execution.

C:\Dev\hadoop-2.7.1\sbin>hadoop fs -mkdir /in

C:\Dev\hadoop-2.7.1\sbin>hadoop fs -copyFromLocal c:\Hwork\input\input.txt /in


Make JSON library JAR file available by copying it into a directory that is one of hadoop class path.

C:\Dev\hadoop-2.7.1\sbin>hadoop classpath


copy JSON library JAR file into common directory;  PageRank code will be able to access the JSON library when executed.

Execute PageRank:

C:\Dev\hadoop-2.7.1\sbin>hadoop jar c:\Hwork\PageRank.jar PageRank /in /out


Retrieve output file from HDFS:

C:\Dev\hadoop-2.7.1\sbin>hadoop fs -copyToLocal /out/* c:\Hwork\output


Reference: Hadoop, “The Definitive Guide”-4th Edition by Tom White, O’Reilly



MSSE spring semester count down

December 29th, 2016


Thanks to my MSSE colleague for providing the requirements.  Over the holidays, I am working on a spring semester countdown website.  Looks like Typescript ?  Feels like a little less.  ECMAScript 6 class leaves me a bit confused about the missing private variables that work so nicely with getter and setter.  OK, thanks for reminding me that javascript is different from OOP development in C++.  After the initial learning curve on prior ECMAScript, prototype seems to make sense with ‘this’ or ‘that’ for scope referencing.  The new ECMAScript 6 class seems to have lost some of that capability.

Thanks to Mike Bostock’s excellent D3.js calendar view.  I am using it to illustrate our final count down of spring semester.  Click anywhere on the calendar view to select the date for calculation.  The results are in percentage, minutes, hours and days.  Note, the selected date currently does NOT resolve the current hour and minutes.  The source code of the website is available on Github.

…. but who’s counting ?



June 23rd, 2016

I am implementing the ascii decoder for an earlier exercise, STL binary decoder, 26Sept2012.  The STL ascii file specification I am using is available on wiki.  A few C# 6.0 feature enhancements have been added (null propagation, string interpolation, expression-bodied members).  Files tested are available in the assets directory under the project solution.  Next step would be to add color decoding, logging and test it more thoroughly with defective STL files.  Decoder needs to be more flexible, currently normal needs to be in the first line.

Screen Shot 2016-06-23 at 11.21.25 AM

Google Cardboard

May 8th, 2016

Few years late on this technology but I was still giddy assembling the Google Cardboard.  To my surprise, the price of this cardboard viewer varied from $5.00 – $20.00.  Then there were many other fancier headsets in the price of hundreds.


I bought the generic brand of cardboard viewer.  It arrived with two magnets, lens and perforated lines, minus the 2D barcode.  There was very little assembly required.


No instruction was necessary although I found a rubber band helpful to keep everything together.  I suppose a few stables would work as well but just in case I need to take it apart for storage.20160508_130639

Next came the Cardboard demo software on Google Play.  iPhone version was available as well.


Before attempting any exciting development project(s), my daughter and I have already found hours of entertainment with the various demos provided.  My favorite was the northern lights under the lighthouse.  It reminded me of SplitRock lighthouse, near Duluth.


Anyone has recommendation on purchasing a ‘real’ viewer ?  For development, is it better with iOS vs Android ?  Saw amazing 3D painting tools with Vocativ on facebook, so cool !!

Reading Google Cardboard and SDK documentation.