链接到使用 Java API for KML 在 KML 的描述气球中调用 REST API？

Question

我正在使用 Java API for KML 创建一个包含多个地标的 KML 文件，每个地标都有一个描述弹出窗口。在弹出窗口中，我想链接到我在 localhost 上运行的 REST API。

我尝试使用直接调用 API 的简单 href，但点击后会打开一个新窗口，我不希望发生这种情况。

然后，我尝试将链接更改为 button，这应该会触发 callAPI JavaScript 函数来调用 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>"
);

旁注：我看到 JAK 示例涉及在描述周围包含 <![CDATA[...]]> 标记，但这会导致一些格式问题并且似乎没有必要（当我将生成的 KML 文件导入 Google 地球时，HTML描述在没有标签的情况下有效/标签本身似乎自动出现）。我也试过把标签放回去，但没有解决问题。

这是运行我的代码产生的示例 KML 文件（我已将我的 URL 替换为假 API URL 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>&lt;font face='Courier' size='3'&gt;$[description]&lt;/font&gt;</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>&lt;button type=&quot;button&quot; onclick=&quot;callAPI()&quot;/&gt;Call API&lt;/button&gt;&lt;script type=&quot;text/javascript&quot;&gt; function callAPI() { var xhttp = new XMLHttpRequest(); xhttp.open('GET', 'https://jsonplaceholder.typicode.com/todos/1', true); xhttp.send(); }&lt;/script&gt;</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>

当我尝试将其导入 Chrome 上的 Google 地球时，单击按钮时出现此错误：

callAPI 未在 HTMLButtonElement.onclick 中定义

在描述的格式中我做错了什么，因此无法判断我创建了callAPI 函数吗？

或者地标描述气球中的 JavaScript 在 Google 地球上不起作用？

Answer 1

大多数 JavaScript 都应该在 Google 地球中的气球中运行……无论是在地球专业版（v7.x，桌面应用程序）还是新的网页和移动版地球 (v9.x) 中。在 Google 地球专业版中加载时，您的 KML 和气球代码是否有效？

由于网页版 Earth 在浏览器中运行，因此在加载您可能遇到的外部资源（图像文件等）方面存在更多限制，包括正确设置 CORS 标头的要求。确保您的本地服务器设置为允许 CORS 请求。如果这没有帮助，您可以分享一个示例 KML 吗？