We are trying to add some visual statistics related to the visitors of our website.
We are now focusing on the visitors' locations.
We want to create a map (through a jquery plugin) that would:
a)Show the location of an entered IP on the map OR if the first option is not available, we could use geoIP to get the country/city of the visitor and the jquery plugin should just place a pin on the city given. It would be good if the plugin could allow us to place more pins.
b)Based on a list of IP's, sort them and group them by country and then highlight the countries with most visitors and color them based on the number of visitors, like Google Analytics. Alternatively, this can be done on server side through geoIP and the server could just output country-code:number-of-visitors and then the jquery plugin should just make the highlights.
What do I need to look for and do you know any jquery plugins that have such functionality?
Regards
I would advice you to use the google GEOCHART, it's free, easy to integrate and fairly easy to manipulate, so you can create your own maps. You can add colors, tags and many more.. .
I hope this is some of assistence to you.. .
There are a number of mapping options available, the key is translating your geolocation (lat and long) into pixels... presumably this would need to be done in real time, and updated on the fly as the visitor infomation changes. If you could link your Google Analytics to a .csv file, ten using a library such as D3.js would allow you flexibility to show anything you'd like. The toughest bit is to get the projection right. The seminal page everyone will refer you to is this:
http://bost.ocks.org/mike/map/
It explains how you would take a shape file, turn it into a json file, which essentially plots out the global or regional map for you.
Related
I am currently undertaking what might be an overly ambitious project for my skill level, but I think I could learn a lot form this exercise.
I work for an aerial surveying company and each time a project is flown, the LiDAR software creates a log file. From this log file, I have written a script that extracts the data and outputs a KML file with data such as flight line numbers, location, height etc.
What I now want to do is write a program that can upload these KML's to a database and show them in a window similar to Google Earth that the user can sort through the flight numbers, locations and dates etc. This would be an incredibly handy piece of software at work and a lot of people would use it, not to mention massive brownie points for my trying to secure a Jnr Dev position in the company going forward.
I know I could mostly use Google Earth to accomplish this task, but for me, it's kind of not the point.
So far, I have looked into Folium and LeafletJS.
https://leafletjs.com
https://pypi.org/project/folium/
Folium can manipulate data and Leaflet can present it, but I am not sure I have the best solution for the job and if it can do exactly what I need to. Especially considering that I only know a little Javascript. I am also not sure if Folium
Ideally, this app would be either a standalone piece of software, or something that my existing script writes to an online server and then can be opened and shown through a browser window. I am biting off more than I can chew with this, but I'm prepared for it to take a little time and be a good learning project. Preferably written in Python.
Any hints or suggestions to what packages I might use would be greatly appreciated. Or, if I am going about this in completely the wrong direction, please let me know.
Thanks a lot.
Welcome to SO.
Here are a few elements that might be useful to you :
leaflet can natively load geojson files. So you could either convert the kml files to geojson using python, or use a leaflet plugin (leaflet-omnivore for example) to read kml files with leaflet. As a first step, I would start with that : a web page that shows one of your flight path. The path data being just a geojson file that is loaded by your app.
then if you want your app to filter flight paths on some criterias, and if you have many of those files, you're going to need a backend. That means a server, with a database, potentially with geo-capabilities (postGIS, mongoDB,... there are many) and a backend application. So your front app (with the js and leaflet) is going to send some requests to your server (send me the file for the flight XYZ please), the backend receives that request, performs a database query, get the file and send it back to the client. The client displays the data on the map.
If you want to write the backend in Python, you can have a look at frameworks like Django or Flask.
That's a lot of tools, but if you start with the js + leaflet part, you will be happy to see a map quickly and will have something to show pretty soon. Then you can start having a look at the backend part. If you manage to get this project done...you definitely deserve that junior dev position.
I am very new to qgis and qgis server, which I have downloaded the plugins of Openlayers, and qgis2web with qgis 2.18. As an added note, I have a wordpress site which the map will go into. I have created a map with multiple layers. Hooked up database's data to it to populate what midwest state counties people had went to, who had went to those counties, and how many times they have been to that county. Even colored coded it to show case results. Now I am ready to put the map on the web. Here is my Question: How do you put the map on the web so it will show live data from our database we are using?
I have create a map using qgis2web and exporting it and then use place it within my wordpress's wamp server and was able to display it using an iframe. BUT, I assume it only created that one static instance of the map. If the datbase were to update, it will not show the correct mapping results. In so, I want to keep the map constantly connected to the database so it will show live data. How would I show live data and having the map constantly update? I think I have downloaded the qgis server as well, and hopefully set that up correctly. Was thinking of doing that way as well, but no luck. Any help where to start, or what to do is appreciated.
You might want to consider using Rethinkdb. It pushes JSON to your apps in real time. https://github.com/rethinkdb/rethinkdb
When you export a map using qgis2web it will export your layers as a static files. Using the latest version (2.22.0) it goes into the "data" folder and will create a .js file with the geographic information stored as a geojson (https://en.wikipedia.org/wiki/GeoJSON). Now for a feed with live data this will definitely not work.
To achieve a live feed there are a number of ways to build one. There are certain services like Qgis Cloud (https://qgiscloud.com/) or Carto (http://carto.com/) that allow you to do that. However, these service might not necessarily suit your needs. (In Carto's case only the base functionality is free of charge. The features for building a live feed cost.)
If you want to build it yourself I'm not aware of a "simple solution". There are quite a few different ways to build a web GIS. In short you'd need your geodatabase (like postgres with postgis), a map server software (like geoserver) that renders the geographic information in the database as WMS/WFS services that in return can be visualised using Openlayers, Leaflet or other javascript libraries. The resulting map can be implemented on your site (Some CMS come with plugins that ease the process of implementing mapping services. I don't know about wordpress though).
In any case, it is probably best to just refer to already existing answers and tutorials:
https://gis.stackexchange.com/questions/8113/how-to-start-web-mapping
First post here - apologies in advance if i've made any mistakes. I would like to scrape the median house price for all the suburbs on this map. The median house price appears when you roll your mouse over the suburb in the map. ideally the output would be in excel with first column suburb name, second column median price with about 100 or so suburbs (i.e. columns). I do not know any programming and have tried to use parsehub (https://www.parsehub.com/) to do this but have not had any luck.
If anyone has any suggestions, please let me know! pls find link to map below:
http://www.realestate.com.au/invest/2-bed-unit-in-st+marys,+nsw+2760?zoom=10
Thanks in advance...
You can use a PhantomJS
"PhantomJS is a headless WebKit scriptable with a JavaScript API. It has fast and native support for various web standards: DOM handling, CSS selector, JSON, Canvas, and SVG."
This will allow you to use JavaScript to scrape data from a page. Another suggestion is using Import.IO. The service is free and doesn't require any programming to scrap the data. The service will give you an API to call which returns JSON data. The data is stored on their servers and is relatively fast.
One of the founders of ParseHub here. At the moment, ParseHub can only extract data from SVG-based maps, not canvas-based maps. I realize this is a technical detail that probably doesn't matter to you. We're looking into a workaround for your problem, expect an email from me soon.
On a side note, while we may be able to solve this from a technical standpoint, we strongly encourage you to abide by the terms of service of any site that you extract data from.
-Serge
I have a customer who wants a site with a map included. The requirements are as follows:
The map needs to be easily edited by the customer(which is why i ended up with Google maps).
The map needs to have markers with info about stores(which is why i think i need maps engine business, since its possibly money involved).
The site I'm making needs to have a search field, which should navigate to the correct location when a option (lets say New York) is selected(which i why i probably need to use the API).
Am i correct in the consumption's above? I'm very confused by all the developer guides, and different map options(lite, pro, engine, not engine etc). I keep opening new links, and they tell different things.
If i make my map public(which i can), will i still have to use OAuth 2.0? The guides i found said i didn't have to, but i still cant get info from the API. The response says i need to add the bearer.
More questions:
- Why can't i add markers when i use the "standard" maps engine, but only the lite one? I'm guessing the lite version wont be suffice for my project. The icons for adding marker is grey, and it gives me warning icon when hovering with my mouse.
- If i navigate to my map with the lite version i can't see my map-id in the url(this might be because it cant be used for API?). It seems i can get my map-id from the "real" maps engine.
Google has three products in this field: Maps Engine Lite, Maps Engine Pro, and just plain Maps Engine. This page explains the differences, but it sounds like you would be best off with Maps Engine Pro.
Both Lite and Pro let you embed your map easily into another webpage. No programming, OAuth etc needed, just copy and paste the pregenerated code.
Pro lets you add up to 2,000 points per layer onto a map, with full custom styling. (Lite is limited to 100 per layer and a set of default icons.)
Lite is free, but Pro costs only US$5/month, so it's not going to break the bank.
The only issue is going to be that search box. Maps Engine Lite & Pro maps in the default standalone viewer have a search box that does what you want, but the embedded iframe version only has a list of points. Might be good enough if you don't have too many?
There are many Web sites that include clickable maps that highlight regions on mouseover and allow the user to narrow down a selection from a world map view to a continent level. Here is an interesting example: davidlynch.org.
Many of these clickable maps are implemented with HTML image maps, while another option is to use for example Google's GeoChart API. Concerning the HTML image maps option, I'm wondering where people get all the 'raw data', all the country and regional border polygons. Is there a free resource for that? Concerning the Google GeoChart option, I'm wondering if that is scalable or if the number of API calls are somehow limited?
Does anyone have some advice on the availability of a free library that allows a straightforward implementation of clickable maps with customizable regions?
Well it is not really a problem which could be tagged 'geocoding'.
Since I have been playing with Raphael.js these days, I thought of this lib while reading your question title. I also remember Wikipedia commons hosted a SVG map of the world. Raphael helps you manipulate svg files, so that could be a nice way to go.
Anyway, after searching whith the criteria 'raphael' I found a conversation matching your request, exactly. So there it is : http://groups.google.com/group/raphaeljs/browse_thread/thread/46b5402c677ce274/7ff6a6a8d8f5f9fa?pli=1
There are some utility scripts, as well as the link to the svg world file mentioned above and a live examples (and links to Stack Exchange topics).
Sure there is work to do, and it may be easier to call directly the google api.
In my experience of the gmaps API, you have to make many requests per second to be blacklisted by google. Like when you launch a heavy batch geocoding tool. So it depends of your project but I would consider quite safe to use it even if your page is popular.
[EDIT] : There is now a live demo on RaphaelJs website.
[EDIT again]: And now a complete production workflow based on Python and Raphael exists : Kartograph. It's really young but looks promising.
Check this out. Seems to serve your requirements and offers a bit more:
Google Maps with Clickable Regions
http://codecanyon.net/item/google-maps-with-clickable-countries/3186942
I second the raphael.js, it is a nice library to draw the shapes with all kinds of user interaction. As an example, you may look at this project, which is a vector map of Russia, implemented on top of the Raphael.js. It allows highlighting the regions programmatically.
There are two libraries I can recommend without doubt: 1. d3JS and 2. Raphael JS
The latter is what I was using for writing my
clickable map generator web application - Make a Clickable Map
d3JS has a steeper learning curve, but you can do way more things with it than Raphael. On the other hand, Raphael is easier to pick up and is fun to work with.