Fellow Overflowers,
Am working in a project in which I need to place (pin) on map (Google in my case), a stream of data. One data record consist of 11 columns and the last 2 ones, are "city" and "country".
The data source is an html page, using the usual table tags, this is a business model and can not be changed. I managed to parse and analyze them using Nokogiri and finally store them in an array.
The idea is to pin each data in the map and ballon the rest of the 9 columns.
The hint: data are refreshed every 1 minute.
I can not figure out the approach: Shall i use arrays or a database to save the data? The average number of records to be displayed is 120 at the same time, on the map.
..and has anybody implemented something similar, could there be a comment regarding the performance?
Thanks a bunch...
Petros
I think you will get problems when geocoding Country, City every minute. Probability you reach limit or encounter some failure is very high. The rest (refreshing with ajax and removing/adding 100+ markers) will be no problem.
So, if I'd do it I would created local database with geocodes (latitude and longitude) for Country+City. I would gather geocodes (that is not present in database) via google.maps.Geocoder right in the javascript and send them back with AJAX to append to the table. I suppose, your country+city database get complete rapidly and you no need to extensive geocoding anymore, also for exceptions you always have geocoder ready in javascript to resolve new city. It should work like a charm.
Alternative is to use static geocoder right in your server side just after you get new portion of data. But I would prefer first approach.
Related
I am visualizing some government data using Google Maps JS API. Currently every time the user changes a filter value it grabs the entirety of the JSON data again, filters it, and creates a marker for each row that passes the filter validation. This is slow because it's re-downloading the JSON every time you change the form the filters are located in.
There are two ways to approach caching and displaying the data dynamically: storing the received JSON once and destroying/recreating markers based on the filter, or by creating all the markers at once and only displaying those that match filters.
Is there a performance difference between these two options? Both make sense to me, I'm just not sure how to tell whether one is better than the other. How can I assess how 'heavy' google maps markers are for the user?
The suggested 2 approaches are definitely going to be faster than the original strategy where the JSON data is re-fetched on each filter change.
I guess there are advantages and disadvantages to each method.
If you are not going to retrieve the JSON data on each filter change then essentially the data could be out of data but if the use case is that the JSON data rarely gets updated then this consideration can be dropped.
Having the JSON data cached and creating all of the markers upfront would cause the map to take a bit longer than usual to load at start, as you will need to create all markers first whereas the other way round is that you only create a subset of the markers - hence quicker.
I guess it all comes down to how many markers are there? What is the typical using pattern of the map.
If there is a million markers and the typical filter would cause 100,000 markers to be regenerated on change, then you better off generating the markers upfront and just tweak their visibility accordingly.
Similarly if you have a million markers and the typical filter would only cause 1 or 2 markers to appear out of the million, then probably destroying and recreate would be faster.
Anyway, as a user I would rather have the map take a bit longer to load at the start, probably sacrificing 1-2 seconds. Then have the markers changes instantaneously when I'm playing with the filters. Hope this helps.
I've built some web crawlers to gather information about Hijacking Hotspots in South Africa... I've retrieved location information, but its all listed in a vague format, e.g.: "The William Nicol Drive offramp from the N1 from the Sandton side" ... Each location is formatted in JSON format right now.
My Problem:
I want to iterate through a list of all these descriptions/locations and retrieve rough GPS coordinates for each one. Would using the Google API with Javascript be the best option for achieving this? And does anyone have some code examples to demonstrate how I should go about getting this done with Javascript. Please keep in mind that I'm only an intermediate Javascript coder.
I need the quickest most efficient method of getting this done because I'm on a tight deadline and I'll have to use this method for a few other purposes as well.
Sample JSON Data:
{"data":{"area":"Cape Town","location":"Corner of Alice St and Voortrekker Road", "gps":"?"}}
It would be great if you can provide a sample of your JSON response.
The Getting Started page for Maps API have samples that will guide you through the whole process of what you want to develop.
The easiest way to do it is if the JSON response you have have lat/long coordinates. This way, you iterate through the items and place Markers to the map.
If no coordinates are available, but there's a placeId on the response, you can try out the Places API. You'll just need to provide the placeId in PlacesService.getDetails() and the response will contain an object with the lat/long coordinates - which you'll add into the marker.
I have a csv file of about 10k rows x 25 columns. The csv contains information of bus routes, stops, etc. I have a select box with all the routes and the user will be able to pick a single route to show on the map, and then they will be able to click on individual stops (another select box) to get a closer look on the map. I am wanting to know what will be the best way to parse and structure to store this information and be able to perform fast queries (database?), and how should I store the result of the query (array, json object, dictionary, data Table?). I won't need all columns every time, so I will pick the useful columns to make the query a little faster.
Each time a user will select a different route, I will make a query to get all the stops and other relevant information and loop through the data to display it on the map (maybe store results of last 5 queries?). What will be the best way to store this result? Showing the specific stop information won't be too big of a deal since it will be a smaller subset of the already queried results.
Let me know if you need any additional information that will assist with the answers.
Google releasd a public scheme called gtfs which is a transport data structure. You would ideally use a graph data structure. I have found neo4j a good option.
See this github project for an example of how to use a graph database for this purpose:
https://github.com/tguless/neo4j-gtfs
I'm trying to make a choropleth map visualization with fixed polygon regions, but variable data for each region that depends on a query. Currently I have the polygon coordinates in KML and SHP format, and I could convert it to GeoJSON if needed.
Basically what I want it to do is to load a map with those regions once, and be able to update the values + fill colors of those regions whenever new data is requested / received through an AJAX callback. The most important is it doesn't unnecessarily reload the region polygons, i.e. I could just supply a JSON object of region id's and their new values).
I already tried using the Google Maps API, but I can't seem to bypass generating an entire new KML file each time I want to load new values. This forces me to unnecessarily reload the region shapes as well, although they never change. I tried caching the KML clientside in a JS object, updating it's values each time new data is received and then re-setting the map (using geoxml3), but this seems to perform rather slow (since the entire KML is being iterated and since it's a pretty large file including all the region coordinates). FusionTables didn't work for me either because I need to fetch the data from my own database, and from what I understand using FusionTables you can only query a FT table.
As far as I know the Gmaps API probably isn't going to work for me. Which other solution could suit my needs best?
Google just added GeoJSON support to the Maps API. This example does something similar to what is described above:
https://developers.google.com/maps/articles/combining-data
I'm trying to implement a Google Map.
Part one is centering the map to a specific address, which works quite nice.
My next problem is that I have to place a marker for a store on the map, based on a search on the store name. The marker should probably be connected to a search result in order to display a info bubble when clicked. How to get about and do this, I'm totally qlueless about.
Your steps seem ok to me, I assume that the search for store name goes to your server and you return some result with store names and addresses, then you look that up using Google Geocoding API and fetch the lat/lng coordinates and place the markers on the map, here are the steps that I would probably use:
Create a map
Center on a specific address
Search for a store
If the result has geocode associated with it then just use that to place a marker.
If the result does not have lat/lng then make a request to Google Geocoding API to get the lat/lng coordinates. After that place the marker, store the received geocode to your database (by using some background Ajax request).
The Google Geocoding API best practices suggest that you should store the geocodes so that you don't have to query each time to Google's servers. In order to do that you will need to modify your backend so that it also stores Geocode along with the store details, and in search result you can return the geocodes if available.
On a side note, you can use GMaps JavaScript library for easy map manipulation.
Update
The above solution works perfectly in your revised scenario. Let me rephrase the flow again:
The backend would return a list of stores when searched by a store name (this should be pretty easy I guess)
If results are not empty then loop through the list and see if all of them has a lat/lng value associated with.
If you do not find a lat/lng value for a record then make a Geocode request to Google's server passing the address of the store (you need to have at least the address of the store else you can't get the lat/lng value from Google) as a parameter. If the record has a lat/lng value then just go ahead and place a marker on the map.
Once you receive the response from Geocode API then go ahead and place a marker on the map using the maps library API as provided. For GMaps it is map.addMarker({...}).
Once all the the requests are complete then you can consider optimizing a bit which was suggested earlier where you can store the received geocodes in your own server, so that you don't have to fetch them again and again.
To implement the above steps you need to have familiarity with the Maps JS library as well as JavaScript and Ajax/JSONP. Remember that all your Geocode requests(JSONP I think) are asynchronous and you should invoke the marker placement code only when the response is available to you (typically inside a callback). The GMaps library examples are very easy and simple to start with. I hope this explanation should be enough to solve your problem and if it helps you then you can consider marking this an answer.