MarkerClustererPlus: установить цвет значка / url независимо от размера

Я строю несколько сотен тысяч точек через MarkerClustererPlus, и я хочу установить группы иконок кластеров (цвет) на основе некоторого внешнего свойства ( не на основе количества представленных маркеров).



Единственный способ, который я могу придумать, чтобы сделать это, - это создать несколько объектов MarkerClusterer и передать другой объект options, но я чувствую, что получу большой удар по производительности, делая это. Есть ли лучший способ?



Маркер Clusterer Plus с различными размерами значков масштабируется по размеру.



Учитывая изображение выше, я хотел бы 139, 24 и 5 должны быть желтыми, а 213, 25, 30 и 2-красными; и если возможно, обновите их стили / параметры с помощью setOptions:
mc.group[0].setOptions({"url": imgPath +lookupThreshold(severity)+ '.svg' });
mc.group[1].setOptions({"url": imgPath +lookupThreshold(severity)+ '.svg' });



P.S. Если кому-то интересно, я настроил lib, чтобы значок кластера масштабировался до его размера† путем предоставления изображения svg и увеличения ширины и высоты в объекте options: 



var mcOptions = {

  "styles": [{

    "height": 19,

    "url": img/map/clusters/",

    "width": 19

  },{

    "height": 24,

    "url": img/map/clusters/",

    "width": 24

  }, {…}]

};

for ( var s = mcOptions.styles.length-1; s >= 0; s-- )

{ mcOptions.styles[s].url += lookupThreshold(severity) + '.svg'; }

// lookupThreshold switches severity and returns a string: red, orange, …


Затем добавил следующее К markerclusterer.js: 



line 275: this.backgroundSize_ = style.backgroundSize || "contain";

line 300: style.push('background-size:' + this.backgroundSize_ + ';');


† работает в Ffx 19.0.2, Chrome 26.x, хромированная Канарейка 28.x, Safari 6.0.2, IE 9.0.8 (но не Opera 12.15).



EDIT кажется, что не так много хитов производительности от создания нескольких экземпляров MarkerClusterer; однако, похоже, что объект properties/options, переданный MC, является общим среди экземпляров MCs.



Решено мне пришлось модифицировать библиотеку MarkerClustererPlus около строки 665, чтобы клонировать opt_options (lib использовал ссылку, которая заставляла все предыдущие opt_options перезаписываться самым новым / последним пройденный).

664   1  

1 ответ:

Получается, что проблема исходила от самого MarkerClustererPlus lib : 

656:  function MarkerClusterer(map, opt_markers, opt_options) {
…
665:    opt_options = opt_options || {};

Строка 665 создает ссылку на существующий объект вместо новой копии. Я не мог использовать MarkerClusterer.prototype.extend из строки 1539 потому что он не делает глубокой копии (и он расширяет только прототип объекта).

Итак, я написал свою собственную функцию глубокого копирования (jsfiddle ), которую я сделал глобально доступной (вместо того, чтобы добавлять ее к прототипам обоих массив и объект):

function deepCopy(obj) {  
  this.cloneArr = function (arr) {
    var newArr = [];
    for ( var i = arr.length-1; i >= 0; i-- ) newArr[i] = this.evalObj( arr[i] );
    return newArr;
  };
  this.cloneObj = function(obj) {
    var newObj = {};
    for ( var prop in obj ) newObj[prop] = this.evalObj( obj[prop] );
    return newObj;
  };
  this.evalObj = function(obj) {
    switch ( typeof obj ) {
      case 'object':
        if ( Array.isArray( obj ) ) return this.cloneArr( obj );
        if ( obj instanceof Date === false ) return this.cloneObj( obj );
        // pass thru dates, strings, numbers, booleans, and functions
      default: return obj; // primitive
    }
  };
  return this.evalObj(obj);
}

Затем я изменил MarkerClustererPlus.js к следующему: 

656:  function MarkerClusterer(map, opt_markers, opt_optionsG) {
…
665:    var opt_options = deepCopy( opt_optionsG ) || {};

Я протестировал наличие 5 экземпляров MarkerClustererPlus (каждый с 5000 маркерами, всего 25000), и не было никакого заметного влияния на производительность по сравнению с наличием одного экземпляра MC+.

Скриншот нескольких экземпляров MarkerClustererPlus

2  
2013-05-10 21:41:43

Comments

    Ничего не найдено.
Click here to cancel reply.