2014-01-27 2 views
1

Google 어스에서 위치 표시 ballon의 스타일을 변경하려면 어떻게해야합니까? kml 데이터가 아닌 것인가? 예를 들어 국경을 돌고 싶습니다. 저는 예제를 사용하지만 항상 넣은 스타일 주위에 빈 테두리를 봅니다.CSS Ballon google earth

자바 스크립트 코드 :

var ge=null; 
var html="<div class='ews_infobox'> Prueba </div>"; 
var inicio={"latitud": 43.3667, "longitud": -5.8333,"zoom": 5000.0}; 


function initCB(pluginInstance) { 
ge = pluginInstance; 
ge.getWindow().setVisibility(true); 
ge.getNavigationControl().setVisibility(ge.VISIBILITY_SHOW); 

    //Crea un placemark. 
    var placemark = ge.createPlacemark(''); 

    //Define icono. 
    var icon = ge.createIcon(''); 
    icon.setHref('images/home2.png'); 

    // Placemark en Oviedo. 
    var point = ge.createPoint(''); 
    point.setLatitude(43.3667); 
    point.setLongitude(-5.8333); 
    placemark.setGeometry(point); 

    // Add the placemark to Earth. 
    ge.getFeatures().appendChild(placemark); 

    //Crea la vista (LookAct). 
    ge.getOptions().setFlyToSpeed(.2); 
    var lookAt = ge.createLookAt(''); 

    // Pone las posiciones. 
    lookAt.setLatitude(inicio.latitud); 
    lookAt.setLongitude(inicio.longitud); 
    lookAt.setRange(inicio.zoom); 

    // Actualiza vista de google Earth. 
    ge.getView().setAbstractView(lookAt); 


    eventoMarca(placemark); 
} 

function eventoMarca(placemark){ 


google.earth.addEventListener(placemark, 'click', function(event) { 


    var balloon = ge.createHtmlDivBalloon(''); 
     balloon.setFeature(placemark); 
     var div = document.createElement('DIV'); 
     div.innerHTML = html; 
     balloon.setContentDiv(div); 
     ge.setBalloon(balloon); 

    }); 

} 

스타일의 CSS :

.ews_infobox 
{ 
padding:15px; 
color:#000; 
background:#f3961c; 
background:-webkit-gradient(linear, 0 0, 0 100%, from(#f9d835), to(#f3961c)); 
background:-moz-linear-gradient(#f9d835, #f3961c); 
background:-o-linear-gradient(#f9d835, #f3961c); 
background:linear-gradient(#f9d835, #f3961c); 
-webkit-border-radius:10px; 
-moz-border-radius:10px; 
border-radius:10px; 
width: 80px; 
height: 40px; 

} 

그리고 풍선은 다음과 같습니다 ballon

+0

지금까지 가지고있는 JSFiddle을 만들 수 있습니까? –

+0

예, [link] (http://jsfiddle.net/sandritascs/7mrBU/4/) – sandrita

+0

Google 어스를 사용해야합니까? 브라우저 플러그인이 필요하며 Linux에서는 전혀 지원되지 않습니다. 대부분의 목적을 위해 (idk 너의 것), Google지도 API가 더 나은 선택 일 수 있으며 쉽게 맞춤 설정할 수 있습니다. –

답변

0

는 AFAIK이 작업을 수행하는 모든 방법이 없습니다. 콘텐츠의 스타일 만 변경할 수 있지만 풍선 자체는 변경할 수 없습니다.

'풍선 프레임'이 실제로 DOM의 일부가 아니기 때문에 이것은 플러그인에서 기본적으로 렌더링됩니다.

+0

고마워요 ^^ – sandrita