It’s ready big map for BGOutdoor website,that shows temperature, cloudiness and precipitation in real time. For this purpose uses a plugin for browsers on Google Earth, several JavaScript and two servers for satellite images, one of which at NASA.
All points and layers are placed in Google Earth and accordingly recorded in a kml file. Calling the different layers and synchronization going through java script in head page:
[startCode]<*script src="https://www.google.com/jsapi?key=*****************************************" type="text/javascript">
<*script src="vremeto.js" type="text/javascript">
<*style type="text/css">
<*!--
#apDiv1 {
position:absolute;
width:283px;
height:46px;
z-index:1;
left: 21px;
top: 801px;
overflow: visible;
visibility: visible;
}
-->
[endCode]
And add #apDiv1, where you want a map in body.
The java script contains text from kml fail:
var ge;
var kml;
google.load('earth','1');
function initCallback(instance) {
base_setup(instance);
var la = ge.createLookAt('');
la.set(42.748644, 25.235311, 0, ge.ALTITUDE_RELATIVE_TO_GROUND, 0, 35, 650000 );
ge.getView().setAbstractView(la);
kml = ge.parseKml(
'Текст съдържанието на kml файла');
ge.getFeatures().appendChild(kml);
//set a click listener that affects all placemarks
google.earth.addEventListener(
ge.getGlobe(), 'click', function(event) {
var obj = event.getTarget();
if (obj.getType() == 'KmlPlacemark'){
event.preventDefault();
var placemark = obj;
var placemark_name = placemark.getName();
//get the full balloon html
var placemark_desc_active = placemark.getBalloonHtmlUnsafe();
//same as above, except with 'active' content like JS stripped out
var placemark_desc = placemark.getBalloonHtml();
//create new balloon with rendered content
var balloon = ge.createHtmlStringBalloon('');
//balloon.setFeature(placemark);
balloon.setMaxWidth(300);
balloon.setContentString('
' + placemark_name + '
' + placemark_desc_active);
ge.setBalloon(balloon);
}
});
}
function base_setup(instance){
ge = instance;
ge.getWindow().setVisibility(true);
document.getElementById('installed-plugin-version').innerHTML = ge.getPluginVersion().toString();
}
function init() {
google.earth.createInstance('map3d', initCallback, failureCallback);
}
function failureCallback(errorCode) {}
This ensures the simultaneous operation of all layers and their equality in the map. The points that call data via iframe should be changed with CDATA in the description.
[startCodeBlock]<*![CDATA[<*iframe src="link to source" width="300" height="250" marginwidth="0" marginheight="0" frameborder="0" scrolling="no" allowtransparency="true">]]>[endCodeBlock]
Map can use at time now . As mentioned, in the proper use of the card you must have installed Google Earth Plugin. That map here