Media Night Review

Raphael Brand, Hannes Pernpeintner and I presented our semester project yesterday on the Media Night at our university. It was very nice to met some interested people, to answer their questions and to show what we did during the last four months. Thanks.

Here are some impressions of last night. Our project is still online on http://techtrends.mi.hdm-stuttgart.de/. We will run it as long as we can.

Best regards,
Thomas Uhrig

TechTrends at the Media Night 2013 of the Media University Stuttgart

During this summer semester, two friends of mine and I made a student project called TechTrends. TechTrends is a web application that lets you search for articles and trends in the field of computer science. We crawl posts from Reddit and Hackernews and provide an intelligent search on them. You can type in a key-word (e.g. bitcoin) and get a timeline showing you when articles for this topic have been published.

techtrends_medianight

We will present our project at the Media Night at our university next week. It’s open for everybody and for free. It will start around 6 pm, but you can come whenever you want to. There is no schedule. Every project has its own booth, where it is presented and where you can ask question and get in touch with the people behind it.

You can find the program and information about all projects on http://www.hdm-stuttgart.de/medianight.

What? – Media Night 2013
When? – 27th June 2013, from 6 pm to 10 pm
Where? – Hochschule der Medien, Nobelstraße 10 , 70569 Stuttgart

Our project is online on http://techtrends.mi.hdm-stuttgart.de/.

Best regards,
Thomas Uhrig

Visualizing KML files in Google Maps

The question is easy: How can I visualize the track of a KML file on Google Maps via JavaScript?

Last evening, I spend about four hours looking for a solution for this (pretty trivial) question. In the end, the code was simple and very short, but it was hard to find some good and clear resources about the topic. The documentation from Google about their maps API is very well – but in my opinion it lacks of some simple examples to start with. Therefore, here is a super simple example to copy and past and start right ahead.

Example

Run it

You can just copy and paste the example. You only have to do two things:

  1. Get a KML file, call it test.kml and put it beside your HTML file in a folder.
  2. Start a web-server in that folder (see below).

In order to run the example, you have to start a web-server. Otherwise you can’t load the KML file, since it is not available trough the browser (due to cross origin requests and all that stuff). A very easy way to do that is with python. Just open a command line the folder where your HTML document is and start a server like this:

Then go on http://localhost:8080/ and see your map.

Explanation

The script is only doing a few simple things. First of all, it initializes a map object using the Google Maps API. This object represents the actual map drawn in the div with the id canvas. Then the script creates a parser object of the geoxml3 library. This library offers a very comfortable way to display KML files on Google Maps. However, the support for polylines (tracks on the map) is pretty new. So you have to use the poly branch of library. Otherwise you won’t see any lines, just your starting point. The library can also parse KML as a pure string. Check their wiki for more information.

Finally



Best regards,
Thomas Uhrig

Image optimization for websites

Optimizing the images of a web page is easy and the best way to speedup the site. On the basis of the famous book “Even Faster Web Sites” by Steve Souders, Annette Landmesser and I made a small presentation for an university course called Development of Rich Media Systems thought by Jakob Schröter. The presentation contains some general patterns and practices for lossy and non-lossy optimization. Enjoy.



I will also write a paper about image optimization for websites for my university course in a couple of weeks. The paper will be in German.

Best regards,
Thomas Uhrig