来自不同来源的两个相同的 KML 文件，一个可以显示，另一个不能答案

【问题标题】：two same KML files from different sources, one can display, the other can't来自不同来源的两个相同的 KML 文件，一个可以显示，另一个不能
【发布时间】：2017-10-31 04:34:03
【问题描述】：

我需要在我的 react 应用程序上使用 KML 层并尝试来自 https://tomchentw.github.io/react-google-maps/#kmllayer (https://developers.google.com/maps/documentation/javascript/examples/layer-kml) 的示例。

const { compose, withProps } = require("recompose");
const {
  withScriptjs,
  withGoogleMap,
  GoogleMap,
  KmlLayer,
} = require("../index");

const MapWithAKmlLayer = compose(
  withProps({
    googleMapURL: "https://maps.googleapis.com/maps/api/js?key=AIzaSyC4R6AN7SmujjPUIGKdyao2Kqitzr1kiRg&v=3.exp&libraries=geometry,drawing,places",
    loadingElement: <div style={{ height: `100%` }} />,
    containerElement: <div style={{ height: `400px` }} />,
    mapElement: <div style={{ height: `100%` }} />,
  }),
  withScriptjs,
  withGoogleMap
)(props =>
  <GoogleMap
    defaultZoom={9}
    defaultCenter={{ lat: 41.9, lng: -87.624 }}
  >
    <KmlLayer
      url="http://googlemaps.github.io/js-v2-samples/ggeoxml/cta.kml"
      options={{ preserveViewport: true }}
    />
  </GoogleMap>
);

<MapWithAKmlLayer />

该示例运行良好，地图上显示了一些线条。但是，问题出现在 URL 上。因为我需要使用我的 KML 文件（我自己的路径），所以我将 cta.kml 文件保存在我的 localhost 服务器上的 assets 文件夹的根目录中。它无法显示我使用节点作为后端应用程序的任何行。

app.use(express.static(`${__dirname}/assets`));

例如，如果我输入http://localhost:3000/cta.kml，则文件将直接下载，就像示例中输入http://googlemaps.github.io/js-v2-samples/ggeoxml/cta.kml一样。但是，如果我将“http://localhost:3000/cta.kml”作为 URL 放在 KmlLayer 的 URL 属性上，则谷歌地图无法显示任何线条。我不知道为什么，因为两个文件完全相同。我还尝试了其他示例 URL，并且发生了同样的事情。例如本例给出的KML文件URL（https://developers.google.com/maps/documentation/javascript/kml）

【问题讨论】：

标签： javascript node.js google-maps

【解决方案1】：

答案在这里：ng-map only opens remote KML file but not local file?。 “将 KML 文件放在 Google 服务器可以访问的公共服务器上，因为 KML 的解析和渲染是由 Google 服务器完成的。”

【讨论】：