Inconsistency while invoking JavaScript Method in Internet Explorer ActiveX control
I am working on interfacing MATLAB with Google Earth Plug-in. The interface uses Internet Explorer ActiveX control as host for the Google Earth Plug-in as the plug-in uses JavaScript.
In a simple demo below (testJS.html), I successfully imitate a straight movement in Google Earth using pre-defined coordinates. (Works only on Firefox and IE, although on IE the speed is a little bit fast).
Using the same coordinates, I invoked the JavaScript methods from MATLAB script. Instead of straight movement, what I get is zig-zag movement. At first, I thought the problem was the decimal places of the input, as Google Earth supports only up to 6 decimal places. But, reducing the decimal places also brought no joy.
Does anyone have any idea what wrong is?
Thanks.
Wan.
p.s: below is the files. testJS.html is a JavaScript demo. TestOhneSimulink.m is the MATLAB code. pluginhost3.html is the host html document of the plugin.
http://dl.dropbox.com/u/13293991/TestOhneSimulink.m
% Initialisation for Google Earth Plugin
global h
% Customizing the figure window
hFig = figure(1);
set(hFig,'Name','Google Earth Plugin','Toolbar','none','Menubar','none','Position',[100,100,800,600])
hFig = figure(1);
cood = [ 0.484231230000000 0.109224940000000 4.697156860000000;
0.484231230000000 0.109224940000000 4.697156860000000;
0.484231230000000 0.109224940000000 4.697156860000000;
0.484231230000000 0.109224940000000 4.697156860000000;
0.484231230000000 0.109224940000000 4.697156860000000;
0.484231230000000 0.109224940000000 4.697156860000000;
0.484231230000000 0.109224940000000 4.697156860000000;
0.484231230000000 0.109224940000000 4.697156860000000;
0.484231230000000 0.109224940000000 4.697156860000000;
0.484231230000000 0.109224940000000 4.697156860000000;
0.484231230000000 0.109224940000000 4.697156860000000;
0.484231240000000 0.109224980000000 4.697156860000000;
0.484231260000000 0.109225050000000 4.697156860000000;
0.484231270000000 0.109225120000000 4.697156860000000;
0.484231290000000 0.109225200000000 4.697156860000000;
0.484231320000000 0.109225300000000 4.697156910000000;
0.484231360000000 0.109225480000000 4.697157630000000;
0.484231410000000 0.109225690000000 4.697161530000000;
0.484231470000000 0.109225930000000 4.697174400000000;
0.484231540000000 0.109226210000000 4.697206270000000;
0.484231610000000 0.109226520000000 4.697271230000000;
0.484231700000000 0.109226860000000 4.697386810000000;
0.484231720000000 0.109226970000000 4.697430900000000;
0.484231720000000 0.109226970000000 4.697430900000000;
0.484231810000000 0.109227350000000 4.697775960000000;
0.484231840000000 0.109227480000000 4.698040690000000;
0.484231840000000 0.109227480000000 4.698040690000000;
0.484231950000000 0.109227900000000 4.699629949999999;
0.484232060000000 0.109228350000000 4.702419819999999;
0.484232170000000 0.109228820000000 4.706433960000000;
0.484232290000000 0.109229320000000 4.711695610000000;
0.484232420000000 0.109229850000000 4.718227120000000;
0.484232550000000 0.109230390000000 4.726049560000000;
0.484232690000000 0.109230960000000 4.735182390000000;
0.484232830000000 0.109231540000000 4.745643230000000;
0.484232970000000 0.109232140000000 4.757447729999999;
0.484233120000000 0.109232760000000 4.770609470000000;
0.484233270000000 0.109233390000000 4.785139999999999;
0.484233430000000 0.109234030000000 4.801048860000000;
0.484233590000000 0.109234690000000 4.818343670000000;
0.484233750000000 0.109235360000000 4.837030240000000;
0.484233910000000 0.109236040000000 4.857112689999999;
0.484234080000000 0.109236730000000 4.878593510000000;
0.484234250000000 0.109237430000000 4.901473930000000;
0.484234420000000 0.109238140000000 4.925754380000000;
0.484234590000000 0.109238860000000 4.951434910000000;
0.484234770000000 0.109239590000000 4.978515540000000;
0.484234950000000 0.109240340000000 5.006996279999999;
0.484235130000000 0.109241090000000 5.036877140000000;
0.484235320000000 0.109241850000000 5.068158130000000;
0.484235500000000 0.109242630000000 5.100839260000000;
0.484235690000000 0.109243410000000 5.134920530000000;
0.484235880000000 0.109244200000000 5.170401970000000;
0.484236080000000 0.109245010000000 5.207283580000000;
0.484236280000000 0.109245820000000 5.245565370000000;
0.484236470000000 0.109246650000000 5.285247340000000;
0.484236680000000 0.109247480000000 5.326329519999999;
0.484236880000000 0.109248330000000 5.368811910000000;
0.484237090000000 0.109249190000000 5.412694520000000;
0.484237300000000 0.109250050000000 5.457977370000000;
0.484237510000000 0.109250930000000 5.504660450000000;
0.484237720000000 0.109251820000000 5.552743789999999;
0.484237940000000 0.109252720000000 5.602227390000000;
0.484238160000000 0.109253620000000 5.653111259999999;
0.484238330000000 0.109254340000000 5.693655699999999;];
cood=cood*100;
% Creating COM server
h = actxcontrol('Shell.Explorer', [0 0 800 600]);
% Open Google Earth Plugin Host
invoke(h,'Navigate2',strcat(pwd,'\pluginhost3.html'));
% Wait until the Document finished loading
while strcmp(h.Document.title,'Google Earth Plugin - Ready')~=1
pause(0.01)
end
h.Document.parentWindow.execScript(['UpdateCamera(' num2str(48.423123045697500) ',' ...
num2str(10.922493539400300) ',' ...
num2str(469.7156861096700) ',' ...
num2str(70) ',' ...
num2str(90) ',' ...
num2str(0) ');'] , 'JavaScript');
disp('Press Any Key To Continue');
pause;
for i=1:65
h.Document.parentWindow.execScript(['tickAnimation(' num2str(cood(i,1)) ',' ...
num2str(cood(i,2)) ',' ...
num2str(cood(i,3)) ',' ...
num2str(70) ',' ...
num2str(90) ',' ...
num2str(0) ');'] , 'JavaScript');
while strcmp(h.Document.title,'Google Earth Plugin - tic')~=1
pause(0.01)
end
end
http://dl.dropbox.com/u/13293991/pluginhost3.html
http://dl.dropbox.com/u/13293991/testJS.html
or this if above does not work
http://www.hs-augsburg.de/~bizz145/earth/testJS.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<head>
<title>Google Earth Plug-in</title>
<!-- NOTE: replace the key below with your own key -->
<script type="text/javascript" src="http://www.google.com/jsapi?key=ABQIAAAASCAedFja1cLViBwu5vZBhhS5GayC4xe98VdZPgzqVN2-dFqZ9BQEClMgNeXYIQ2dDJ_adQGmjS2n6A"></script>
<script type="text/javascript">
google.load('earth', '1');
var ge = null;
function init() {
google.earth.createInstance('map3d', initCallback, failureCallback);
}
function initCallback(pluginInstance) {
ge = pluginInstance;
ge.getWindow().setVisibility(true);
// tell the application the plugin is ready
document.title = "Google Earth Plugin - Ready";
// prevent mouse navigation in the plugin
ge.getOptions().setMouseNavigationEnabled(false);
var camera = ge.getView().copyA开发者_如何转开发sCamera(ge.ALTITUDE_ABSOLUTE);
camera.setLatitude(48.423123);
camera.setLongitude(10.922494);
camera.setAltitude(469.715686);
camera.setHeading(70.000000);
camera.setTilt(90.000000);
camera.setRoll(0.000000);
ge.getOptions().setFlyToSpeed(ge.SPEED_TELEPORT);
ge.getView().setAbstractView(camera);
// Set the FlyTo speed
ge.getOptions().setFlyToSpeed(ge.SPEED_TELEPORT);
// Update the view in Google Earth
ge.getView().setAbstractView(camera);
}
function failureCallback(error) {
}
function startAnimationClick() {
ge.getOptions().setFlyToSpeed(ge.SPEED_TELEPORT);
for(i=1;i<=62;i++) {
google.earth.addEventListener(ge,'frameend',tickAnimation(i));
}
// start it off
tickAnimation(0);
}
function tickAnimation(i) {
var camera = ge.getView().copyAsCamera(ge.ALTITUDE_ABSOLUTE);
var Latitude = new Array( )
Latitude[0] = (48.4231230456975);
Latitude[1] = (48.4231230456975);
Latitude[2] = (48.4231230456975);
Latitude[3] = (48.4231230456975);
Latitude[4] = (48.4231230456975);
Latitude[5] = (48.4231230456975);
Latitude[6] = (48.4231230456978);
Latitude[7] = (48.4231230457054);
Latitude[8] = (48.4231230458949);
Latitude[9] = (48.4231230506331);
Latitude[10] = (48.4231231690862);
Latitude[11] = (48.4231240370352);
Latitude[12] = (48.4231257354662);
Latitude[13] = (48.4231274110900);
Latitude[14] = (48.4231294904544);
Latitude[15] = (48.4231319097717);
Latitude[16] = (48.4231361613361);
Latitude[17] = (48.4231412401686);
Latitude[18] = (48.4231471403964);
Latitude[19] = (48.4231538517288);
Latitude[20] = (48.4231613594480);
Latitude[21] = (48.4231696448577);
Latitude[22] = (48.4231720987612);
Latitude[23] = (48.4231720987612);
Latitude[24] = (48.4231813451532);
Latitude[25] = (48.4231844782562);
Latitude[26] = (48.4231844782562);
Latitude[27] = (48.4231946597878);
Latitude[28] = (48.4232055084529);
Latitude[29] = (48.4232169896683);
Latitude[30] = (48.4232290674080);
Latitude[31] = (48.4232417047580);
Latitude[32] = (48.4232548644764);
Latitude[33] = (48.4232685095587);
Latitude[34] = (48.4232826038070);
Latitude[35] = (48.4232971124025);
Latitude[36] = (48.4233120024806);
Latitude[37] = (48.4233272437069);
Latitude[38] = (48.4233428088542);
Latitude[39] = (48.4233586743784);
Latitude[40] = (48.4233748209942);
Latitude[41] = (48.4233912342494);
Latitude[42] = (48.4234079049223);
Latitude[43] = (48.4234248283822);
Latitude[44] = (48.4234420030174);
Latitude[45] = (48.4234594285689);
Latitude[46] = (48.4234771049934);
Latitude[47] = (48.4234950322493);
Latitude[48] = (48.4235132102953);
Latitude[49] = (48.4235316390898);
Latitude[50] = (48.4235503185914);
Latitude[51] = (48.4235692487584);
Latitude[52] = (48.4235884295493);
Latitude[53] = (48.4236078609225);
Latitude[54] = (48.4236275428364);
Latitude[55] = (48.4236474752493);
Latitude[56] = (48.4236676581195);
Latitude[57] = (48.4236880914052);
Latitude[58] = (48.4237087750649);
Latitude[59] = (48.4237297090566);
Latitude[60] = (48.4237508933386);
Latitude[61] = (48.4237723278691);
Latitude[62] = (48.4237940126062);
Latitude[63] = (48.4238159475080);
var Longitude = new Array( )
Longitude[0] = (10.9224935394003);
Longitude[1] = (10.9224935394003);
Longitude[2] = (10.9224935394003);
Longitude[3] = (10.9224935394003);
Longitude[4] = (10.9224935394003);
Longitude[5] = (10.9224935394004);
Longitude[6] = (10.9224935394016);
Longitude[7] = (10.9224935394330);
Longitude[8] = (10.9224935402176);
Longitude[9] = (10.9224935598340);
Longitude[10] = (10.9224940502431);
Longitude[11] = (10.9224976436470);
Longitude[12] = (10.9225046753396);
Longitude[13] = (10.9225116126099);
Longitude[14] = (10.9225202214143);
Longitude[15] = (10.9225302376668);
Longitude[16] = (10.9225478396446);
Longitude[17] = (10.9225688666283);
Longitude[18] = (10.9225932943132);
Longitude[19] = (10.9226210801061);
Longitude[20] = (10.9226521630864);
Longitude[21] = (10.9226864658615);
Longitude[22] = (10.9226966253816);
Longitude[23] = (10.9226966253816);
Longitude[24] = (10.9227349068413);
Longitude[25] = (10.9227478783761);
Longitude[26] = (10.9227478783761);
Longitude[27] = (10.9227900315565);
Longitude[28] = (10.9228349468661);
Longitude[29] = (10.9228824811404);
Longitude[30] = (10.9229324852420);
Longitude[31] = (10.9229848063565);
Longitude[32] = (10.9230392903111);
Longitude[33] = (10.9230957839149);
Longitude[34] = (10.9231541373153);
Longitude[35] = (10.9232142063690);
Longitude[36] = (10.9232758550220);
Longitude[37] = (10.9233389576954);
Longitude[38] = (10.9234034016728);
Longitude[39] = (10.9234690894869);
Longitude[40] = (10.9235359413022);
Longitude[41] = (10.9236038972918);
Longitude[42] = (10.9236729192853);
Longitude[43] = (10.9237429881205);
Longitude[44] = (10.9238140971337);
Longitude[45] = (10.9238862452629);
Longitude[46] = (10.9239594323388);
Longitude[47] = (10.9240336582001);
Longitude[48] = (10.9241089226857);
Longitude[49] = (10.9241852256344);
Longitude[50] = (10.9242625668851);
Longitude[51] = (10.9243409462766);
Longitude[52] = (10.9244203636480);
Longitude[53] = (10.9245008188381);
Longitude[54] = (10.9245823116860);
Longitude[55] = (10.9246648420306);
Longitude[56] = (10.9247484097110);
Longitude[57] = (10.9248330145664);
Longitude[58] = (10.9249186564357);
Longitude[59] = (10.9250053351582);
Longitude[60] = (10.9250930505730);
Longitude[61] = (10.9251818025193);
Longitude[62] = (10.9252715908363);
Longitude[63] = (10.9253624153634);
var Altitude = new Array( )
Altitude[0] = (469.7156861096700);
Altitude[1] = (469.7156861096700);
Altitude[2] = (469.7156861096700);
Altitude[3] = (469.7156861096700);
Altitude[4] = (469.7156861096700);
Altitude[5] = (469.7156861096700);
Altitude[6] = (469.7156861096700);
Altitude[7] = (469.7156861096700);
Altitude[8] = (469.7156861096700);
Altitude[9] = (469.7156861096700);
Altitude[10] = (469.7156861096700);
Altitude[11] = (469.7156861096700);
Altitude[12] = (469.7156861096700);
Altitude[13] = (469.7156861096700);
Altitude[14] = (469.7156862159641);
Altitude[15] = (469.7156905074050);
Altitude[16] = (469.7157626436327);
Altitude[17] = (469.7161530281460);
Altitude[18] = (469.7174401868500);
Altitude[19] = (469.7206267748753);
Altitude[20] = (469.7271233181284);
Altitude[21] = (469.7386814324996);
Altitude[22] = (469.7430900464778);
Altitude[23] = (469.7430900464778);
Altitude[24] = (469.7775961771575);
Altitude[25] = (469.8040693582731);
Altitude[26] = (469.8040693582731);
Altitude[27] = (469.9629946259733);
Altitude[28] = (470.2419820385869);
Altitude[29] = (470.6433960827681);
Altitude[30] = (471.1695609734226);
Altitude[31] = (471.8227121798819);
Altitude[32] = (472.6049562126647);
Altitude[33] = (473.5182390278476);
Altitude[34] = (474.5643230749208);
Altitude[35] = (475.7447726782004);
Altitude[36] = (477.0609471027976);
Altitude[37] = (478.5140003152721);
Altitude[38] = (480.1048861078195);
Altitude[39] = (481.8343669143261);
Altitude[40] = (483.7030243077464);
Altitude[41] = (485.7112688576162);
Altitude[42] = (487.8593510998858);
Altitude[43] = (490.1473934514949);
Altitude[44] = (492.5754379101905);
Altitude[45] = (495.1434911545312);
Altitude[46] = (497.8515542538756);
Altitude[47] = (500.6996282314109);
Altitude[48] = (503.6877141101633);
Altitude[49] = (506.8158129129977);
Altitude[50] = (510.0839256626186);
Altitude[51] = (513.4920533815692);
Altitude[52] = (517.0401970922322);
Altitude[53] = (520.7283578168288);
Altitude[54] = (524.5565365774196);
Altitude[55] = (528.5247343959043);
Altitude[56] = (532.6329522940215);
Altitude[57] = (536.8811912933489);
Altitude[58] = (541.2694524153035);
Altitude[59] = (545.7977366811410);
Altitude[60] = (550.4660451119564);
Altitude[61] = (555.2743787286838);
Altitude[62] = (560.2227385520963);
Altitude[63] = (565.3111256028059);
//var i =0;
//for(i=0;i<=201;i++) {
camera.setLatitude(Latitude[i]);
camera.setLongitude(Longitude[i]);
camera.setAltitude(Altitude[i]);
camera.setHeading(70.000000);
camera.setTilt(90.000000);
camera.setRoll(0.000000);
ge.getOptions().setFlyToSpeed(ge.SPEED_TELEPORT);
ge.getView().setAbstractView(camera);
//}
}
</script>
<style type="text/css">
html, body {
margin: 0;
width: 100%;
height: 100%;
}
</style>
</head>
<body onload="init()">
<div id="map3d" style="width: 100%; height: 80%;"></div>
<center>
<a onClick=startAnimationClick() href=#>Fly!</a>
</body>
</html>
There are a couple of issues - mainly the number of event listeners and the number of calls on tickAnimation().
You are creating 62 event listeners, all of which are getting called every-time the frame is redrawn! There is no need to have any more than one event listener as all we need to know is when to update the animation.
Also, how the tickAnimation function is structured is really inefficient - as you recreate the various coordinate arrays every time is called.
Finally the when you add the event listener you should only pass a reference to a delegate method (or use an anonymous function) - you are actually calling the timertick method. e.g.
google.earth.addEventListener(ge,'frameend',tickAnimation(i));
should be
google.earth.addEventListener(ge,'frameend', tickAnimation);
or
google.earth.addEventListener(ge,'frameend', function() { //something });
Anyhow, I cleaned up these issues and tidied up the code and it seems to work AOK for me...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Tranal//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<head>
<title>Google Earth Plug-in</title>
<script type="text/javascript" src="http://www.google.com/jsapi?key=ABQIAAAASCAedFja1cLViBwu5vZBhhS5GayC4xe98VdZPgzqVN2-dFqZ9BQEClMgNeXYIQ2dDJ_adQGmjS2n6A"></script>
<script type="text/javascript">
google.load('earth', '1');
var ge = null;
var camera = null;
var current = 0;
var coordinates = [
[48.4231230, 10.9224935, 469.7156861],
[48.4231230, 10.9224935, 469.7156861],
[48.4231230, 10.9224935, 469.7156861],
[48.4231230, 10.9224935, 469.7156861],
[48.4231230, 10.9224935, 469.7156861],
[48.4231230, 10.9224935, 469.7156861],
[48.4231230, 10.9224935, 469.7156861],
[48.4231230, 10.9224935, 469.7156861],
[48.4231230, 10.9224935, 469.7156861],
[48.4231230, 10.9224935, 469.7156861],
[48.4231231, 10.9224940, 469.7156861],
[48.4231240, 10.9224976, 469.7156861],
[48.4231257, 10.9225046, 469.7156861],
[48.4231274, 10.9225116, 469.7156861],
[48.4231294, 10.9225202, 469.7156862],
[48.4231319, 10.9225302, 469.7156905],
[48.4231361, 10.9225478, 469.7157626],
[48.4231412, 10.9225688, 469.7161530],
[48.4231471, 10.9225932, 469.7174401],
[48.4231538, 10.9226210, 469.7206267],
[48.4231613, 10.9226521, 469.7271233],
[48.4231696, 10.9226864, 469.7386814],
[48.4231720, 10.9226966, 469.7430900],
[48.4231720, 10.9226966, 469.7430900],
[48.4231813, 10.9227349, 469.7775961],
[48.4231844, 10.9227478, 469.8040693],
[48.4231844, 10.9227478, 469.8040693],
[48.4231946, 10.9227900, 469.9629946],
[48.4232055, 10.9228349, 470.2419820],
[48.4232169, 10.9228824, 470.6433960],
[48.4232290, 10.9229324, 471.1695609],
[48.4232417, 10.9229848, 471.8227121],
[48.4232548, 10.9230392, 472.6049562],
[48.4232685, 10.9230957, 473.5182390],
[48.4232826, 10.9231541, 474.5643230],
[48.4232971, 10.9232142, 475.7447726],
[48.4233120, 10.9232758, 477.0609471],
[48.4233272, 10.9233389, 478.5140003],
[48.4233428, 10.9234034, 480.1048861],
[48.4233586, 10.9234690, 481.8343669],
[48.4233748, 10.9235359, 483.7030243],
[48.4233912, 10.9236038, 485.7112688],
[48.4234079, 10.9236729, 487.8593510],
[48.4234248, 10.9237429, 490.1473934],
[48.4234420, 10.9238140, 492.5754379],
[48.4234594, 10.9238862, 495.1434911],
[48.4234771, 10.9239594, 497.8515542],
[48.4234950, 10.9240336, 500.6996282],
[48.4235132, 10.9241089, 503.6877141],
[48.4235316, 10.9241852, 506.8158129],
[48.4235503, 10.9242625, 510.0839256],
[48.4235692, 10.9243409, 513.4920533],
[48.4235884, 10.9244203, 517.0401970],
[48.4236078, 10.9245008, 520.7283578],
[48.4236275, 10.9245823, 524.5565365],
[48.4236474, 10.9246648, 528.5247343],
[48.4236676, 10.9247484, 532.6329522],
[48.4236880, 10.9248330, 536.8811912],
[48.4237087, 10.9249186, 541.2694524],
[48.4237297, 10.9250053, 545.7977366],
[48.4237508, 10.9250930, 550.4660451],
[48.4237723, 10.9251818, 555.2743787],
[48.4237940, 10.9252715, 560.2227385],
[48.4238159, 10.9253624, 565.3111256]
];
function init() {
google.earth.createInstance('map3d', initCallback, failureCallback);
}
function initCallback(pluginInstance) {
ge = pluginInstance;
ge.getWindow().setVisibility(true);
ge.getOptions().setMouseNavigationEnabled(false);
ge.getOptions().setFlyToSpeed(ge.SPEED_TELEPORT);
camera = ge.getView().copyAsCamera(ge.ALTITUDE_ABSOLUTE);
camera.setLatitude(48.423123)
camera.setLongitude(10.922494)
camera.setAltitude(469.715686)
camera.setHeading(70);
camera.setTilt(90);
ge.getView().setAbstractView(camera);
}
function failureCallback(error) {}
function startAnimationClick() {
google.earth.addEventListener(ge, 'frameend', tickAnimation);
tickAnimation();
}
function tickAnimation() {
camera.setLatitude(coordinates[current][0]);
camera.setLongitude(coordinates[current][1]);
camera.setAltitude(coordinates[current][2]);
ge.getView().setAbstractView(camera);
current++;
}
</script>
<style type="text/css">
html, body {
margin: 0;
width: 100%;
height: 100%;
}
</style>
</head>
<body onload="init()">
<div id="map3d" style="width: 100%; height: 80%;"></div>
<center>
<a onClick=startAnimationClick() href=#>Fly!</a>
</body>
</html>
精彩评论