Hi everyone,I am working on a project to cluster points around a main cluster and have the points tied to the main event with a line. Also the points have to be arranged where they are in real life. Here is the code sample. I need to bypass the mathematically derived points function and have the flare points use the moused over feature in the json rest service instead. Just a note, sorry the code comes in soo funny, 10,000 character limit.
//this function may not be needed exactly as is below. somehow, the attributes need to be mapped to the points.
setFeatures: function(features) {
this._features = [];
var wkid = features[0].geometry.spatialReference.wkid;
if (wkid != 102100) {
if (wkid == 4326 || wkid == 4269 || wkid == 4267) {
dojo.forEach(features, function(feature) {
if (this._map.spatialReference.wkid == 102100) {
point = esri.geometry.geographicToWebMercator(feature.geometry);
} else {
point = feature.geometry;
}
point.attributes = feature.attributes;
this._features.push(point);
}, this);
} else {
throw 'Input Spatial Reference Must Be in Either WKID: 102110 or WKID: 4326';
return;
}
} else {
dojo.forEach(features, function(feature) {
point = feature.geometry;
point.attributes = feature.attributes;
this._features.push(point);
}, this);
}
},
handleMouseOver: function(evt) {
var graphic = evt.graphic;
if (graphic.symbol.type == 'textsymbol' || graphic.symbol.type == 'simplelinesymbol') {
if (graphic.attributes) {
if (graphic.attributes.baseGraphic && graphic.attributes.baseGraphic.task) {
graphic.attributes.baseGraphic.task.cancel();
}
}
return;
}
if (graphic.attributes.isCluster) { //cluster mouse over
if (graphic.attributes.clustered) {
if (graphic.task) {
graphic.task.cancel();
}
return;
}
} else { //single marker or cluster flare mouse over
if (graphic.attributes.baseGraphic) { //cluster flare
graphic.attributes.baseGraphic.task.cancel();
}
this.showInfoWindow(graphic);
return;
}
graphic.clusterGraphics = [];
//polyline used to "tie" flare to cluster
//set up initially with the center pt of the cluster as the first point and a dummy point @ 0,0 for a placeholder
var line = new esri.geometry.Polyline(map.spatialReference);
line.addPath([graphic.geometry, new esri.geometry.Point(0, 0)]);
//polyline graphic
var lineGraphic = new esri.Graphic(line, lineSymbol);
//creating a circle to evenly distribute our flare graphics around
if (cSize > 1 && cSize <= this._flareLimit) { //cSize > 1 may not be needed
//takes the number of points (flares) for the cluster
var numPoints = graphic.attributes.clusterSize;
//takes the pixel distance from the center of the graphic to flare out the graphics
var bufferDistance = this.getPixelDistanceFromCenter(graphic.geometry);
//center of cluster graphic
var centerPoint = graphic.geometry;
//variables used to plot points evenly around the cluster
var dblSinus, dblCosinus, x, y, pt, ptGraphic, p, l;
for (var i = 0; i < numPoints; i++) {
dblSinus = Math.sin((Math.PI * 2.0) * (i / numPoints));
dblCosinus = Math.cos((Math.PI * 2.0) * (i / numPoints));
x = centerPoint.x + bufferDistance * dblCosinus;
y = centerPoint.y + bufferDistance * dblSinus;
//constructing the flare graphic point
pt = new esri.geometry.Point(x, y, this._map.spatialReference)
ptGraphic = new esri.Graphic(pt, this.symbolBank.single, dojo.mixin(graphic.attributes, { baseGraphic: graphic }), this._infoTemplate);
//try to always bring flare graphic to front of everything else
p = this.add(ptGraphic);
p.getDojoShape().moveToFront();
//reset our 0,0 placeholder point in line to the actual point of the recently created flare graphic
line.setPoint(0, 1, pt);
lineGraphic = new esri.Graphic(line, lineSymbol, { baseGraphic: graphic });
//try to always have connector line behind everything else
l = this.add(lineGraphic);
l.getDojoShape().moveToBack();
//store flare graphic and connector graphic
graphic.clusterGraphics.push(p);
graphic.clusterGraphics.push(l);
}
//set "clustered" flag
graphic.attributes.clustered = true;
}
}
