ElDeveloper · June 11, 2014 03:35
diff --git a/show-me-the-way-home.ipynb b/show-me-the-way-home.ipynb
 {
 "metadata": {
  "name": "",
  "signature": "sha256:97376baf4646706e35562cda3e6232d1284ddea21aafb5406403868d6d8afe2b"
 },
 "nbformat": 3,
 "nbformat_minor": 0,
 "worksheets": [
  {
   "cells": [
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "# the values this code expects are:\n",
      "# data should be something from where two floats can be extracted\n",
      "# in this case I had a list of lists where the first two elements were the latitude\n",
      "# and the longitude correspondingly"
     ],
     "language": "python",
     "metadata": {},
     "outputs": []
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "# let's create an array of javascript data to populate a predefined HTML+JavaScript template\n",
      "strings = []\n",
      "for index, line in enumerate(data):\n",
      "    try:\n",
      "        strings.append(\"  arrayOfCoordinates['%d'] = {'latitude':%f, 'longitude':%f};\" % (index, line[0], line[1]))\n",
      "    except:\n",
      "        pass\n",
      "coords = '\\n'.join(strings)"
     ],
     "language": "python",
     "metadata": {},
     "outputs": []
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "MAPS_HTML_AND_JS = \"\"\"<!--\n",
      "Example taken from:\n",
      "https://developers.google.com/maps/documentation/javascript/examples/marker-simple?hl=tr\n",
      "\n",
      "Modified by Yoshiki V\u00e1zquez Baeza\n",
      "[email protected]\n",
      "-->\n",
      "<!DOCTYPE html>\n",
      "<html>\n",
      "  <head>\n",
      "    <meta name=\"viewport\" content=\"initial-scale=1.0, user-scalable=no\">\n",
      "    <meta charset=\"utf-8\">\n",
      "    <title>Distribution of Tweeets around Boulder</title>\n",
      "    <style>\n",
      "      html, body, #map-canvas {\n",
      "        height: 100%%;\n",
      "        margin: 0px;\n",
      "        padding: 0px\n",
      "      }\n",
      "    </style>\n",
      "    <script src=\"https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false\"></script>\n",
      "    <script>\n",
      "function initialize() {\n",
      "  var myLatlng = new google.maps.LatLng(-25.363882,131.044922);\n",
      "  var myLatlng2 = new google.maps.LatLng(-25.37,131.05);\n",
      "\n",
      "  var arrayOfCoordinates = new Array();\n",
      "%s\n",
      "\n",
      "  var boulderCenter = new google.maps.LatLng(40.014986,-105.270546);\n",
      "\n",
      "  var mapOptions = {\n",
      "    zoom: 15,\n",
      "    center: boulderCenter\n",
      "  };\n",
      "  var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);\n",
      "\n",
      "  // show me the way back home\n",
      "  console.log('ready to load data');\n",
      "  console.log('the contents of the array of coordinates is %%s', arrayOfCoordinates);\n",
      "  for (var index in arrayOfCoordinates){\n",
      "      var marker = new google.maps.Marker({\n",
      "          position: new google.maps.LatLng(arrayOfCoordinates[index]['latitude'], arrayOfCoordinates[index]['longitude']),\n",
      "          map: map,\n",
      "          title: 'string'\n",
      "      });\n",
      "  }\n",
      "}\n",
      "\n",
      "google.maps.event.addDomListener(window, 'load', initialize);\n",
      "\n",
      "    </script>\n",
      "  </head>\n",
      "  <body>\n",
      "    <div id=\"map-canvas\"></div>\n",
      "  </body>\n",
      "</html>\n",
      "\n",
      "\"\"\""
     ],
     "language": "python",
     "metadata": {},
     "outputs": []
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "from IPython.display import IFrame\n",
      "\n",
      "fd = open('map_vis.html', 'w')\n",
      "fd.writelines(MAPS_HTML_AND_JS % (coords))\n",
      "fd.close()\n",
      "\n",
      "IFrame('files/map_vis.html', 1200, 800)"
     ],
     "language": "python",
     "metadata": {},
     "outputs": []
    }
   ],
   "metadata": {}
  }
 ]
 }
	{
	"metadata": {
	"name": "",
	"signature": "sha256:97376baf4646706e35562cda3e6232d1284ddea21aafb5406403868d6d8afe2b"
	},
	"nbformat": 3,
	"nbformat_minor": 0,
	"worksheets": [
	{
	"cells": [
	{
	"cell_type": "code",
	"collapsed": false,
	"input": [
	"# the values this code expects are:\n",
	"# data should be something from where two floats can be extracted\n",
	"# in this case I had a list of lists where the first two elements were the latitude\n",
	"# and the longitude correspondingly"
	],
	"language": "python",
	"metadata": {},
	"outputs": []
	},
	{
	"cell_type": "code",
	"collapsed": false,
	"input": [
	"# let's create an array of javascript data to populate a predefined HTML+JavaScript template\n",
	"strings = []\n",
	"for index, line in enumerate(data):\n",
	" try:\n",
	" strings.append(\" arrayOfCoordinates['%d'] = {'latitude':%f, 'longitude':%f};\" % (index, line[0], line[1]))\n",
	" except:\n",
	" pass\n",
	"coords = '\\n'.join(strings)"
	],
	"language": "python",
	"metadata": {},
	"outputs": []
	},
	{
	"cell_type": "code",
	"collapsed": false,
	"input": [
	"MAPS_HTML_AND_JS = \"\"\"<!--\n",
	"Example taken from:\n",
	"https://developers.google.com/maps/documentation/javascript/examples/marker-simple?hl=tr\n",
	"\n",
	"Modified by Yoshiki V\u00e1zquez Baeza\n",
	"[email protected]\n",
	"-->\n",
	"<!DOCTYPE html>\n",
	"<html>\n",
	" <head>\n",
	" <meta name=\"viewport\" content=\"initial-scale=1.0, user-scalable=no\">\n",
	" <meta charset=\"utf-8\">\n",
	" <title>Distribution of Tweeets around Boulder</title>\n",
	" <style>\n",
	" html, body, #map-canvas {\n",
	" height: 100%%;\n",
	" margin: 0px;\n",
	" padding: 0px\n",
	" }\n",
	" </style>\n",
	" <script src=\"https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false\"></script>\n",
	" <script>\n",
	"function initialize() {\n",
	" var myLatlng = new google.maps.LatLng(-25.363882,131.044922);\n",
	" var myLatlng2 = new google.maps.LatLng(-25.37,131.05);\n",
	"\n",
	" var arrayOfCoordinates = new Array();\n",
	"%s\n",
	"\n",
	" var boulderCenter = new google.maps.LatLng(40.014986,-105.270546);\n",
	"\n",
	" var mapOptions = {\n",
	" zoom: 15,\n",
	" center: boulderCenter\n",
	" };\n",
	" var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);\n",
	"\n",
	" // show me the way back home\n",
	" console.log('ready to load data');\n",
	" console.log('the contents of the array of coordinates is %%s', arrayOfCoordinates);\n",
	" for (var index in arrayOfCoordinates){\n",
	" var marker = new google.maps.Marker({\n",
	" position: new google.maps.LatLng(arrayOfCoordinates[index]['latitude'], arrayOfCoordinates[index]['longitude']),\n",
	" map: map,\n",
	" title: 'string'\n",
	" });\n",
	" }\n",
	"}\n",
	"\n",
	"google.maps.event.addDomListener(window, 'load', initialize);\n",
	"\n",
	" </script>\n",
	" </head>\n",
	" <body>\n",
	" <div id=\"map-canvas\"></div>\n",
	" </body>\n",
	"</html>\n",
	"\n",
	"\"\"\""
	],
	"language": "python",
	"metadata": {},
	"outputs": []
	},
	{
	"cell_type": "code",
	"collapsed": false,
	"input": [
	"from IPython.display import IFrame\n",
	"\n",
	"fd = open('map_vis.html', 'w')\n",
	"fd.writelines(MAPS_HTML_AND_JS % (coords))\n",
	"fd.close()\n",
	"\n",
	"IFrame('files/map_vis.html', 1200, 800)"
	],
	"language": "python",
	"metadata": {},
	"outputs": []
	}
	],
	"metadata": {}
	}
	]
	}