How to control the style of labels in StreetViewPanorama? - google-maps-api-3

I need to embed some Google Maps API in a templating system I haven't full control over (CrowdFlower's), but the "host CSS" is breaking the styling of the labels of the streets in StreetViewPanorama, making them difficult to read. E.g. the default styling you get by using Google Street View directly is:
... but what I get is:
You can see that the "Christ Church Ln" label under the bins is barely visible.
Google API's docs show how to style maps but not how to do the same with [StreetViewPanorama.
I have tried "inspecting" the labels to find out the name of the class used by Google and restore it to more readable features but did not manage to find it, probably my skills are not advanced enough.
Can you help? If you want a sandbox to play with, try using my testbed here. Thanks.
G.

Related

How would I go about creating an interactive map using google's API in Wordpress?

I'm working on a Wordpress website for a friend and want to put a calendar on a page that when the mouse scrolls over a country for the country to light up and display some information as well as give the user some options to download a pdf about that country.
See http://us.fulbrightonline.org/countries/selectedregion/23 to get an idea of what I mean.
Just need to get a sense of what technologies and tools are needed to make something like this work. I know I will need to utilize an API but the hovering and attaching a pdf to each country is new to me.
You could try to use the Google Geochart API for your problem. It allows to create interactive maps and to capture click events. It also allows to color countries individually and to display tooltips. You can find more information and examples here: https://developers.google.com/chart/interactive/docs/gallery/geochart
I created a plugin for WordPress that uses this API. It integrates all the needed scripts and allows to build a map from the admin panel. You can find more information here:
http://meisterpixel.com/interactive-map-builder/

Custom Google StreetView with markers

I was wondering if you could put a custom StreetView with a marker. I am making a map that has city parks. I want it so if someone clicks on a specific marker, the custom StreetView pops up and shows the panorama. For the custom StreetViews I used Google Views. Is this possible?
Thanks in advance.
Yes, this is possible. Something close to it can be done in two ways.
The easiest option is to load Google maps from the main URL and wait. It will let you build a map or view your custom maps just below the search bar. Google Maps itself lets you create a custom map with markers. This doesn't sound like your desired option, but it is quick to implement. You can even add your own style.
The second is to create your own custom Street View tour, this sounds like your focus. You want the actual panographs to use your markers. This is fairly easy to do, but requires some programming. It is possible on both Google Earth and Google Maps. Check out the Google APIs such as https://developers.google.com/maps/documentation/javascript/reference#StreetViewPanoramaOptions. Options include changing out panographs for your own images, defining arrows including labels, overlays, pop-up boxes, action boxes, and more. Check out some options here: http://hpneo.github.io/gmaps/examples.html

Google maps api marker info in sidebar

I'm currently creating an interactive web map using Google Maps Javascript API version 3. I'm not sure if this is possible but I would like to create a series of map layers consisting of different kml files that could be toggled from the side bar. I would also like to be able to access the individual points within the kmls so that when the user clicks on a particular point, photos, text etc. can be loaded outside the map window...
Any ideas on how to accomplish this? I've been searching for a while and only found ways of configuring the infowindow which I personally find unattractive...
There is a way to load KML into a google maps application natively, there is actually a pretty good example of how this is done here:
http://gmaps-samples-v3.googlecode.com/svn/trunk/layers/layers.html
One trick I will mention is that since the KML is downloaded to Google's servers in order to be rendered on the map, it must exist on a public facing web server somewhere, Google won't be able to access it from your local machine.
I found this tutorial which seems like it'll do the trick!

How to display area borders in embedded map

When i am searching for some country area in maps on standard web UI it shows me the area borders.
I would like to mark this areas dynamically in embedded map on my website, but i dont know how exactly i have to formulate search query to find if there is some way to achieve this.
I was not found anything about this in reference.
does google offer some API for this in last maps js API?
You need a Polygon-Overlay or a KML-Layer which defines the borders.

adding google map in asp.net application

i am develope web application for factory i need to add google map with location of factory
in contact us web page.any help i am just beginging with web development
Easy way here does all the work for you.
Embedding a map into a website or blog
You can embed a simple map, a set of
driving directions, a local search, or
maps created by other users. Here's
how:
Ensure that the map you'd like to embed appears in the current map
display.
Click Link to this page in the top-right corner of the map.
In the box that pops up, copy the HTML under 'Paste HTML to embed in
website,' and paste it into the source
code of your website or blog.
If you'd like to adjust the size of the map before you embed it, just click
Customize and preview embedded map, select your preferred size, and take a
look at the preview map. Once you're happy with what you see, copy the HTML
that appears in the box at the bottom of the window.
Keep in mind that you won't be able to embed Traffic maps, Mapplets, and some
other Maps features.
Google Map API is just javascript. Which can be used in any web technology
follow this link you will get what you are looking for
http://code.google.com/apis/maps/documentation/javascript/
If your beginning, maybe you should try to learn web development first. Javascript, post/get mechanics, HTML/CSS validation. Tackling Google Maps integration right at the beginning of your learning process might slow down your project evolution. It's my opinion.
To learn google maps api, try to start at this address :
http://code.google.com/intl/en/apis/maps/documentation/javascript/introduction.html

Resources