Open_CV_to_Leaflet.ipynb

{
 "cells": [
  {
   "cell_type": "markdown",
   "metadata": {
    "deletable": true,
    "editable": true
   },
   "source": [
    "I am indebted to the following resources:\n",
    "    https://github.com/python-visualization/folium/blob/master/examples/ImageOverlay.ipynb and\n",
    "    https://www.researchgate.net/post/How_to_plot_a_raster_datageotiff_in_Folium_for_interactive_maps\n",
    "        \n",
    "I am always looking for slick ways to present image processing in a simply manner and these helped me with the code below\n"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {
    "deletable": true,
    "editable": true
   },
   "source": [
    "Start off by converting the raw tif file to a jpg\n",
    "use\n",
    "gdal_translate -of JPEG -scale -co worldfile=yes input.tiff output.jpg\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 3,
   "metadata": {
    "collapsed": true,
    "deletable": true,
    "editable": true
   },
   "outputs": [],
   "source": [
    "import cv2\n",
    "img = cv2.imread('D:/cv_leaflet/band2_mercator.jpg')\n",
    "edges = cv2.Canny(img,50,50)\n",
    "edges = cv2.imwrite('D:/cv_leaflet/edges.jpg', edges)\n"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {
    "deletable": true,
    "editable": true
   },
   "source": [
    "Lets keep the project associated with the image\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 4,
   "metadata": {
    "collapsed": false,
    "deletable": true,
    "editable": true
   },
   "outputs": [
    {
     "data": {
      "text/plain": [
       "'D:/cv_leaflet/edges.wld'"
      ]
     },
     "execution_count": 4,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "import shutil\n",
    "src = \"D:/cv_leaflet/band2_mercator.wld\"\n",
    "dst = \"D:/cv_leaflet/edges.wld\"\n",
    "shutil.copy(src,dst) #copy file"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {
    "deletable": true,
    "editable": true
   },
   "source": [
    "In order to send the newly created images to leaflet we can use a library called folium"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {
    "collapsed": false,
    "deletable": true,
    "editable": true
   },
   "outputs": [],
   "source": [
    "import folium\n",
    "from folium.plugins import ImageOverlay\n",
    "import os\n",
    "from osgeo import gdal\n",
    "edge_lyr = ('D:/cv_leaflet/edges.jpg')\n",
    "raw_lyr = ('D:/cv_leaflet/band2_mercator.jpg')\n",
    "\n",
    "ds = gdal.Open(raw_lyr) \n",
    "if ds is None:\n",
    "    print('Could not open')\n",
    "\n",
    "#cols and rows\n",
    "geotransform = ds.GetGeoTransform()\n",
    "cols = ds.RasterXSize \n",
    "rows = ds.RasterYSize \n",
    "\n",
    "#Get the extent\n",
    "xmin=geotransform[0]\n",
    "ymax=geotransform[3]\n",
    "xmax=xmin+cols*geotransform[1]\n",
    "ymin=ymax+rows*geotransform[5]\n",
    "\n",
    "\n",
    "#m = folium.Map([40, 7], zoom_start=8, tiles='stamentoner')\n",
    "## tell folium where to load (location) and what backgronud map to use\n",
    "m = folium.Map([40, 7], zoom_start=8, tiles='stamenterrain')\n",
    "\n",
    "bounds = [[ymin, xmin], [ymax, xmax]]\n",
    "print (bounds)\n",
    "\n",
    "## add my edge detection layer\n",
    "folium.plugins.ImageOverlay(\n",
    "    name='My edge detection layer',\n",
    "    image=edge_lyr,\n",
    "    bounds=[[ymin, xmin], [ymax, xmax]], ## se above\n",
    "    opacity=1,\n",
    ").add_to(m)\n",
    "\n",
    "\n",
    "## add the raw satellite image below it\n",
    "folium.plugins.ImageOverlay(\n",
    "    name='raw satellite',\n",
    "    image=raw_lyr,\n",
    "    bounds=[[ymin, xmin], [ymax, xmax]],### its the same image dimensions... be careful\n",
    "    opacity=1,\n",
    ").add_to(m)\n",
    "\n",
    "folium.LayerControl().add_to(m)\n",
    "## save the map\n",
    "m.save('D:/cv_leaflet/Computer_vision_leaflet_eg.html')\n",
    "\n",
    "## display it in the notebook!\n",
    "m"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {
    "collapsed": true,
    "deletable": true,
    "editable": true
   },
   "outputs": [],
   "source": []
  }
 ],
 "metadata": {
  "kernelspec": {
   "display_name": "Python 3",
   "language": "python",
   "name": "python3"
  },
  "language_info": {
   "codemirror_mode": {
    "name": "ipython",
    "version": 3
   },
   "file_extension": ".py",
   "mimetype": "text/x-python",
   "name": "python",
   "nbconvert_exporter": "python",
   "pygments_lexer": "ipython3",
   "version": "3.6.4"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 2
}