CODEWITHSUNDEEP
javascriptarcgis-js-api
ignasidp
ignasidp

Reputation: 25

How can I get rid of a console error in javascript

trying to add a map showing a marker on a an address. So I first use the Locator to get the address long and lat, and then I create the map and the view centered in the address coordinates. Then I draw the point and a polygon of a determined area to check if the address is inside the area. It works fine but it thows this message in console: "Framebuffer is incomplete!" Here is the code:

<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
<title>ArcGIS JavaScript show address in map</title>

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

 <script>

 require([
  "esri/Map",
  "esri/views/MapView",
  "esri/tasks/Locator",
  "esri/Graphic",
  "dojo/domReady!"
  ], function(Map, MapView, Locator, Graphic) {


   var locatorTask = new Locator({
     url: "https://geocode.arcgis.com/arcgis/rest/services/World/GeocodeServer"
   });


  let addressParams1 = {
    Address: "carrer Girona 9",
    City: "Tarragona",
    Postcode: "43003",
    State: "Tarragona", 
    Country: "Spain"
  }

  locatorTask.addressToLocations({address:addressParams1})
    .then(function(response){
    let x = response[0].location.x;
    let y = response[0].location.y;
    var addr = response[0].address;
    document.getElementById("response").innerHTML = addr;

    var map = new Map({
      basemap: "streets"
    });

    var view = new MapView({
      container: "viewDiv",
      map: map,
      center: [x, y], // longitude, latitude
      zoom: 17
    });

    drawPoint(x, y, view);

    let rings = [
[1.2479, 41.1179],
[1.257, 41.1135],
[1.2576, 41.11367],
[1.258, 41.11386],
[1.25812, 41.114],
[1.25812, 41.1141],
[1.258, 41.11418],
[1.2577, 41.1144],
[1.25762, 41.1148],
[1.25759, 41.1152],
[1.2575, 41.11535],
[1.257, 41.1155],
[1.25645, 41.11576],
[1.25675, 41.11615],
[1.2569, 41.1163],
[1.25758, 41.11659],
[1.2546, 41.11806],
[1.255, 41.11843],
[1.25367, 41.11944],
[1.25115, 41.1179],
[1.24857, 41.11854],
[1.2479, 41.1179]
];

   drawPolygon(rings, view);

   })

   .catch(function(error) {console.error(error)});


  function drawPolygon(rings, view){
  let pl = { 
    type: "polygon",
    rings: rings
  };
  let sl = {
    type: "simple-fill",
  //     style: "none",
    color: [0, 0, 255, 0.1],
    outline: {
      width: 5,
      join: "round",
      style: "short-dot", //solid
      color: "darkblue"
    }
  };
 let graphpl = new Graphic({geometry: pl, symbol: sl});
 view.graphics.add(graphpl);
 }    

 function drawPoint(x, y, view){
 //Draw point
   let p = {
     type: "point",
     longitude: x,
     latitude: y
   };

   let s = {
     type: "simple-marker",
     color: [255, 0, 5, 0.6],
     size: 9 
   };

   let graphic = new Graphic({geometry: p, symbol: s});
   view.graphics.add(graphic);
   }

   });
</script>
</head>
<body>
<div id="viewDiv" style="width:500px; height:400px">
</div>
<div id="response">
</div>
</body>
</html>

What can be the origin of this message? Do I have to use a Layer? Thanks in advance.

Upvotes: 1

Views: 360

Answers (1)

AliWieckowicz
AliWieckowicz

Reputation: 557

That's a webGL error. ESRI uses webGL for rendering at 4.x. I can't reproduce the error so I would guess that it might be lifecycle dependent and my client executes faster/slower.

You could try executing glGetError() in the console if you can identify when webGL is in scope and set a breakpoint.

I would also try ensuring that the mapView is fully initaied by executing other code from within the mapView .when callback function. it's possibly webGL is trying to bind to something that hasn't been instantiated yet.

.when() method on the MapView instance can be called to execute processes that may only run after the map has loaded.

https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html

Upvotes: 1

Related Questions