Ajout de données à un highchart graphique à l'aide d'un tableau avec des Id

Je veux ajouter une série à un highchart nuage de points où je suis en nommant chaque point de la série. J'ai créer un graphique de la manière suivante:

var chart; //globally available

makeCharts = function(){

      chart = new Highcharts.Chart({
         chart: {
            renderTo: 'container1',
            type: 'scatter'
         },        
         series: [{
            name: 'a',
                data: [{                    
                    'id': 'point1',
                    'x': 1,
                    'y': 2
                }, {
                    'id': 'point2',
                    'x': 2,
                    'y': 5
                }]
            }]

      });
}

Je voudrais être en mesure de mettre à jour les points sur la carte en utilisant quelque chose comme:

chart.series[0].setData([{id:['point3', 'point4', 'point5'], y:[0,1,2], x:[1,2,3]}])

mais ce n'est pas correct. Est-il possible de mettre à jour un tableau à l'aide de cette approche où chaque point a une ID?

EDIT:

Juste pour clarifier, je voudrais être en mesure de passer les tableaux directement, plutôt que d'ajouter les données point par point à l'aide addPoint(). J'ai pu parcourir un tableau et utiliser addPoint() de faire quelque chose comme ceci:

id:['point3', 'point4', 'point5'];
y:[0,1,2];
x:[1,2,3];

for (i=0; i<x.length; i++)
  {
  chart.series[0].addPoint({
    x:  x[[i],
    y:  y[i],
    id: id[i]
});

  }

Cependant, c'est très lent. C'est beaucoup plus rapide pour ajouter des données à l'aide de l'approche suivante:

chart.series[0].setData([[1,0],[2,1],[3,2]]);

J'ai trouvé que je peux ajouter des données comme ceci:

 chart.series[0].setData([[1,0, 'point3'],[2,1, 'point4'],[3,2, 'point5']]);

mais alors, la seule façon que je peux accéder à la id lorsque le point est sélectionné, c'est par this.point.config[2]. Avec l'approche suivante, je suis incapable d'utiliser chart.get('pointID') pour identifier un point que je n'ai pas le ID. Je veux être en mesure d'identifier le point à l'aide seulement de la ID.

veuillez mettre à jour sur l'état du problème, si l'une des solutions a aidé à marquer en conséquence, s'il y avait quelque chose de bien vouloir envisager la possibilité de laisser un commentaire en moins.
Il y a une fonction addSeries à cette fin

InformationsquelleAutor djq | 2012-10-05

3

Bien, généralement parlant, il y a deux façons dans laquelle vous pouvez modifier les données du graphique dynamiquement
1. Série.setData() Utilisez cette méthode lorsque vous souhaitez remplacer les données existantes par de nouvelles données
2. Série.addPoint() Utilisez cette méthode lorsque vous souhaitez ajouter un sous-ensemble des points de façon dynamique. Cette méthode n'est pas seulement pour l'ajout d'un point à un moment, si vous lisez attentivement la documentation de nouveau, vous trouverez que cette méthode prend un booléen redessiner argument, et l'argument de détail est le suivant
redessiner: Boolean

Par défaut à true. Si pour redessiner la carte après
le point est ajouté. Lors de l'ajout de plus d'un point, il est fortement
recommandé que le renouvellement de l'option en proie à de faux, et au lieu
le graphique.redraw() est appelée explicitement après l'ajout de points est
fini.

Dans votre cas, puisque vous voulez ajouter un peu de points de manière dynamique, mais en conservant les points existants, vous devriez aller avec la méthode 2. Mais vous avez besoin de l'utiliser à l'intérieur d'une boucle, avec le redessiner être définie sur false (donc de résoudre le problème de lenteur) et puis après la boucle, appelez le redessiner méthode explicitement

Code
```
var id = ['point3', 'point4', 'point5'],
    y = [0, 1, 2],
    x = [1, 2, 3];

for (var i = 0; i < x.length; i++) {
    chart.series[0].addPoint({
        x: x[i],
        y: y[i],
        id: id[i]
    },false);
}
chart.redraw();
```
Ajout de plusieurs points de manière dynamique | Highcharts et Highstock @ jsFiddle

InformationsquelleAutor Jugal Thakkar
1

Essayez d'utiliser de la série.addPoint.
```
chart.series[0].addPoint({
    x:  0,
    y:  0,
    id: 'anything'
});
```
Mais si vous avez besoin de définir les données de la série, l'utilisation
```
chart.series[0].setData([{
    x:  0,
    y:  0,
    id: 'anything'
},{
    x:  2,
    y:  2,
    id: 'another'
}]);
```
- Merci pour la suggestion. Je voudrais être en mesure d'ajouter un tableau dans. Je suppose que je pourrais utiliser une boucle avec addpoint() pour parcourir un tableau qui serait aussi travailler.
- Puis-je prendre un coup d'oeil sur le tableau auquel vous souhaitez ajouter?
- Je l'ai inclus dans ma question ci-dessus: x=[1,2,3]; y=[0,1,2];id=['point3', 'point4', 'point5'];
InformationsquelleAutor Igor Shastin
1

Dès que vous le pouvez transmettre vos données comme ceci:
```
chart.series[0].setData([[1,0, 'point3'],[2,1, 'point4'],[3,2, 'point5']]);
```
(comme vous l'avez indiqué dans la question), je peux vous suggérer d'utiliser un peu de bidouille.

Nous aurons besoin d'ajouter une autre déclaration à la méthode applyOptions de Highcharts.Point de prototype.
```
if (typeof options[0] === 'number' && options[2] && typeof options[2] === 'string') this.id = options[2];
```
Ici vous pouvez le voir en action.

InformationsquelleAutor Igor Shastin

Vous devez vous connecter pour publier un commentaire.