console 命令行工具 X clear
console
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>Loading SuperMap WMS in ArcGIS API for JavaScript</title>
    <link rel="stylesheet" href="https://js.arcgis.com/4.6/esri/css/main.css">
    <style>
        html, body, #viewDiv {
            padding: 0;
            margin: 0;
            height: 100%;
            width: 100%;
        }
    </style>
    <script src="https://js.arcgis.com/4.6/"></script>
    <script>
require([
  "esri/Map",
  "esri/views/MapView",
  "esri/geometry/Extent",
  "esri/layers/GraphicsLayer",
  "esri/Graphic",
  "esri/geometry/geometryEngine",
  "esri/geometry/Polygon",
  "esri/symbols/SimpleFillSymbol",
  "esri/Color"
], function(Map, MapView,Extent, GraphicsLayer, Graphic, geometryEngine, Polygon, SimpleFillSymbol, Color) {

  var map = new Map({
    basemap: "streets"
  });
  
  var view = new MapView({
    container: "viewDiv",
    map: map,
    center: [-70, 25],
    zoom: 4
  });
  view.when(function() {
  // 在视图加载完成后执行以下操作
  var viewExtent = view.extent;
  if (viewExtent) {
    // 执行您的操作，如计算差异、添加图形等
    var graphicsLayer = new GraphicsLayer();
  map.add(graphicsLayer);

  var polygon = new Polygon({
    rings: [[-64.78, 32.3], [-66.07, 18.45], [-80.21, 25.78], [-64.78, 32.3]]
  });


  var polygon2 = new Polygon({
    rings: [  [-180, 90], // 左上角
    [180, 90], // 右上角
    [180, -90], // 右下角
    [-180, -90], // 左下角
    [-180, 90] // 闭合
    ]
  });

  console.log("111",map.extent,view.extent,polygon)
  var outsidePolygon = geometryEngine.difference(polygon2, polygon);
  var outsideGraphic = new Graphic({
    geometry: outsidePolygon,
    symbol:  {
          type: "simple-fill", // autocasts as new SimpleFillSymbol()
          color: [0, 0, 0, 0.8],
          outline: {
            // autocasts as new SimpleLineSymbol()
            color: [255, 255, 255,0.7],
            width: 1
          }
        }
  });

  graphicsLayer.add(outsideGraphic);
  const fillSymbol = {
          type: "simple-fill", // autocasts as new SimpleFillSymbol()
          color: [227, 139, 79, 0.8],
          outline: {
            // autocasts as new SimpleLineSymbol()
            color: [255, 255, 255],
            width: 1
          }
        };

  var graphic = new Graphic({
    geometry: polygon,
    symbol: fillSymbol
  });

  graphicsLayer.add(graphic);
  } else {
    console.log("View extent is null.");
  }





});



});
    </script>
</head>
<body>
    <div id="viewDiv"></div>
</body>
</html>