Last night I ended up on a blog post via Facebook that was talking about people in states signing petitions for the right to secede from the United States. Let me preface this with I could care less either way I’m merely fascinated with numbers. The thing that caught my eye was how people were attempting to keep track of how many people had signed the petitions. Posting multiple “Update” blocks at the end of their blog post (I found it on multiple sites). I thought this was a little antiquated and there should be a nice intuitive interface to get the data.
After a little bit of playing in python and jQuery I had a small page up that is updated periodically (every 5 mins) with the latest data.
If there are new states let me know and I will add them. As of now these are the states that I know of that have created a petition.
Once you click the group name in the bar charts on the index page. You will be presented with the entire history of that group. Here is one of the groups in my database.
From here you can “zoom” into a section of time by dragging the sliders on the right and left. The data is then queried from the database and a new slidePicker is generated below this one with a more precise view the selected data.
I was thinking of ways to visualize data in my WLC_AP_Load application and the thought occurred to me that a interface similar to what you would find in Google Analytics or the Netwitness Investigator interface would be nice.
My current master class is covering HTML5 technologies. The first week was discussing canvas tags. I knew of canvas tags and used libraries that created graphs with them for a long time. However, I hadn’t really gotten dirty with canvas tags and manually drawing before. So Wednesday I decided to try my hand at creating a graphing function that would create a canvas element on the screen. After about three lines of code I thought “This should be a jQuery plugin”. I did some Google searching around got the basic jist of creating a plugin. It was a little rough at first. I’m still not sure if the way i structured my plugin is correct but it works. I hope that I will discover better ways to create jQuery plugins in the future. But hey, gotta start somewhere right?
Three days later I present you with slidePicker.
I had it finished Wednesday before work was over. However, like many of my projects I let feature creep get the best of me and added a TON of options that allow you to really customize the plugin. The screenshot above is a standard graph generated with no options. You can get real crazy with it resulting in something like this.
Here is a screenshot of the reason I developed this plugin. It is showing the number of clients connected to an access point over the timespan of about 3 weeks.
Once I get some time I will get around to creating some docs. If you use this in a dashboard or something awesome that I haven’t thought of let me know. I’d love to see it.
During a meeting one day me and a coworker were speculating on how many people were connected to a given access point. We were trying to decide which access point was being used the most in an effort to beef up the wireless coverage in buildings that were being used the most around campus. After a min or two I decided that speculation just wasn’t going to cut it.
After a bit of googe’n I was able to use some of the base SNMP classes in PacketStorm to harvest data from our Cisco Wireless LAN Controller. After I was able to begin gathering the number of clients connected to each access point (AP) I made a graph. Shortly after that I decided to group the access points together so that entire buildings could be correlated together to get a better understanding which buildings were being used.
This was pretty much all we needed. It only provides a current snapshot view of the number of clients connected to wireless network.I plan on adding the ability to view data over a time period with later releases.
The graphs were cool but I wanted some extra flare. So I decided to see if I could take it a bit further. I ended up adding the ability to place the groups of APs on a map using latitude and longitude. It was pretty cool to see which buildings were being used the most just by glancing at a map. One side effect that was not originally planned is that you can actually watch the student population migrate around campus. For example, when it gets close to lunch time you see the connections in the dorm rooms get smaller and the connections in the dining commons grow.
Here is a screen shot taken during the day. The students are pretty much evenly spread throughout campus.
At night though they have mostly moved to the dorm rooms that can been seen in this screen shot.
All in all this was a pretty cool little project. With only a day or two invested in it I’m pleased with the result. You can grab a copy of the code over at my gitHub account.
Ok so recently I’ve been motivated to post up some of the work that I’ve been doing in my spare time.
First up is a small python script that I wrote. It is ugly and one day i will go back and clean it up. It was literally my “Hello World” into python. So it is kinda cob’d together.
Basically, I wanted something that would alert me when a switch went down or there was an unusual amount of traffic between two switches. So I set out to remotely monitor bandwidth utilization in my switches. After a bit of google’n I stumbled upon SNMP. After a bit of research I figured I could make that work.
Now that I was able to pull in the bandwidth utilization. I started building the code to look at all the switches. About three switches into the config file that I was creating I thought this isn’t nearly cool enough. So, I ended up working a bit and made a SNMP spider. It uses Cisco discovery protocol to find each switch’s neighbor. End the end all you have to do is fire up the script and point it to any of your switches. It will spider through the entire network and save the switch information as it discovers it.
What good is having all this sweet information without have some ability to display it in a killer manner. In comes a library called CherryPy. With CherryPy I was able to display all the switch information. From there I wanted to show some sort of link information at a glance. Using jsPlumb i was able to draw connections between the switches and show the utilization. I also added the ability to drag and drop the switches around so you can look at the entire topology however you like.