Map search in google earth browser (Roman plz help me)
44 views
Skip to first unread message
HelpMePlz :)
Jan 24, 2009, 1:40:27 PM1/24/09
to KML Developer Support - Google Earth Browser Plugin
Hi all,
i have been trying for many days to add a search to my google earth
browser. But i just can't get it working somehow. Basically, my google
earth application is suppose to have 'get directions' and search. So
far, only get directions is done.
I have a copy without 'get directions' and the search could work. I
have pasted both copies of code over here.
I have actually tried to do it the other way. I used google map with
the 3d layer but i can't add local search to the 3d layer. Also tried
geocoding but dun have much progress in it either. I hope someone can
help me please. Thanks alot.
This is the full code for the google earth application with a search
that is working
<%@ Page Language="VB" AutoEventWireup="true"
CodeFile="Default.aspx.vb" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/
TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat ="server">
<title>Google</title>
<script type="text/javascript" src="http://www.google.com/jsapi?
key=ABQIAAAA9m8zUJK_DD8MsfP7xB1xzRQy5C5Bxj3lpLTRfNgG8qNr31IpvRQSt0tpTKmSPSGF-5Z9merr5UwJYA"></
script>
<script type="text/javascript">
google.load("earth", "1");
google.load("maps", "2.99"); // For JS geocoder
var ge = null;
var geocoder;
function init() {
geocoder = new GClientGeocoder();
google.earth.createInstance("map3d", initCB, failureCB);
}
function initCB(object) {
ge = object;
ge.getWindow().setVisibility(true);
ge.getNavigationControl().setVisibility(ge.VISIBILITY_SHOW);
}
function failureCB(object) {
alert('load failed');
}
function submitLocation() {
var address = document.getElementById('address').value;
geocoder.getLatLng(
address,
function(point) {
if (point && ge != null) {
var la = ge.createLookAt('');
la.set(point.y, point.x, 10, ge.ALTITUDE_RELATIVE_TO_GROUND,
0, 20, 45000);
ge.getView().setAbstractView(la);
}
}
);
}
function finished(object)
{if (!object) {alert('bad or NULL kml');
return;
}
ge.getFeatures().appendChild(object);
var la = ge.createLookAt('');
la.set(0, 0, 0, ge.ALTITUDE_RELATIVE_TO_GROUND,0, 0, 15599550);
ge.getView().setAbstractView(la);}
</script>
</head>
<body onload='init()' id='body'>
<form name='searchform' id='searchform'
action='javascript:submitLocation();void(0);'>
<input type='text' size='60' id='address'/>
<input type='submit' value='Go to location'/>
</form>
<div id='map3d_container' style='border: 1px solid silver; height:
800px;'>
<div id='map3d' style='height: 100%;'></div>
</div>
</body>
</html>
And this is the full code which has 'get directions' working(not added
with search).
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://
www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<!-- saved from url=(0082)http://earth-api-samples.googlecode.com/svn/
trunk/demos/drive-simulator/index.html -->
<HTML><HEAD><TITLE>Google Earth Plug-in Driving Simulator</TITLE>
<script type="text/javascript" src="http://www.google.com/jsapi?
hl=en&key=ABQIAAAAIpyqYQlosoLAKscNbHVZ8xQgfRER8kRLr8_p7LOTMswgkVR3nhSBqg4l_8EIbseaJJ2-
EePYnJcRyw"></script>
<SCRIPT language=javascript>
</SCRIPT>
<META http-equiv=content-type content="text/html; charset=utf-8"><!--
API Key for code.google.com -->
<%--<SCRIPT src="DrivingDirections_files/jsapi" type=text/javascript></
SCRIPT>--%>
<STYLE type=text/css>@import url( index.css );
</STYLE>
<SCRIPT src="geplugin-helpers.js"
type=text/javascript></SCRIPT>
<SCRIPT src="math3d.js" type=text/javascript></SCRIPT>
<SCRIPT src="simulator.js"
type=text/javascript></SCRIPT>
<SCRIPT src="index.js" type=text/javascript></SCRIPT>
<SCRIPT type=text/javascript>
// <![CDATA[
var DS_ge;
var DS_geHelpers;
var DS_map;
google.load("jquery", "1");
google.load("maps", "2.x");
google.load("earth", "1");
function DS_init() {
$('#directions-form input').attr('disabled', 'disabled');
$('#simulator-form input').attr('disabled', 'disabled');
google.earth.createInstance(
'earth',
function(ge) {
DS_ge = ge;
DS_ge.getWindow().setVisibility(true);
DS_geHelpers = new GEHelpers(DS_ge);
// in this sample we will attempt
// to fetch a KML file and show it
function finished(object) {
if (!object) {
alert('bad or NULL kml');
return;
}
ge.getFeatures().appendChild(object);
var la = ge.createLookAt('');
la.set(39.9551, -75.6264, 25, ge.ALTITUDE_RELATIVE_TO_GROUND,
180, 60, 5000);
ge.getView().setAbstractView(la);
}
DS_ge.getNavigationControl().setVisibility(ge.VISIBILITY_AUTO);
//DS_map = new GMap2($('#map-container').get(0));
//DS_map.setCenter(new GLatLng(40, -75), 13);
//DS_map.addControl(new GSmallMapControl());
//DS_map.enableContinuousZoom();
$('#directions-form input').removeAttr('disabled');
},
function() {
alert('Google earth loading failed!');
});
function onresize() {
var clientHeight = document.documentElement.clientHeight;
$('#route-details, #earth-container, #map-container').each(function
() {
$(this).css({
height: (clientHeight - $(this).position().top - 100).toString
() + 'px' });
});
}
$(window).resize(onresize);
onresize();
}
google.setOnLoadCallback(DS_init);
// ]]>
</SCRIPT>
<META content="Microsoft FrontPage 5.0" name=GENERATOR></HEAD>
<BODY onunload=GUnload();>
<H1><font face="Verdana" size="5">Stay Active By Visiting Parks Near
You! </font>
<font face="Verdana" size="2">Click on information point to get
directions to or
from your home!</font></H1>
<TABLE style="WIDTH: 100%; HEIGHT: 400px">
<TBODY>
<TR>
<TD style="WIDTH: 300px" vAlign=top>
<TABLE style="WIDTH: 300px">
<TBODY>
<TR>
<TD style="WIDTH: 50%" vAlign=top>
<FORM id=directions-form onsubmit="return false;"
action=get>
<FIELDSET><LEGEND>Directions</LEGEND>From:<BR>
<INPUT id=from
value="San Francisco, CA" size="20"><BR>To:<BR>
<INPUT id=to
value="Mountain View, CA" size="20"><BR><INPUT id=go
onclick=DS_goDirections(); type=submit value=Go!>
</FIELDSET> </FORM></TD>
</FIELDSET> </FORM></TD></TR></TBODY></TABLE>
<DIV id=route-details></DIV></TD>
<TD style="WIDTH: 67%" vAlign=top>
<DIV id=earth-container
style="BORDER-RIGHT: #000 1px solid; BORDER-TOP: #000 1px solid;
BORDER-LEFT: #000 1px solid; BORDER-BOTTOM: #000 1px solid; HEIGHT:
500px">
<DIV id=earth style="HEIGHT: 100%"></DIV></DIV>
<DIV id=status></DIV></TD>
<TD style="WIDTH: 0%" vAlign=top>
<DIV id=map-container
style="BORDER-RIGHT: #000 1px solid; BORDER-TOP: #000 1px solid;
BORDER-LEFT: #000 1px solid; BORDER-BOTTOM: #000 1px solid; HEIGHT:
500px"></DIV></TD></TR></TBODY></TABLE>
<SCRIPT language=javascript>
</SCRIPT>
</BODY></HTML>
i have been trying for many days to add a search to my google earth
browser. But i just can't get it working somehow. Basically, my google
earth application is suppose to have 'get directions' and search. So
far, only get directions is done.
I have a copy without 'get directions' and the search could work. I
have pasted both copies of code over here.
I have actually tried to do it the other way. I used google map with
the 3d layer but i can't add local search to the 3d layer. Also tried
geocoding but dun have much progress in it either. I hope someone can
help me please. Thanks alot.
This is the full code for the google earth application with a search
that is working
<%@ Page Language="VB" AutoEventWireup="true"
CodeFile="Default.aspx.vb" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/
TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat ="server">
<title>Google</title>
<script type="text/javascript" src="http://www.google.com/jsapi?
key=ABQIAAAA9m8zUJK_DD8MsfP7xB1xzRQy5C5Bxj3lpLTRfNgG8qNr31IpvRQSt0tpTKmSPSGF-5Z9merr5UwJYA"></
script>
<script type="text/javascript">
google.load("earth", "1");
google.load("maps", "2.99"); // For JS geocoder
var ge = null;
var geocoder;
function init() {
geocoder = new GClientGeocoder();
google.earth.createInstance("map3d", initCB, failureCB);
}
function initCB(object) {
ge = object;
ge.getWindow().setVisibility(true);
ge.getNavigationControl().setVisibility(ge.VISIBILITY_SHOW);
}
function failureCB(object) {
alert('load failed');
}
function submitLocation() {
var address = document.getElementById('address').value;
geocoder.getLatLng(
address,
function(point) {
if (point && ge != null) {
var la = ge.createLookAt('');
la.set(point.y, point.x, 10, ge.ALTITUDE_RELATIVE_TO_GROUND,
0, 20, 45000);
ge.getView().setAbstractView(la);
}
}
);
}
function finished(object)
{if (!object) {alert('bad or NULL kml');
return;
}
ge.getFeatures().appendChild(object);
var la = ge.createLookAt('');
la.set(0, 0, 0, ge.ALTITUDE_RELATIVE_TO_GROUND,0, 0, 15599550);
ge.getView().setAbstractView(la);}
</script>
</head>
<body onload='init()' id='body'>
<form name='searchform' id='searchform'
action='javascript:submitLocation();void(0);'>
<input type='text' size='60' id='address'/>
<input type='submit' value='Go to location'/>
</form>
<div id='map3d_container' style='border: 1px solid silver; height:
800px;'>
<div id='map3d' style='height: 100%;'></div>
</div>
</body>
</html>
And this is the full code which has 'get directions' working(not added
with search).
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://
www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<!-- saved from url=(0082)http://earth-api-samples.googlecode.com/svn/
trunk/demos/drive-simulator/index.html -->
<HTML><HEAD><TITLE>Google Earth Plug-in Driving Simulator</TITLE>
<script type="text/javascript" src="http://www.google.com/jsapi?
hl=en&key=ABQIAAAAIpyqYQlosoLAKscNbHVZ8xQgfRER8kRLr8_p7LOTMswgkVR3nhSBqg4l_8EIbseaJJ2-
EePYnJcRyw"></script>
<SCRIPT language=javascript>
</SCRIPT>
<META http-equiv=content-type content="text/html; charset=utf-8"><!--
API Key for code.google.com -->
<%--<SCRIPT src="DrivingDirections_files/jsapi" type=text/javascript></
SCRIPT>--%>
<STYLE type=text/css>@import url( index.css );
</STYLE>
<SCRIPT src="geplugin-helpers.js"
type=text/javascript></SCRIPT>
<SCRIPT src="math3d.js" type=text/javascript></SCRIPT>
<SCRIPT src="simulator.js"
type=text/javascript></SCRIPT>
<SCRIPT src="index.js" type=text/javascript></SCRIPT>
<SCRIPT type=text/javascript>
// <![CDATA[
var DS_ge;
var DS_geHelpers;
var DS_map;
google.load("jquery", "1");
google.load("maps", "2.x");
google.load("earth", "1");
function DS_init() {
$('#directions-form input').attr('disabled', 'disabled');
$('#simulator-form input').attr('disabled', 'disabled');
google.earth.createInstance(
'earth',
function(ge) {
DS_ge = ge;
DS_ge.getWindow().setVisibility(true);
DS_geHelpers = new GEHelpers(DS_ge);
// in this sample we will attempt
// to fetch a KML file and show it
function finished(object) {
if (!object) {
alert('bad or NULL kml');
return;
}
ge.getFeatures().appendChild(object);
var la = ge.createLookAt('');
la.set(39.9551, -75.6264, 25, ge.ALTITUDE_RELATIVE_TO_GROUND,
180, 60, 5000);
ge.getView().setAbstractView(la);
}
DS_ge.getNavigationControl().setVisibility(ge.VISIBILITY_AUTO);
//DS_map = new GMap2($('#map-container').get(0));
//DS_map.setCenter(new GLatLng(40, -75), 13);
//DS_map.addControl(new GSmallMapControl());
//DS_map.enableContinuousZoom();
$('#directions-form input').removeAttr('disabled');
},
function() {
alert('Google earth loading failed!');
});
function onresize() {
var clientHeight = document.documentElement.clientHeight;
$('#route-details, #earth-container, #map-container').each(function
() {
$(this).css({
height: (clientHeight - $(this).position().top - 100).toString
() + 'px' });
});
}
$(window).resize(onresize);
onresize();
}
google.setOnLoadCallback(DS_init);
// ]]>
</SCRIPT>
<META content="Microsoft FrontPage 5.0" name=GENERATOR></HEAD>
<BODY onunload=GUnload();>
<H1><font face="Verdana" size="5">Stay Active By Visiting Parks Near
You! </font>
<font face="Verdana" size="2">Click on information point to get
directions to or
from your home!</font></H1>
<TABLE style="WIDTH: 100%; HEIGHT: 400px">
<TBODY>
<TR>
<TD style="WIDTH: 300px" vAlign=top>
<TABLE style="WIDTH: 300px">
<TBODY>
<TR>
<TD style="WIDTH: 50%" vAlign=top>
<FORM id=directions-form onsubmit="return false;"
action=get>
<FIELDSET><LEGEND>Directions</LEGEND>From:<BR>
<INPUT id=from
value="San Francisco, CA" size="20"><BR>To:<BR>
<INPUT id=to
value="Mountain View, CA" size="20"><BR><INPUT id=go
onclick=DS_goDirections(); type=submit value=Go!>
</FIELDSET> </FORM></TD>
</FIELDSET> </FORM></TD></TR></TBODY></TABLE>
<DIV id=route-details></DIV></TD>
<TD style="WIDTH: 67%" vAlign=top>
<DIV id=earth-container
style="BORDER-RIGHT: #000 1px solid; BORDER-TOP: #000 1px solid;
BORDER-LEFT: #000 1px solid; BORDER-BOTTOM: #000 1px solid; HEIGHT:
500px">
<DIV id=earth style="HEIGHT: 100%"></DIV></DIV>
<DIV id=status></DIV></TD>
<TD style="WIDTH: 0%" vAlign=top>
<DIV id=map-container
style="BORDER-RIGHT: #000 1px solid; BORDER-TOP: #000 1px solid;
BORDER-LEFT: #000 1px solid; BORDER-BOTTOM: #000 1px solid; HEIGHT:
500px"></DIV></TD></TR></TBODY></TABLE>
<SCRIPT language=javascript>
</SCRIPT>
</BODY></HTML>
Roman N
Jan 27, 2009, 8:12:09 PM1/27/09
to KML Developer Support - Google Earth Browser Plugin
Hi,
Sorry, I can't really tell what's wrong from the large excerpt... can
you post a link instead? It'll be much easier for everyone to then
open the link and see what's wrong using Firebug.
- Roman
> hl=en&key=ABQIAAAAIpyqYQlosoLAKscNbHVZ8xQgfRER8kRLr8_p7LOTMswgkVR3nhSBqg4l_8EIbseaJJ2-
Sorry, I can't really tell what's wrong from the large excerpt... can
you post a link instead? It'll be much easier for everyone to then
open the link and see what's wrong using Firebug.
- Roman
Reply all
Reply to author
Forward
0 new messages