I want Google Maps markers that will:
Change on a daily basis
Be loaded depending on (if there is an event at particular venue tonight)
Loaded Categorically (can be turned on/off)
loaded by date
I expect to have an average of 40 markers on screen at a time, and max no more than 300.
My markers are sorted in an array. What should I go with?
I'm not entirely sure I understand your question but hopefully I can help.
I am presuming this is part of a larger website with an existing db behind it so it sounds to me that you should store your markers in the db and read the required markers out when the page is requested. Your business logic will make sure you get the correct markers at any given time. Your view can then take an IEnumerable which you can use to populate your map.
Your Marker class can look something like this
public class Marker
{
public decimal Longitude { get; set;}
public decimal Latitude { get; set;}
//...plus any additional info you want to add (maybe text for each marker)
}
You've probably already come across this but, if not, here is a good place to get info on using the google map api:
http://code.google.com/apis/ajax/playground/#markers_v3
Apologies if this is not helpful as I have had to make a few assumptions on what you are working with.
My understanding of XML is more of a data transport mechanism rather than storage. Typically I'd store everything in the database and use XML or JSON to move data around.
My approach would be to store all the relevant information in a database and have a script that receives a request (it can include parameters such as date, category, etc) and returns the relevant rows as JSON (thought this can be XML or any other format).
The JavaScript code would be composed of a function that generates the request based on user input (or whatever data you need to get) and once it receives passes the data to a second function that creates the markers and the infowindows if neede
jQuery becomes very handy. You can use %.ajax()or $.getJSON() to make the requests and work with the data you get from the database.
This might help: http://code.google.com/apis/maps/articles/phpsqlsearch.html
Related
I have a map created using D3. There are specific points as per place name. Those point are movable as per user convinience to create a better view using dragging and zoomming. I need to create a "saved view of the map" for the user using angularjs and save the data in JSON format.So that when the user comes back they can have the same view of the map again. I need to capture scaling, longitude, latitude and data associated with those specific points. Please help me out with this.
There are multiple approaches: it depends on whether you want the state to be persisted on the server or only on the client.
The general workflow would be to:
1.
Create a JSON object that holds the state you want to persist
for ex:
var mapState = {
center: [lat, long], // replace lat, long with your coordinates
// more properties go here...
}
save the data to the server (you'll need a back-end for that) or save the data in the local storage (here's an example: http://yeoman.io/codelab/local-storage.html)
load the saved data on reload/when the user comes back
So I am trying to find the most direct point to do a 'Get' from an API when a page loads. As an example, if in my app I go to "#/somepage", when I click on the link to do so, it also does a get from "http://{{host}}/api/common/trans/claim". That URI contains a single property with no name that looks like " "Bzc5YUL7dNjK6ApxpNK1XB%2bDtTU8cw7xRSGpjZ4XRuE%3d" ". So if I fire or add some listen event to this, what is the best way to store? I know that might be a seperate question, but legitimate here because of how the data is returned. Hopefully I provided and storied my question correctly.
My queries have pointed to things like viewContentLoaded and DOM readiness, etc..., but those seem overkill for this when simply clicking a link an retrieving info from the API.
Keep in mind, this API is local and private and the URI data is only available until after the user is logged in.
I'm not if I follow your question but you can fire the function using the ng-click directive.
To store the return value you could set it to the $scope of your controller or save it to a service if you'd like to share the data across controllers.
I've been checking out the documentation for Google's "My Maps" service, and I can't figure out if it will let me do what I need to do.
Our client has a map, created using My Maps, that defines several delivery areas using colored polygons. I understand that it's possible to export a KML file containing the coordinates for these polygons, and that it's also possible to create a network link so said KML file will be updated whenever the map is.
My problem: I don't know what to actually do with the KML file. I need some sort of script that can take the network-linked KML, and return a human-readable set of coordinates that I can use to define delivery areas on the client's site. In other words, they need to be able to edit or create delivery zones on this map, then on their site, bind each polygon to a particular store to determine which store must deliver which orders. There's a lot of complicated stuff going on here, but for this first step I just need to know how to get the coordinates for the separate shapes in a reliable way.
I wish I had some code to post to make this a more useful post, but it's more a question of whether or not this type of functionality is actually possible. Please help me figure this out!
Thanks for any and all help.
The KML file is a XML file then you can inspect the file both server side with a XML parser or client side via JQuery.
this is an essential javascript sample for a client side approch:
var request = new XMLHttpRequest();
request.open("GET", filename, false); // filename = kml_filename
xmlDocObj = $($.parseXML(request.responseText));
var placemarks = xmlDocObj.find("Placemark");
placemarks.each(function (index) {
... your parsing for the geometry object and coordinates content you need
}
I am fairly new to JSON and I want to create a choropleth example as so. http://gabrielflor.it/a-half-decade-of-rising-poverty Whenever the years are clicked it just goes to a different portion of the JSON (I'm assuming). Is this how functionality like this is usually done to avoid redrawing the whole map again and calling another JSON.js file? If so these .JSON files can get quite large?
Using a JSON is only a way to store values you need for each year. When you switch to another year the JS parse the JSON for the giving year and update the choropleth. For the example you have provided, here is the JSON used:
http://gabrielflor.it/static/data/saipe.json
This is a good way since you only have one JSON with every year you need and you load it only once. However since d3 needs datas this way I think you should add another JSON if you want to provide additional data like in gabrielflor example:
http://gabrielflor.it/static/js/d3.poverty-by-county.js?v=121107
He loads JSON like this with d3:
d3.json('../static/data/states.json', function (json) {
states = json;
});
or
d3.json('../static/data/saipehighlights.json', function (json) {
saipehighlights = json;
});
If you look at the network traffic for the example page you gave (ex. by using Chrome Developer Tools).
The file with the poverty data is quite large, but the mapping data file is even larger. You'll notice, that it takes longer for the website to load, but afterwords it runs very smoothly in the client without making any server calls.
The site is just about browsing information and nice design - for that purpose I think a longer load time is quite acceptable if the user experience after is smoother(i.e. user doesn't have to wait for year data to load).
I use such urls like:
http://maps.google.com/?saddr=546%206th%20Avenue,%20New%20York,%20NY%2010011%20(Sixth%20Avenue,%20New%20York)&daddr=W%20103rd%20St,%20New%20York,%20NY%20&dirflg=r
But it returns full html page. Does anybody know how to get such info in json or xml or any parsable format?
I need public transit.
You just add &output=json to the end of the url.
I'd like to extend Mathias's answer a little bit.
There's no official Google Transit API at the momemnt. Transits are provided by agencies, and most of Transits are not public. So, Google is not allowed to open them as API.
You may try to consume the "unofficial" data using your link + "&output=json".
However, the result won't be a valid JSON. Instead, that's something, that can be easily converted to a JavaScript object. (The differences are: there is no quotes around property names,
the strings are not properly encoded etc.)
Imagine you got this JavaScript object. However, it won't allow you to easily get the structured route details. Object's properties contain the route points coordinates, but no descriptions. The only place where the descriptions may be found is 'panel' property, which contains a chunk of HTML text (you may find a link to the sample of HTML in my blog post)
So, you'll have to convert this HTML into XML (X-HTML) and then build the parser of this XML to get the essence data of a trip.
Seems like a bit of overkill to me. Having in mind, that "unofficial" API may change in the future, including slight changes in 'panel' HTML structure that will kill your parser.
#MathiasLin, how did you overcome this?
Google Maps Javascript v3 and the Directions Web Service now has this capability as per :
https://googlegeodevelopers.blogspot.in/2012/06/public-transit-routing-and-layer-now.html
Update:
Latest server side API docs:
https://developers.google.com/maps/documentation/directions/get-directions
Re choosing public transport - it seems that it defaults to public transport now (at least when I use it).
Changing the last URL parameter, dirflg=r, into dirflg=w switches the directions to walking mode.
Plus see:
Walking, bicycle and public transport directions with time required in each mode , iPhone
for more detail about the parameters.
Google direction API response is in HTML, JSON format please check https://developers.google.com/maps/documentation/javascript/directions?hl=lv
& section 'The DirectionsResult Object'