I want to display a marker whenever I receive websocket message but with this code I can only display the first point and then when I receive the second message I can't display it.
socket.onmessage = function (e) {
var message = e.data;
alert("Message is received...");
console.log(message);
featureCollection.layerDefinition.drawingInfo.renderer.symbol.angle = course;
featureCollection.layerDefinition.drawingInfo.renderer.symbol.url = alpha;
featureLayer = new FeatureLayer(featureCollection, {
id: 'Tracking',
infoTemplate: popupTemplate
});
//associate the features with the popup on click
featureLayer.on("click", function (evt) {
map.infoWindow.setFeatures([evt.graphic]);
});
var location = {
latitude: lat,
longitude: Lon
};
point = new Point({
longitude: 0,
latitude: 0
});
point.longitude = location.longitude;
point.latitude = location.latitude;
console.log(point);
graphic = new Graphic({
geometry: point
});
var contentString = '<div id="content">' +
'<div id="siteNotice">' +
'</div>' +
'<h1 id="firstHeading" class="firstHeading"> Info </h1>' +
'<div id="bodyContent">' +
'<p><b> Date : </b> ' + times +
'<p><b> Vitesse : </b> ' + speed + ' <b> km/h </b> ' +
'<p><b> Distance : </b> ' + distance + ' <b> m </b> ' +
'<p><b> Altitude : </b> ' + alt + ' <b> m </b> ' +
'<p><b> Direction : </b> ' + course + ' <b> ° </b> ' +
'<p><b> Status : </b> ' + infostatus +
'</div>' +
'</div>';
attr["description"] = contentString;
attr["title"] = "Device :0906050400030201";
graphic.setAttributes(attr);
features.push(graphic);
console.log(features);
map.addLayers([featureLayer]);
};
map.on("layers-add-result", function (results) {
featureLayer.applyEdits(features, features, null);
});
How can I fix this code to display multipoints ?