gis api 跨域啦?

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
  <title>RouteTask - 4.6</title>
  <style>
    html,
    body,
    #viewDiv {
      padding: 0;
      margin: 0;
      height: 100%;
      width: 100%;
    }

    #paneDiv {
      position: absolute;
      top: 10px;
      left: 62px;
      padding: 0 12px 0 12px;
      background-color: rgba(0, 0, 0, 0.5);
      color: white;
    }
  </style>

  <link rel="stylesheet" href="https://js.arcgis.com/4.6/esri/css/main.css">
  <script src="https://js.arcgis.com/4.6/"></script>

  <script>
    require([
      "esri/Map",
      "esri/views/MapView",
      "esri/Graphic",
      "esri/layers/GraphicsLayer",
      "esri/tasks/RouteTask",
      "esri/tasks/support/RouteParameters",
      "esri/tasks/support/FeatureSet",
      "esri/core/urlUtils",
      "dojo/on",
      "dojo/domReady!"
    ], function(
      Map, MapView, Graphic, GraphicsLayer, RouteTask, RouteParameters,
      FeatureSet, urlUtils, on
    ) {

      // Proxy the route requests to avoid prompt for log in
      urlUtils.addProxyRule({
        urlPrefix: "route.arcgis.com",
        proxyUrl: "/sproxy/"
      });

      // Point the URL to a valid route service
      var routeTask = new RouteTask({
        url: "https://route.arcgis.com/arcgis/rest/services/World/Route/NAServer/Route_World"
      });

      // The stops and route result will be stored in this layer
      var routeLyr = new GraphicsLayer();

      // Setup the route parameters
      var routeParams = new RouteParameters({
        stops: new FeatureSet(),
        outSpatialReference: { // autocasts as new SpatialReference()
          wkid: 3857
        }
      });

      // Define the symbology used to display the stops
      var stopSymbol = {
        type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
        style: "cross",
        size: 15,
        outline: { // autocasts as new SimpleLineSymbol()
          width: 4
        }
      };

      // Define the symbology used to display the route
      var routeSymbol = {
        type: "simple-line", // autocasts as SimpleLineSymbol()
        color: [0, 0, 255, 0.5],
        width: 5
      };

      var map = new Map({
        basemap: "streets",
        layers: [routeLyr] // Add the route layer to the map
      });
      var view = new MapView({
        container: "viewDiv", // Reference to the scene div created in step 5
        map: map, // Reference to the map object created before the scene
        center: [-117.195, 34.057],
        zoom: 14
      });

      // Adds a graphic when the user clicks the map. If 2 or more points exist, route is solved.
      on(view, "click", addStop);

      function addStop(event) {
        // Add a point at the location of the map click
        var stop = new Graphic({
          geometry: event.mapPoint,
          symbol: stopSymbol
        });
        routeLyr.add(stop);

        // Execute the route task if 2 or more stops are input
        routeParams.stops.features.push(stop);
        if (routeParams.stops.features.length >= 2) {
          routeTask.solve(routeParams).then(showRoute);
        }
      }
      // Adds the solved route to the map as a graphic
      function showRoute(data) {
        var routeResult = data.routeResults[0].route;
        routeResult.symbol = routeSymbol;
        routeLyr.add(routeResult);
      }
    });
  </script>
</head>
<body>
  <div id="viewDiv"></div>
  <div id="paneDiv">
    <div>
      <p>Click on the map to add stops to the route. The route from the last stop to
        the newly added stop is calculated. If a stop is not reachable, it is removed
        and the last valid point is set as the starting point.</p>
    </div>
  </div>
</body>
</html>

这是官网找的一个路劲分析的demo  不知怎么不能运行  

控制台打印错误是:

XMLHttpRequest cannot load file:///C:/sproxy/?https://route.arcgis.com/arcgis/rest/services/World/Rout…ibutes%22%3A%7B%7D%7D%5D%2C%22doNotLocateOnRestrictedElements%22%3Atrue%7D. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.

很难受 

猜你喜欢

转载自blog.csdn.net/qq_36375770/article/details/79990404
GIS