Here API clustering error: "addLayer is not defined"

Question

I am try to use clastering in my aplication but I am get a error addLayer is not defined".

I have no Idea how to resolve this issue.

I just copy and paste this sample function from Here API samples api clusters

And I'm passing lat and lng, to the function but addLayer is undefined.

I have the map object, but the addLayer is undefined.

function startClustering(map, data) {
  // First we need to create an array of DataPoint objects,
  // for the ClusterProvider
  var dataPoints = data.map(function(item) {
    return new H.clustering.DataPoint(item.latitude, item.longitude);
  });

  // Create a clustering provider with custom options for clusterizing the input
  var clusteredDataProvider = new H.clustering.Provider(dataPoints, {
    clusteringOptions: {
      // Maximum radius of the neighbourhood
      eps: 32,
      // minimum weight of points required to form a cluster
      minWeight: 2
    }
  });

  // Create a layer tha will consume objects from our clustering provider
  var clusteringLayer = new H.map.layer.ObjectLayer(clusteredDataProvider);

  // To make objects from clustering provder visible,
  // we need to add our layer to the map

  map.addLayer(clusteringLayer);

}

And I'm passing lat and lng, to the function but addLayer is undefined.

I have the map object, bust does not exist addLayer.

I'm embed the script

<script type="text/javascript" src="https://js.api.here.com/v3/3.0/mapsjs-clustering.js"></script>

on my index.

I don't know how to resolve this issue.

If someone knows how to resolve I'm glad to listen

EDIT: Additional code per comment request:

function addMarkerToCameraGroup(map, coordinate, html) { // add and remove markers
  document.querySelector(".camera-box").addEventListener("click", function() {
    if (document.getElementsByClassName("camera-marker-position")[0] === undefined) {
      map.addObject(cameraMarker);
      self.startClustering(map, coordinate);
    } else {
      map.removeAll();
    }
  });
}

What is the `map` argument that you're passing? Better yet, can you just include the code where you call this function? Sounds like you might be passing in the wrong type. From [the documentation](https://developer.here.com/documentation/maps/topics_api/h-map.html), it looks like `addLayer` would require `map` to be of type `H.map`. — Tyler Roper, Aug 14 '18 at 18:20
I am calling the function startClustering(map, cords) from my function addDomMarker(map) and pass the map as argument — João Fagner, Aug 14 '18 at 18:31
That is my code `function addMarkerToCameraGroup(map, coordinate, html) { // add and remove markers document.querySelector(".camera-box").addEventListener("click", function(){ if(document.getElementsByClassName("camera-marker-position")[0] === undefined) { //map.addObject(cameraMarker); self.startClustering(map, coordinate); } else { map.removeAll(); } }); }` — João Fagner, Aug 14 '18 at 18:36
The code you've provided still does not explicitly reveal what `map` is One of the the methods you're calling (`map.addObject()`) is listed in the documentation for `H.map`, however the other (`removeAll()`) is *not*. Please post the code where you first declare `map`. — Tyler Roper, Aug 14 '18 at 19:03
Sorry, I have ` map = new H.Map(document.getElementById('map'), defaultLayers.normal.map, { center: { lat: -19.9211375, lng: -43.9490617, }, zoom: 6 }); ` — João Fagner, Aug 14 '18 at 20:03

score 0 · Answer 1 · answered Aug 19 '18 at 01:13

You asked this question a second time as: "Try to create a cluster unsing a sample but addLayer got undefinied" which doesn't include some of the details in this question. Given the additional edit / context you made on this question however, it would seem you are adding an event listener in which map is probably out of scope or not yet defined for visibility inside the anonymous function.

document.querySelector(".camera-box").addEventListener("click", function() {
    if (document.getElementsByClassName("camera-marker-position")[0] === undefined) {
      map.addObject(cameraMarker);
      self.startClustering(map, coordinate);
    } else {
      map.removeAll();
    }
  });

You could do a typing check to see if map has been defined when the click event occurs and/or confirm whether it is an H.map. Without seeing the full listing, it may also be the case that you have not made map a global variable but instead declared it somewhere else in the page initialization so is out of scope when the click event is fired.

You can check JavaScript callback scope for details on closures where you could provide the map to the event when declaring the function. For more general information: JavaScript HTML DOM EventListener

Yes the problem is the scope, send the current scope to the function, but I got another error, referring to scope, return a (return indexOf(a) this) Also without scope context — João Fagner, Aug 20 '18 at 17:29

Here API clustering error: "addLayer is not defined"

1 Answers1

Linked