misc updates; add geo demo

2011-12-31 18:27:02 +05:30 · 2011-12-31 18:27:02 +05:30 · 34753cb2ed
commit 34753cb2ed
parent 09a3537dc1
9 changed files with 219 additions and 81 deletions
--- a/demos/geo2/index.html
+++ b/demos/geo2/index.html
@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <title>OxJS Geo Demo</title
+        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
+        <script type="text/javascript" src="../../build/Ox.js"></script>
+        <script type="text/javascript" src="js/geo.js"></script>
+    </head>
+    <body>
+    </body>
+</html>
--- a/demos/geo2/js/geo.js
+++ b/demos/geo2/js/geo.js
@ -0,0 +1,51 @@
+Ox.documentReady(function() {
+    var image = new Image();
+    image.onload = function() {
+        var c = Ox.canvas(image),
+            point = {lat: 40.725342, lng: -73.996824}, // Broadway & Houston, NY
+            circles = Ox.range(1, 16).map(function(i) {
+                return Ox.getCircle(
+                    point,
+                    i * Ox.EARTH_CIRCUMFERENCE / 2 / 16,
+                    8
+                );
+            }),
+            lines = Ox.range(16).map(function(i) {
+                return Ox.getLine(
+                    point,
+                    Ox.getPoint(point, Ox.EARTH_CIRCUMFERENCE / 2 - 1000, i * 360 / 16),
+                    8
+                );
+            });
+        function drawLine(pointA, pointB) {
+            var xyA, xyB;
+            if (Math.abs(pointA.lng - pointB.lng) < 180) {
+                xyA = getXY(pointA);
+                xyB = getXY(pointB);
+                c.context.moveTo(xyA.x, xyA.y);
+                c.context.lineTo(xyB.x, xyB.y);
+                c.context.stroke();
+            }
+        }
+        function drawPath(points, close) {
+            points.forEach(function(point, i) {
+                i && drawLine(points[i - 1], point);
+            });
+            close && drawLine(points[points.length - 1], points[0])
+        }
+        function getXY(point) {
+            return Ox.map(Ox.getXYByLatLng(point), function(v) {
+                return v * 1024;
+            });
+        }
+        document.body.appendChild(c.canvas);
+        c.context.strokeStyle = 'rgb(255, 0, 0)';
+        circles.forEach(function(points) {
+            drawPath(points, true);
+        });
+        lines.forEach(function(points) {
+            drawPath(points);         
+        });
+    }
+    image.src = 'png/earth1024.png';
+});
--- a/demos/geo2/png/earth1024.png
+++ b/demos/geo2/png/earth1024.png