{"id":4352,"date":"2020-09-02T02:02:49","date_gmt":"2020-09-02T06:02:49","guid":{"rendered":"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/?p=4352"},"modified":"2020-09-02T02:07:24","modified_gmt":"2020-09-02T06:07:24","slug":"pinkkk-map","status":"publish","type":"post","link":"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/xinrantandrew-cmu-edu\/09\/02\/pinkkk-map\/","title":{"rendered":"Pinkkk-Map"},"content":{"rendered":"

Generating in Action<\/em><\/p>\n

<\/p>\n

Selected ScreenShots<\/em><\/p>\n

\"\" \"\" \"\" \"\"<\/p>\n

Brief Paragraph About the Territory<\/strong><\/em><\/p>\n

My imaginary place is how I currently perceive myself. It is dominated by contrasting colors, ambiguous shapes, and undefined labels. Around the blended vibrant colors, there exist rigid lines holding back the circles that are on the edge of merging with the unknown.<\/p><\/blockquote>\n

Technical Process<\/strong><\/em><\/p>\n

From the beginning, I wanted to experiment with cartography, especially with the placement of labels. Therefore I focused the majority of my time on generating arbitrary terrains and orienting letters around it.<\/p>\n

For my terrain generation, I utilized the Marching Squares <\/a>algorithm to generate arbitrary sections with weighted vectors.<\/p>\n

<\/p>\n

Problem 1: Orienting Text on a line\u00a0<\/em><\/p>\n

To orient the text, I took the dot product of the vectors and centered the text on the first vertex.<\/p>\n

<\/p>\n

Problem 2: Collisions<\/em><\/p>\n

The labels like the collide, and even when they are single-letters (used longer letters to demonstrate the problem). I approached the problem from two perspectives: controlling the number of labels on the map and detecting dark pixels on the screen. Both of the methods have their challenges such as hardcoding values and layering of visual elements. To be fair, I am not confident that they completely do not collide at all, and it would be an interesting problem to solve if I continue the project in the future.<\/p>\n

CODE<\/a><\/p>\n

<\/p>\n

 <\/p>\n

 <\/p>\n","protected":false},"excerpt":{"rendered":"

Generating in Action Selected ScreenShots Brief Paragraph About the Territory My imaginary place is how I currently perceive myself. It is dominated by contrasting colors, ambiguous shapes, and undefined labels. Around the blended vibrant colors, there exist rigid lines holding back the circles that are on the edge of merging with the unknown. Technical Process … Continue reading “Pinkkk-Map”<\/span><\/a><\/p>\n","protected":false},"author":53,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[41],"tags":[],"_links":{"self":[{"href":"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-json\/wp\/v2\/posts\/4352"}],"collection":[{"href":"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-json\/wp\/v2\/users\/53"}],"replies":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-json\/wp\/v2\/comments?post=4352"}],"version-history":[{"count":4,"href":"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-json\/wp\/v2\/posts\/4352\/revisions"}],"predecessor-version":[{"id":4383,"href":"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-json\/wp\/v2\/posts\/4352\/revisions\/4383"}],"wp:attachment":[{"href":"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-json\/wp\/v2\/media?parent=4352"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-json\/wp\/v2\/categories?post=4352"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/60-212\/f2020\/wp-json\/wp\/v2\/tags?post=4352"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}