Databases
StackOverflow2013
Postsdbo
POGoogle Map Conflict Php and Javascript
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POGoogle Map Conflict Php and Javascript
    text
    copied!<p>I am building an application that has the functionality like</p> <p>3 tabs created using javascript:</p> <ol> <li>Mapview</li> <li>ListView</li> <li>Post Events</li> </ol> <p>When I load the page the default action is the loading of Google map with all my events retrieved from database, and it is functioning properly. But when I click on the next post events tab, in that map is loading but it is not visible fully on that space. Its dragging on to one corner.</p> <p>Can anyone please help me out?</p> <p>I am new to Google maps in PHP.</p> <p>The button clicks I have also done are using javascript.</p> <p>Here is my HTML code:</p> <pre><code>&lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="utf-8" /&gt; &lt;title&gt;Google Maps JavaScript API Example: Simple Map&lt;/title&gt; &lt;script src="//maps.google.com/maps?file=api&amp;amp;v=2&amp;amp;sensor=false&amp;amp;key=[My key goes here]" type="text/javascript"&gt;&lt;/script&gt; &lt;script type="text/javascript"&gt; function initialize() { if (GBrowserIsCompatible()) { var map = new GMap2(document.getElementById("map_canvas")); map.setCenter(new GLatLng(37.4419, -122.1419), 13); map.setUIToDefault(); } } function view_map() { if (GBrowserIsCompatible()) { var map = new GMap2(document.getElementById("view_canvas")); map.setCenter(new GLatLng(37.4419, -122.1419), 13); map.setUIToDefault(); } } &lt;/script&gt; &lt;script language="javascript"&gt; function change_div(div_id) { document.getElementById('div_1').style.display = 'none'; document.getElementById('div_2').style.display = 'none'; document.getElementById('div_3').style.display = 'none'; //alert(div_id); document.getElementById(div_id).style.display = 'block'; } &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;div align="center"&gt; &lt;div align="left"&gt; &lt;a href="javascript:void(0)" onclick="change_div('div_1')"&gt;Post Events&lt;/a&gt; | &lt;a href="javascript:void(0)" onclick="change_div('div_2')"&gt;List Events&lt;/a&gt; | &lt;a href="javascript:void(0)" onclick="change_div('div_3')"&gt;Map View&lt;/a&gt; &lt;/div&gt; &lt;div align="left" id="div_1"&gt; &lt;div id="map_canvas" style="width: 500px; height: 300px"&gt;&lt;/div&gt; &lt;script language="javascript"&gt;initialize();&lt;/script&gt; &lt;/div&gt; &lt;div align="left" id="div_2" style="display:none"&gt; List Events &lt;/div&gt; &lt;div align="left" id="div_3" style="display:none"&gt; &lt;div id="view_canvas" style="width: 500px; height: 300px"&gt;&lt;/div&gt; &lt;script language="javascript"&gt;view_map();&lt;/script&gt; &lt;/div&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload