gmap3 jquery プラグインを使用していますが、少し助けが必要です。
次のような関数を作成しました
function getMarkers() {
$.getJSON("/Location/LocationData", null, function (data) {
var i, items = [];
//loop through values from service
$.each(data, function (key, val) {
lat = val.lat;
lng = val.long;
des = val.desc;
rating = val.rating;
items.push({ lat: val.lat, lng: val.long, data: val.desc });
i++;
});
$('#map_canvas').gmap3(
{ action: 'addMarkers',
radius: 100,
markers: items,
clusters: {
// This style will be used for clusters with more than 0 markers
0: {
content: '<div class="cluster cluster-1">CLUSTER_COUNT</div>',
width: 53,
height: 52
},
// This style will be used for clusters with more than 20 markers
20: {
content: '<div class="cluster cluster-2">CLUSTER_COUNT</div>',
width: 56,
height: 55
},
// This style will be used for clusters with more than 50 markers
50: {
content: '<div class="cluster cluster-3">CLUSTER_COUNT</div>',
width: 66,
height: 65
}
},
events: {
click: function (marker, event, data) {
alert(data);
}
},
callback: function (ref) { // get the cluster reference and save it in global variable
cluster = ref;
}
}
);
//test to see output
// $('<ul/>', {
// 'class': 'my-new-list',
// html: items.join('')
// }).appendTo('#list');
});
}
すべてが期待どおりに機能しますが、クラスターの適用方法を少し変更したいと思います。評価 1 ~ 10 を返す可変の「評価」があります。レーティング数によってクラスタに強さを追加することはできますか?
たとえば、マップ上に 4 つのピンのクラスターがあり、すべてのピンの評価が 5 です。別の 4 つのピンのクラスターがあり、評価は 1 しかありません。
最初のクラスターが 4 + (4*5) を表示するように数式を作成して、4 を表示する代わりに 24 を表示し、2 番目のクラスターが 9 のみを表示するようにすることは可能ですか?