Zeyao – LM – LM Game

For the last project, I decided to make a game that is not included the competitive function. For me, I don’t like how people have to win something in a game. Sometimes, a game can just be entertained and for fun. So, this game is a drawing game which people draw the shape of the city based on the metro line. Usually, when we talk about the metro system, we will think of it based on the city itself. Also, the metro map is seen as an extra attributes to a map. However, I realized that why can’t we put the metro line at first, then based on the metro shape, we draw the shape of the city?

I used the google map javascript api for this project. First, I initialize the map then I added a transit layer on the map, which make it more complete. I also added a overlay Tile system to help the player to draw the city. Originally I wanted to use p5 to make the drawing system. Yet I found that there was a drawing manager function on the google map api. So I used that. I made 3 buttons to change the location center by using jquery, however, it showed the error “google is not defined” and I was working on this for hours. So for now this was not working.

For the future development (hopefully I can fix it recently – in the next few days), I want to fix the button first because there is only a line of error and I knew it could work functionally. Then I have another problem that I do not really know how to fix it. The map itself (the city) is the base of the whole API, so to be honest it is basically impossible for me to separate the base from the other add-on layer, for example, the transit. I tried to search it online, and I did not see any results. My idea was to create a button, and once you clicked it, the map will show up. The default page is just the transit layer. I tried to make the map null — which is how people hide the layer or the map itself, but it wouldnt work. Because the transit is based on the initMap by settings. On the Gaode Maps (a Chinese map) API, the subway can be separated by the map itself, but the metro map is more like an image with a white background. It makes everything underneath and you can barely create anything based on the metro map. Also I did not see that they include the drawing system in the API. So hopefully I can find a way to figure it out.

Here is the code:

Leave a Reply