Develop Reference

Display all business locations from Data Source URL in Bing Maps

For a store locator, let's say I'm using Bing's example data source url: https://spatial.virtualearth.net/REST/v1/data/515d38d4d4e348d9a61c615f59704174/CoffeeShops/CoffeeShop
In Bing's example, the user has to search in order for the store locations to populate, which is fine if you're Starbuck's and you have thousands of locations, but business requirements are that we need to show all of our 10-15 locations on a map of the full United States.
It looks like there are plenty of modules for searching and finding all locations within a box, or finding nearby locations within a specified radius, clustering a lot of locations within the viewport, but I can't for the life of me figure out how to simply load all Contoso Coffee locations from the data source URL.
The closest answer that I could find is this:
Zoom to show all locations in bing maps
The chosen answer:
var locations = CurrentItems.Select(model => model.Location);
map.SetView(LocationRect.CreateLocationRect(locations));
But I could not get it to work. I've also tried:
var queryOptions = {
queryUrl: dataSourceUrl,
spatialFilter: {
spatialFilterType: 'nearby',
location: location,
radius: 1000
},
};
Microsoft.Maps.SpatialDataService.QueryAPIManager.search(queryOptions, map, function (results) {
...
});
This doesn't work because 1000 is the max radius and some of the my locations would be outside of it.
Other than that, I've been trying to find the exact module that reproduces vaguely what I'm looking for, but they keep coming up as dead ends.
I'm sure it's very simple, but the answer has eluded me. Thanks!
~Andrew

Instead of doing a radius search you can use a bounding box and page through the results if there is more than 250 (max results per query) by using the $top and $skip parameters. In theory you could download a full data source if you used a global bounding box and stepped through all results.
Here is an example: https://bingmapsv8samples.azurewebsites.net/#Load%20all%20results%20(parallel)
Just in case you hadn't noticed, the Contoso coffee data source is an example data source with fake coffee shop listings. It's primarily for testing/example use.

Showing single data field via Google Analytics API

I'm having trouble displaying only a single data field via the Google Analytics API.
For example, how would I display the number of users yesterday? Or the number of users in the past week?
I'm assuming "gapi.analytics.report.Data" is the right constructor. I've tried following the "Data" code in Google's Built-in Components Reference but nothing displays on the front-end.
For the "DataChart" code, there's a "container" option that references the HTML element in the DOM that will correctly display the chart.
This "container" option is missing in "Data" - so how do I display a single data field?
EDIT: Here's the code I'm working with.
You can see a pastebin of my code here: https://pastebin.com/M6U0Bd8B
There's also a live staging version of the site here: http://madebychris.ca/dashboard2.html
The first four section ids are all displaying properly but nothing's showing up for the final <p class ="report">

If you are trying to access the raw data numbers, you can just access the response object:
// Set up the request
var report = new gapi.analytics.report.Data({
query: {
ids: 'ga:XXXX',
metrics: 'ga:sessions',
dimensions: 'ga:city'
}
});
// Define what to do with the response data.
report.on('success', function(response) {
console.log(response);
});
// Run the report
report.execute();
For example, the total's for the metrics is response.totalsForAllResults and the rows for each dimension are held in response.rows
You need to select what you want to do with the variables on the report.on("success", function(response){ function. For example:
report.on('success', function(response) {
$("body > main > div > section:nth-child(4) > h2")[0].innerText =
response.totalsForAllResults["ga:sessions"]
});
report.execute();
Note: You should be able to test on the embedded API demo. Copying and pasting the initial code with the console.log should help show what is going on.

google maps v3: check if geojson feature exists on the map

I am looking to find a way of checking if a geometry feature (from big geojson object) is already added to the map (it has already contains other geojson object with lots of features) in google maps v3 (javascript). I've searched everywhere and the only solutions I have found does not work just coming up with the following error:
InvalidValueError: not a Geometry or LatLng or LatLngLiteral object
I also searched by the error, but I didn't find the answer that works for me, because two test geojson object are almost the same and it is ok when I try to add the to the map without any check.
I created a pen here http://codepen.io/hackzilla/pen/qqYjzB
Here is the code:
// add first pool of data
GoogleMap.data.addGeoJson(jsonGeoData_1);
// add second pool of data
jsonGeoData_2.features.map(function(feature, index) {
// if the feature is on the map
if(!GoogleMap.data.contains(feature)){
GoogleMap.data.add(feature);
}
else console.log('feature' + index + 'already exist');
})

How to obtain instagram pictures from a place consuming instagram API?

I gave a look to instafeed.js. It works good right away, I followed the first docs and got a 20 images sample displaying at web page.
However I really need to obtain pictures from a certain place (city, in my case). Working with Twitter API I used to look for the WOEID for the wanted place. Here it seems to be quite similar.
I read Instagram docs:
DISTANCE Default is 1000m (distance=1000), max distance is 5000.
FACEBOOK_PLACES_ID Returns a location mapped off of a Facebook places id. If used, a Foursquare id and lat, lng are not required.
FOURSQUARE_ID Returns a location mapped off of a foursquare v1 api location id. If used, you are not required to use lat and lng. Note that this method is deprecated; you should use the new foursquare IDs with V2 of their API.
LAT Latitude of the center search coordinate. If used, lng is required.
LNG Longitude of the center search coordinate. If used, lat is required.
FOURSQUARE_V2_ID Returns a location mapped off of a foursquare v2 api location id. If used, you are not required to use lat and lng.
But where the hell can I obtain such ID's for a city. Let's say I want pictures tagged with dinner at Puebla, Mexico. What should I do.
I used this nice site to get an ID from my coordinates: http://maihamakyo.org/etc/locastagram/index.php
Tried this Java Script code then:
var feed = new Instafeed({
get: 'tagged',
location: '46016173',
tagName: 'CLEU',
clientId: '***'
})
feed.run();
but got not the expected result.

As of version 1.3, you can add a filter function to Instafeed.js, to exclude images from the results.
So you should be able to set get: "location", and your locationId, and then filter out any images that don't contain the tag you're looking for:
var feed = new Instafeed({
get: 'location',
locationId: LOC_ID,
// other settings omitted for example
filter: function(image) {
return image.tags.indexOf('TAG_NAME') >= 0;
}
});
feed.run();
Update
The image parameter that gets passed to the filter function is the image data straight from Instagram's API. So you can filter on any criteria you want. Just make sure the function returns true or false:
filter: function(image) {
if (image.tags.indexOf('TAG_NAME') >= 0 && image.filter === "Normal") {
return true;
}
return false;
}
To get an idea of what properties that image object has, check this thread on GitHub.

Looking at the instafeed.js documentation, the option name/key for location should be locationId.
I'm not familiar with the Instagram API, but the instafeed.js documentation hints heavily that get needs to be set to location to use a location ID. So it is very possible you can only search for a tag, or a location, but not both.

Definitive reference for Google Maps Placemark object

I am using the following method to reverse geocode a google maps latlng:
[GClientGeocoder.getLocations(address:String, callback:function)][1]
Which states as follows:
As this method requires a call to a Google server, you must also pass a callback method to handle the response. This response will contain a Status code, and if successful, one or more Placemark objects.
Can anyone point me to a definitive reference of what a Placemark object is as it seems to return different attributes for different locations. e.g. sometimes I get a ThoroughfareName and others an AddressLine. I would like to understand if I will always get one or other of them and whether they are interchangeable.

This page is from the Google Maps API documentation, and contains a pretty straightforward explanation of what a Placemark object is.
However, the part you probably want to focus on is where it states what format Google uses for the AddressDetails object in a Placemark, which is xAL (eXtensible Address Language). There is a link to the spec there, which leads to a downloadable schema (xsd file), which essentially defines the entire format. A word of warning: the spec is pretty extensive, but you may not need to worry about a great deal of it for your project.
EDIT:
Apologies for not being allowed to add links to the relevant pages for you.

You have to hunt for it, but Google does in fact have some documentation about Placemarks hidden away.

The contents of the Placemark object do vary based on the data available. I found the best way to work out what I was getting back was to use JSON.stringify to examine the response (for debugging):
function onGeocode (resp)
{
document.getElementById("cd_output").innerHTML = JSON.stringify (resp);
}
This gave me the following results when I GeoCoded an address in Sydney, Australia:
Placemark
{
id, address,
AddressDetails
{
Country, CountryNameCode, CountryName,
AdministrativeArea
{
AdministrativeAreaName,
Locality
{
LocalityName
Thoroughfare { ThoroughfareName }
PostalCode { PostalCodeNumber }
}
}
}
Accuracy,
ExtendedData
{
LatLonBox { north,south,east,west }
Point { coordinates }
}
}