Skip to content

Instantly share code, notes, and snippets.

@marcelpinto

marcelpinto/new_map_xkcd.html

Last active May 29, 2018 12:13
Show Gist options
  • Save marcelpinto/07978283b0d4e6b5798438501d0bf4bd to your computer and use it in GitHub Desktop.
Save marcelpinto/07978283b0d4e6b5798438501d0bf4bd to your computer and use it in GitHub Desktop.
Download ZIP
New Map xkcd
Raw
new_map_xkcd.html
<!DOCTYPE html>
<meta charset="utf-8">
<link rel="stylesheet" href="http://cmx.io/v/0.1/cmx.css">
<script src="http://cmx.io/v/0.1/cmx.js" charset="utf-8"></script>
<style>.cmx-user-scene4 .cmx-text-border .cmx-path {stroke: orange}</style>
<body>
<div style="max-width:900px; -webkit-transform:rotate(0deg)">
<scene id="scene1">
<label t="translate(0,346)">
<tspan x="0" y="0em">One lazy morning</tspan>
</label>
<drawing t="translate(96,60)" pose="100,20">
<line stroke="black">
<point x="0" y="0"></point>
<point x="50" y="0"></point>
</line>
<line stroke="black">
<point x="0" y="0"></point>
<point x="0" y="-40"></point>
</line>
</drawing>
<drawing t="translate(206,93)" pose="16,-8">
<line stroke="black">
<point x="0" y="0"></point>
<point x="0" y="30"></point>
</line>
<line stroke="black">
<point x="0" y="0"></point>
<point x="-25" y="0"></point>
</line>
</drawing>
<drawing t="translate(50,50)" pose="103,20">
<line stroke="black">
<point x="0" y="0"></point>
<point x="25" y="00"></point>
</line>
<line stroke="black">
<point x="0" y="0"></point>
<point x="0" y="35"></point>
</line>
<line stroke="black">
<point x="10" y="0"></point>
<point x="0" y="-30"></point>
</line>
<line stroke="black">
<point x="10" y="0"></point>
<point x="20" y="-30"></point>
</line>
</drawing>
<actor t="translate(71,19) rotate(-2)" pose="-11,9|-5,117|-11,99|-11,89|-11,79|-11,59|-16,34|-21,9|-6,34|-1,9|-18,79|-18,59|4,77|24,98">
<bubble t="translate(9,11)" pose="0,0|-20,10|-81,49|19,66|-21,145|-73,109">
<tspan x="0" y="-3em">I have great news...</tspan>
<tspan x="0" y="0em">We got a new deal</tspan>
<tspan x="0" y="1em">with a map provider</tspan>
<tspan x="0" y="2em">Can you change it</tspan>
<tspan x="8" y="76px">right away...</tspan>
</bubble>
</actor>
<actor t="translate(134,28)" pose="28,1|36,110|28,91|28,81|28,67|28,47|48,41|48,11|50,49|50,24|39,58|64,62|46,71|69,70">
<bubble t="translate(-2,-9)" pose="0,0|-14,24|-36,69|5,28|-2,62|-20,69">
<tspan x="0" y="0em">Yeah great...</tspan>
</bubble>
</actor>
</scene>
<scene id="scene2">
<drawing t="translate(96,60)" pose="100,20">
<line stroke="black">
<point x="0" y="0"></point>
<point x="50" y="0"></point>
</line>
<line stroke="black">
<point x="0" y="0"></point>
<point x="0" y="-40"></point>
</line>
</drawing>
<drawing t="translate(206,93)" pose="16,-8">
<line stroke="black">
<point x="0" y="0"></point>
<point x="0" y="30"></point>
</line>
<line stroke="black">
<point x="0" y="0"></point>
<point x="-25" y="0"></point>
</line>
</drawing>
<drawing t="translate(50,50)" pose="103,20">
<line stroke="black">
<point x="0" y="0"></point>
<point x="25" y="00"></point>
</line>
<line stroke="black">
<point x="0" y="0"></point>
<point x="0" y="35"></point>
</line>
<line stroke="black">
<point x="10" y="0"></point>
<point x="0" y="-30"></point>
</line>
<line stroke="black">
<point x="10" y="0"></point>
<point x="20" y="-30"></point>
</line>
</drawing>
<actor t="translate(71,19) rotate(-2)" pose="-11,9|-5,117|-11,99|-11,89|-11,79|-11,59|-24,37|-22,12|-6,33|5,13|-18,79|-32,66|4,77|24,98">
<bubble t="translate(9,11)" pose="0,0|-20,10|-81,49|18,29|-22,108|-60,76">
<tspan x="1em" y="-3em">Great!</tspan>
<tspan x="0" y="0em">So tomorrow?</tspan>
</bubble>
</actor>
<actor t="translate(134,28)" pose="28,1|59,100|35,90|27,81|28,67|28,47|48,41|48,11|50,49|50,24|46,57|71,61|52,64|75,63">
<bubble t="translate(-2,-9)" pose="0,0|-14,24|-36,69|12,36|5,70|-11,80">
<tspan x="0" y="0em">Sure...</tspan>
</bubble>
</actor>
</scene>
<scene id="scene3">
<label t="translate(0,225)" pose="0,-10|3,120">
<tspan x="0" y="0em">A few months later</tspan>
</label>
<drawing t="translate(96,60)" pose="100,20">
<line stroke="black">
<point x="0" y="0"></point>
<point x="50" y="0"></point>
</line>
<line stroke="black">
<point x="0" y="0"></point>
<point x="0" y="-40"></point>
</line>
</drawing>
<drawing t="translate(206,93)" pose="16,-8">
<line stroke="black">
<point x="0" y="0"></point>
<point x="0" y="30"></point>
</line>
<line stroke="black">
<point x="0" y="0"></point>
<point x="-25" y="0"></point>
</line>
</drawing>
<drawing t="translate(50,50)" pose="103,20">
<line stroke="black">
<point x="0" y="0"></point>
<point x="25" y="00"></point>
</line>
<line stroke="black">
<point x="0" y="0"></point>
<point x="0" y="35"></point>
</line>
<line stroke="black">
<point x="10" y="0"></point>
<point x="0" y="-30"></point>
</line>
<line stroke="black">
<point x="10" y="0"></point>
<point x="20" y="-30"></point>
</line>
</drawing>
<actor t="translate(134,28)" pose="28,1|78,92|40,92|25,83|28,67|28,47|48,41|48,11|50,49|50,24|39,55|64,59|47,62|70,61">
<bubble t="translate(-2,-9) rotate(8)" pose="0,0|-6,32|45,118|-29,153|-36,187|-67,122">
<tspan x="0" y="-5em">LatLng...</tspan>
<tspan x="0" y="-3em">GeoCoordinate</tspan>
<tspan x="0" y="-1em">LatLngBox...</tspan>
</bubble>
<bubble t="translate(-60,0) rotate(7)" pose="0,0|0,-2|-69,-33|-90,40|-83,87|-93,45">
<tspan x="-2em" y="-4em">MapObject...</tspan>
<tspan x="-1em" y="-1em">MapView</tspan>
<tspan x="-3em" y="1em">Camera Update Factory...</tspan>
</bubble>
</actor>
</scene>
</div></body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment