Я использую Java API для KML, чтобы создать файл KML с несколькими метками, каждый с всплывающим описанием. Во всплывающем окне я хотел бы сослаться на мой REST API, который я использую на localhost.
Я пытался использовать простой href
, который напрямую вызывает API, но при нажатии открывает новое окно, чего я не хочу.
Затем я попытался изменить ссылку на button
, которая должна запускать функцию JavaScript callAPI
для вызова API без открытия нового окна. Вот мой код Java:
final Kml kml = new Kml();
Document doc = kml.createAndSetDocument()
.withName("My KML File")
.withOpen(true);
BalloonStyle bstyle = doc.createAndAddStyle()
.withId("balloonstyle")
.createAndSetBalloonStyle()
.withId("ID")
.withText("<font face='Courier' size='3'>$[description]</font><br/>");
Folder folder = doc.createAndAddFolder().withName("Placemark Points").withOpen(true);
Placemark placemark = folder.createAndAddPlacemark()
.withName("My Placemark")
.withVisibility(true)
.withOpen(true)
.withStyleUrl("#balloonstyle");
placemark.createAndSetPoint()
.withExtrude(false)
.withAltitudeMode(AltitudeMode.CLAMP_TO_GROUND)
.addToCoordinates(0.0, 0.0); // Using 0,0 as placeholder
placemark.setDescription(
"<button type=\"button\" onclick=\"callAPI()\"/>Call API</button>" +
"<script type=\"text/javascript\"> " +
"function callAPI() { " +
"var xhttp = new XMLHttpRequest(); " +
"xhttp.open('GET', '" + apiUrl + "', true); " + // apiURL = url to my REST API
"xhttp.send(); }" +
"</script>"
);
Sidenote: я видел примеры JAK, включающие в себя теги <![CDATA[...]]>
вокруг описания, но это вызывало некоторые проблемы с форматированием и не казалось необходимым (когда я импортировал полученный файл KML в Google Earth, HTML-код в описание работает без тегов / сами теги появляются автоматически). Я также попытался вставить метки обратно, но это не помогло решить проблему.
Вот пример файла KML, который получается в результате выполнения моего кода (я заменил свой URL на поддельный URL API https://jsonplaceholder.typicode.com/todos/1 в качестве заполнителя):
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<ns2:kml xmlns:gx="http://www.google.com/kml/ext/2.2" xmlns:ns2="http://www.opengis.net/kml/2.2" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:xal="urn:oasis:names:tc:ciq:xsdschema:xAL:2.0">
<ns2:Document>
<ns2:name>My KML File</ns2:name>
<ns2:open>1</ns2:open>
<ns2:Style id="balloonstyle">
<ns2:BalloonStyle id="ID">
<ns2:text><font face='Courier' size='3'>$[description]</font></ns2:text>
</ns2:BalloonStyle>
</ns2:Style>
<ns2:Folder>
<ns2:name>Placemark -- Points</ns2:name>
<ns2:open>1</ns2:open>
<ns2:Placemark>
<ns2:name>My Placemark</ns2:name>
<ns2:visibility>1</ns2:visibility>
<ns2:open>1</ns2:open>
<ns2:description><button type="button" onclick="callAPI()"/>Call API</button><script type="text/javascript"> function callAPI() { var xhttp = new XMLHttpRequest(); xhttp.open('GET', 'https://jsonplaceholder.typicode.com/todos/1', true); xhttp.send(); }</script></ns2:description>
<ns2:styleUrl>#balloonstyle</ns2:styleUrl>
<ns2:Point>
<ns2:extrude>0</ns2:extrude>
<ns2:altitudeMode>clampToGround</ns2:altitudeMode>
<ns2:coordinates>0.0,0.0</ns2:coordinates>
</ns2:Point>
</ns2:Placemark>
</ns2:Folder>
</ns2:Document>
</ns2:kml>
Когда я пытаюсь импортировать это в Google Планета Земля в Chrome, я получаю эту ошибку, когда нажимаю кнопку:
callAPI не определен в HTMLButtonElement.onclick
Есть ли что-то, что я делаю неправильно в форматировании описания, поэтому он не может сказать, что я создал функцию callAPI
?
Или JavaScript в окне описания метки не работает в Google Планета Земля?