Разный цвет-маркер шума, использующий здесь карты

Question

Можно ли применять другой цвет к различным маркерам шума при кластеризации, используя здесь карты api?

Имеется theming option, но это относится ко всем маркерам. Я хотел бы задать определенный цвет для конкретной точки, основанный на определенных условиях.

Answer 1

Это, безусловно, возможно с помощью специальной темы. Определение объекта H.clustering.DataPoint включает в себя data()method, который может содержать произвольные данные.

При подготовке вашего набора данных вы можете добавить его, как показано:

var dataPoints = []; 

dataPoints.push(new H.clustering.DataPoint(lat, lng, null, {color :'red'})); 
dataPoints.push(new H.clustering.DataPoint(lat, lng, null, {color :'green'})); 
dataPoints.push(new H.clustering.DataPoint(lat, lng, null, {color :'blue'})); 
// etc ... 

Если вы используете пользовательскую тему, вы можете прочитать данные с точки шума и отображать его, как вы считаете нужным:

function colorfulClusteringTheme() { 
    var baseTheme = new H.clustering.DefaultTheme(); 
    this.getClusterPresentation = function (cluster) { 

     var clusterIcon = baseTheme.getClusterPresentation(cluster).getIcon(); 
      return new H.map.Marker(cluster.getPosition(), { 
       icon: clusterIcon, 
      min: cluster.getMinZoom(), 
      max: cluster.getMaxZoom() 
     }); 

    }; 
    this.getNoisePresentation = function (noisePoint) { 
     if (noisePoint.data.color === 'red'){ 
      // add red noise point 
      return new H.map.Marker(noisePoint.getPosition(), { icon: redIcon }); 
     } 
     if (noisePoint.data.color === 'green'){ 
      // add red marker 
      return new H.map.Marker(noisePoint.getPosition(), { icon: greenIcon }); 
     } 
     if (noisePoint.data.color === 'blue'){ 
      // add blue noise point 
      return new H.map.Marker(noisePoint.getPosition(), { icon: blueIcon }); 
     } 
    }; 
    }; 

Вы можете добавить тему к карте в обычном порядке:

var clusteredDataProvider = new H.clustering.Provider(dataPoints, { 
    clusteringOptions: { 
     eps: 16, 
     minWeight: 5 
    }, 
    theme: new colorfulClusteringTheme() 
    }); 

    var clusteringLayer = new H.map.layer.ObjectLayer(clusteredDataProvider); 
    map.addLayer(clusteringLayer);