You'll have to ask the Google Maps people how to register event handlers in
the Map. In the event handler, you can call window.open to open the page
with the charts in it.
On Wednesday, June 6, 2012 5:39:03 AM UTC-4, sk wrote:
>
> hi
> i'm trying to display a map
> when we click on any state of map the info window will display pie
> and column chart(the pie and column chart are in different html file i need
> to cal that file) of that state,that is to be open in another window
> please kindly help me
>
>
> <!DOCTYPE html>
> <html>
> <head>
> <style>
> #map-canvas { width:800px; height:800px; }
> </style>
> <script type="text/javascript"
> src="http://maps.google.com/maps/api/js?sensor=false";>
> </script>
> <script type="text/javascript">
> var map;
> var layerl0;
> function initialize() {
> map = new google.maps.Map(document.getElementById('map-canvas'), {
> center: new google.maps.LatLng(21.7679,78.8718),
> zoom: 5
> });
> var style = [
> {
> featureType: 'road.highway',
> elementType: 'all',
> stylers: [
> { visibility: 'off' }
> ]
> },
> {
> featureType: 'road.arterial',
> elementType: 'all',
> stylers: [
> { visibility: 'off' }
> ]
> },
> {
> featureType: 'road.local',
> elementType: 'all',
> stylers: [
> { visibility: 'off' }
> ]
> },
> {
> featureType: 'administrative.country',
> elementType: 'all',
> stylers: [
> { visibility: 'on' }
> ]
> },
> {
> featureType: 'administrative.locality',
> elementType: 'all',
> stylers: [
> { visibility: 'on' }
> ]
> },
> {
> featureType: 'administrative.neighborhood',
> elementType: 'all',
> stylers: [
> { visibility: 'on' }
> ]
> },
> {
> featureType: 'administrative.land_parcel',
> elementType: 'all',
> stylers: [
> { visibility: 'on' }
> ]
> },
> {
> featureType: 'poi',
> elementType: 'all',
> stylers: [
> { visibility: 'off' }
> ]
> },
> {
> featureType: 'transit',
> elementType: 'all',
> stylers: [
> { visibility: 'off' }
> ]
> }
> ];
> var styledMapType = new google.maps.StyledMapType(style, {
> map: map,
> name: 'Styled Map'
> });
> map.mapTypes.set('map-style', styledMapType);
> map.setMapTypeId('map-style');
> layerl0 = new google.maps.FusionTablesLayer({
> query: {
> select: "'geometry'",
> from: '4070871'
> },
> map: map
> });
> }
> function changeMapl0() {
> var searchString =
> document.getElementById('search-string-l0').value.replace(/'/g, "\\'");
> layerl0.setOptions({
> query: {
> select: "'geometry'",
> from: 4070871,
> where: "'Type' = '" + searchString + "'"
> }
> });
> }
>
> google.maps.event.addDomListener(window, 'load', initialize);
> </script>
> </head>
> <body>
> <div id="map-canvas"></div>
> <div style="margin-top: 10px;">
> <label>Sector</label>
> <select id="search-string-l0" onchange="changeMapl0(this.value);">
> <option value="">--Sector--</option>
> <option value="Formally Approved">Formally Approved</option>
> <option value="In-Principle Approved">In-Principle
> Approved</option>
> <option value="Operational">Operational</option>
> <option value="in-Principle Approved">in-Principle
> Approved</option>
> </select>
> </div>
> </body>
> </html>
>
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To view this discussion on the web visit
https://groups.google.com/d/msg/google-visualization-api/-/iA4Ypn0RDFMJ.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/google-visualization-api?hl=en.
