ESRI point clustering

mxmx — Thu, 01 May 2014 10:08:18 GMT
Hi experts ,

I have a set of coordinates returned from my database using ajax. There are alot of same coordinates which caused the graphics to
overlap each other, and i am unable to click on the infotemplate.

I am trying to use cluster map layer to do this.

Facing some error. Please help me along.. thanks..
This is the codes.
/*--------------------------------------------@AUTHOR- MINGXUAN-----------------------------------------------*/
var TwitterStationLocation = [];
var PointGraphic2;
var twitterheatlocation = [];
function PinPointForTwitter(map, control) {
  



    var Grid_Table = document.getElementById('CheckinTable');
    var chkBox = document.getElementById("CHECKTWITTER");
  var twitterPlaces = [];
    if(chkBox.checked)
    {
 localStorage.setItem("CHECKTWITTER", "checked");
        map.infoWindow.hide();
        map.infoWindow.resize(410, 160);

        

        var xmlhttp = new XMLHttpRequest();
        xmlhttp.open("GET", "WebService.asmx/getTwitter", false);
        xmlhttp.send();
        if (document.getElementById("btnHeatMap1")) {
            //this means it is unchecked, make sure heatmap is hidden
            if (heatLayer) {
                heatLayer.clearData();
            }
            // map.removeLayer(heatLayer);
        }
      
                var xmlDoc = xmlhttp.responseXML;
                var xmlalbums = xmlDoc.documentElement.getElementsByTagName("Twitter");
                $.each(xmlalbums, function () {
                    varname = $(this).find("id").text();
                    foodstation = $(this).find("hashtag").text();
                    coordX = $(this).find("X").text();
                    coordY = $(this).find("Y").text();
                    placename = $(this).find("placename").text();
                    message = $(this).find("message").text();
                    retweetcount = $(this).find("retweetcount").text();
                    favcount = $(this).find("favcount").text();
                    platform = $(this).find("platform").text();
                    datepost = $(this).find("dt").text();
                    address = $(this).find("Address").text();
                    var point = new esri.geometry.Point({ "x": coordX, "y": coordY, "spatialReference": { "wkid": 3414} });
                    var symbol = new esri.symbol.PictureMarkerSymbol('Images/icons/Twitter_logo_blue.png', 25, 25);

                    //      var symbol = new esri.symbol.TextSymbol("hastag" + foodstation);

                    var PointGraphic = new esri.Graphic(point, symbol);
                    PointGraphic2 = new esri.Graphic(point, null);
                    OneMap.map.graphics.add(PointGraphic);
                    clusterLayer = new modules.ClusterLayer({

        "data": point,
        "distance": 100,
        "id": "clusters",
        "labelColor": "#fff",
        "labelOffset": 10,
        "resolution": map.extent.getWidth() / map.width,
        "singleColor": "#888",
        "singleTemplate": popupTemplate
    });

    var defaultSym = new esri.symbol.SimpleMarkerSymbol().setSize(4);
    var renderer = new esri.renderer.ClassBreaksRenderer(defaultSym, "clusterCount");

    var picBaseUrl = "http://static.arcgis.com/images/Symbols/Shapes/";
    var blue = new esri.symbol.PictureMarkerSymbol(picBaseUrl + "BluePin1LargeB.png", 32, 32).setOffset(0, 15);
    var green = new esri.symbol.PictureMarkerSymbol(picBaseUrl + "GreenPin1LargeB.png", 64, 64).setOffset(0, 15);
    var red = new esri.symbol.PictureMarkerSymbol(picBaseUrl + "RedPin1LargeB.png", 72, 72).setOffset(0, 15);
    renderer.addBreak(0, 2, blue);
    renderer.addBreak(2, 200, green);
    renderer.addBreak(200, 1001, red);

    clusterLayer.setRenderer(renderer);
    map.addLayer(clusterLayer);
                    twitterheatlocation.push(heatmapGraphics.add(PointGraphic2));
                    var infoTemplate = new esri.InfoTemplate();
                    infoTemplate.setTitle("<img src = 'Images/icons/Twitter_logo_blue.png' style='width:25px; height:25px;' />   " + address);
                    infoTemplate.setContent("<b>hashtag: </b>" + "#" + foodstation + "<br/>"
                  + "<b>message: </b>" + message + "<br/>"
                 + "<b>retweet count: </b>" + retweetcount + "<br/>"
                  + "<b>favorite count: </b>" + favcount + "<br/>"
                   + "<b>platform: </b>" + platform + "<br/>"
                   + "<b>datepost: </b>" + datepost + "<br/>"
                  );

                    var graphic = PointGraphic;
                    graphic.setSymbol(symbol);
                    graphic.setInfoTemplate(infoTemplate);

                    TwitterStationLocation.push(OneMap.map.graphics.add(graphic));
                    addClusters();
                });
      map.on("click", cleanUp);
    // close the info window when esc is pressed
    map.on("key-down", function (e) {
        if (e.keyCode === 27) {
            cleanUp();
        }
    });

                if (document.getElementById("btnHeatMap2")) {
                    //means the heatmap button is checked, add to map
                     if (heatLayer) {
                         heatLayer.setData(heatmapGraphics.graphics);
                         heatmapGraphics.add(PointGraphic);
                    }
                }
            }
             else {



                 localStorage.setItem("CHECKTWITTER", "unchecked"); //remove graphics
                 for (var a = twitterheatlocation.length - 1; a >= 0; a--) {
                     heatmapGraphics.remove(twitterheatlocation);


                 }
     for(var i = TwitterStationLocation.length - 1; i>=0; i--) {
         map.graphics.remove(TwitterStationLocation);

        
     }
  
     }
     
}
it's causing alot of error. Please help..
Re: ESRI point clustering

mxmx — Thu, 01 May 2014 15:16:33 GMT
anyone? 😞 😞 😞
topic ESRI point clustering in ArcGIS JavaScript Maps SDK Questions

ESRI point clustering

Re: ESRI point clustering
