Locative Media Project 1: Map of Street Artists

Project inspiration:

One of the first thing I noticed since arriving in Europe is that there’re so many talented street artists with different professions. They sing, play instruments, draw, make bubbles, and pretend to be status… I found out that they always have a favourite spot to do art. You can always found them their. Even people playing music on the metro (probably) have a fav line to go on. What’s more, during my traveling in Europe, I found that street artists in different countries have a certain “style”. Paris is more classic, Prague is more absurd (like kafka’s work), and Copenhagen feels more “minimalistic”. It would be fun to map the out – a map of street artists that you can’t possibly found them on google. It’s also a way to exhibit these arts online, showing their talents to more people.



So we start mark locations on the map with geojson. You click on the map and codes with the mark info will be generated. I give my every marks with a few properties: “where ” “type” and “id”.

Collecting datas

One thing that is particularly important for me is to let my image/video source match with the array since it’s easy to mess up. I learned that it’s important to name your assets. My assets folder looks like this:

(although my first level is not quite well-organized..)

So I have 13 datas collected by myself and my friends from several countries: France, Danmark, Czech Republic, Portugal, and Austria.


I choose to use mapbox as my map basis because it looks more aesthetic. https://www.mapbox.com/

They also have very thorough documentations if you don’t know how to code something.


Feedback from class is very useful. It mainly gathered in the “Reset” button in my map. The function of it is letting user easily zoom out from a country and getting to see the map of europe more easily. It is hard to do so manually with clicking “-” button. critics about the button are: 1) probably change the name. “reset” makes people don’t know what it does. 2) move it somewhere else than the middle top, because now it looks like an ugly title.


Using localhost for this project is really legging, and I think it’s because there’re too many videos. So I just dragg it into firebox.

my code:

index.html: https://gist.github.com/christmasbeacon/f2256874461f0c1d264f6bf3a1afe296

custome.css: https://gist.github.com/christmasbeacon/5221dbeb83109bc271bc162ad8321bd3

geojson.js: https://gist.github.com/christmasbeacon/a54f78417762bc44ef350794b4d3fb13

plugin.js: https://gist.github.com/christmasbeacon/40cafa32e50f9cec7a146fdb80f22e55

Leave a Reply