Render all user on map

Prerequisite

Follow setup tutorial to initialize mapClass, client and usersClient.

Fetch user placeline

var token = "sk_55fc65eb64c0b10300c54ff79ea3f6ef22981793";
var client = htClient.initClient(token);
var mapClass = new htMaps.HtMapClass('google');

var usersClient = htClient.usersClientFactory();
usersClient.listAll.setActive();
var usersMarkers = usersClient.listAll.data$; //observable emitting latest data every 10 secs.

mapClass.usersCluster.setData$(usersClient.listAll.dataArray$)

//Following step is optional. Use this to check with placeline userData is being emitted correctly.
usersMarkers.subscribe(function(users) {
  //users 
});
  1. usersClient exposes markers property which contains bunch of functions related to fetching all current users data. Use setActive(active: boolean = true) function to start fetching all current user data.
  2. marker property exposes data$. This is an observable which emits all current users values every 10 seconds.
  3. Pass dataArray$ prop of listAll client as setData$ function of mapClass.usersCluster. This will connect the data fetched by the client to map.
  4. (optional) Subscribe to the data$ to get updated users data.

    [info] References of library

    Read the references of ht-client and ht-maps, to learn more about the internal apis

results matching ""

    No results matching ""