Embedding Ushahidi

This is mainly a test for a friend that was asking what it would take to embed an Ushahidi map in a blog. Pretty much it just took an iFrame, and adjusting the CSS and layout of the map page to fit all nice and neat. Though I will say that Ushahidi isn’t shy when it comes to CSS and objects on the screen that take up space, so it did take some time to get everything squeezed together.

The map that you see here is made by the Admin Map plugin that I wrote. You can download the Enhanced Map plugin here. Obviously I’m biased, but I don’t think an Ushahidi instance should leave the repository with out it. In addition to this nifty, tiny, embeddable map, you can also get this sweet, huge, full screen map. If that’s not enough you also get a really cool map on the back end that lets the admins see all the private reports and stuff too, but of course, I can’t show you that.

The map data comes from Liberia 2011, the Ushahidi map for monitoring the 2011 elections in Liberia that I have the honor and privilege of working on.

2012-07-28 Update: The plugin has been renamed to “Enhanced Map” to better capture its nature and wide array of features. If you’re running an Ushahidi site with more than 1000 reports I’d recommend switching to the high performance version. You lose the ability to integrate with other plugins that filter search results, but you won’t have to wait 20 minutes to run a simple AND query.

Later.

This entry was posted in ICT, Liberia, Software. Bookmark the permalink.

14 Responses to Embedding Ushahidi

  1. Pingback: John Etherton – Trusted Developer – The Ushahidi Blog

  2. I have installed your plugin but when I go to BigMap page http://www.segnalaromanord.it/bigmap
    it Give this error
    system/libraries/drivers/Database/Mysql.php [309]:
    Table “sharing” cannot be found in the database. Please make sure you are using the latest version of the database for this version of Ushahidi.
    MySQL version is 5.5.20-55

    • etherton says:

      Fabrizio

      Thanks for the comment on the blog. It seems the latest version of Ushahidi has done away with the “sharing” database table. I just changed the plugin to remove any references to that table. It should work now. The latest code with the fix is up at https://github.com/jetherton/adminmap.

      Thanks again.

  3. Christoph says:

    Hi John,
    Could you please post a link where I can download the plugin?
    I cannot find it on the Ushahidi website and GitHub gives me a 404.
    Thanks!

    • Christoph says:

      Me again. I now came across your “Enhanced Map”, which seems to provide what I need.

      • etherton says:

        Thanks for the comment.

        Yes, Enhanced Map is what the plugin is now called. I changed the name to better represent the plugin. I’ve updated the blog post with the new URLs.

        Thanks,

  4. Nat Scrimshaw says:

    One aesthetic/usability comment: the “use full map button” blocks part of the menu on the homepage — is there a way to get rid of this button?

    • etherton says:

      I assume you mean the “view full map” button. There’s no easy way to remove it, but you could adjust your css to something like:
      a.bigmapbutton{display:none;}
      And that should do the trick

  5. Clint says:

    Thanks for putting together this code.
    I’m a complete novice on programming but do put together my own blog and would also like to embed a Ushahidi map. Does this code you’ve developed work for embedding a crowdmap on a WordPress blog?

    Thanks for any/all assistance.

    • etherton says:

      It should, though I believe with the recent upgrade to Ushahidi 2.6 it may have broke on Crowdmap, but I know they are aware of the problem and are fixing it.

      John.

  6. Great plugin! 2 questions…so far… 😀
    1. Is it possible to bring the Ushahidi CSS theme across with the iFrame?
    2. Is it possible to embed the Time line Sliding scale in the iFrame (eg, http://ushahidi261.peacegeeks.org/)

    Goal: embed Ushahidi’s map only in a Drupal page and have it look identical to the map in the above example. Here is what we have so far: http://harassmapdev.peacegeeks.org/map

    Thanks again John.

    – Carey

    • etherton says:

      Yup, an iFrame lets you embed a website as is. The only reason the standard CSS and timeline are missing is because I didn’t want the Ushahidi iframe to take up too much space. If you didn’t have space constraints you could just embed the whole page.

  7. Renee says:

    Hey John – My colleague Carey has been trying to investigate what is out in the world in terms of trying to integrate Ushahidi and CMSs. We have used your tool and looked at some other options, and are trying to get a handle on 1) what options are out there and 2) where they are going from here (if anywhere).

    we have a grant to look at the question of how to better integrate CMS and mapping, possibly using Ushahidi, but there is an argument to be made that using Drupal mapping tools that already integrate with a CMS might be a better option than trying to integrate with Ushahidi. There are pros and cons to both options, so we are trying to make sure we are talking to people who have been working on this problem for a while so we can make the most informed decision. Since you’ve clearly been looking at this for some time, we wanted to get some thoughts from you on this.

    If you happen to have time for a chat by Skype, would be much appreciated. I am reneeontheroad (from PeaceGeeks). Thanks!

  8. Renee says:

    Oh – if you have an example on hand, could you send me a link for a 2.5 site that used EnhancedMap without additional theming, so I can see the difference between the two for my reference? Thanks!