Question

我需要在我的反应应用中使用KML图层并尝试https://tomchentw.github.io/react-google-maps/#kmllayer（https://developers.google.com/maps/documentation/javascript/examples/layer-kml）中的示例。

＆＃13;

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 />

＆＃13;

＆＃13; 该示例工作正常，一些行显示在地图上。但是，URL上会出现此问题。因为我需要使用我的KML文件（我自己的路径），所以我将cta.kml文件保存在我的localhost服务器上，在assets文件夹的根目录下。它不能显示我使用node作为后端应用程序的任何行。

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

例如，如果我输入http://localhost:3000/cta.kml，则会直接下载该文件，就像输入示例中给出的http://googlemaps.github.io/js-v2-samples/ggeoxml/cta.kml一样。但是，如果我把＆＃39; http://localhost:3000/cta.kml＆＃39;作为KmlLayer网址属性的网址，Google地图无法显示任何行。我不知道为什么会这样，因为两个文件完全相同。我还尝试了其他示例网址，同样的事情发生了。例如，此示例（https://developers.google.com/maps/documentation/javascript/kml）

给出的KML文件URL

Answer 1

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

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

1 个答案: