DC.js - CoordonnerGridMixin

Les coordonnées et l'axe sont également appelés coordinateGridMixin est conçu pour prendre en charge un certain nombre de types de graphiques concrets basés sur des grilles de coordonnées, tels que les graphiques à barres, les graphiques linéaires, etc. La hiérarchie de CoordinGridMixin est définie dans le diagramme ci-dessous.

CoordinGridMixin prend en charge un certain nombre de méthodes pour réduire la charge de travail lors de la création de l'axe de coordonnées et elles sont les suivantes:

  • brushOn ([brushOn])
  • chartBodyG ([corps])
  • clipPadding ([pad])
  • élastiqueX ([X])
  • mise au point ([plage])
  • g ([racine])
  • isOrdinal()
  • mouseZoomable ([Zoom])
  • rangeChart ([plage])
  • round(r)
  • xAxisMax()
  • xAxisMin()
  • xUnitCount()

Laissez-nous discuter de chacune de ces méthodes en bref.

brushOn ([brushOn])

Il s'agit d'un filtre de plage basé sur un pinceau. Vous pouvez l'activer / le désactiver. Si le brossage est activé, l'utilisateur peut faire glisser la souris sur un graphique. L'activation peut désactiver d'autres éléments interactifs sur le graphique tels que la mise en évidence, les info-bulles et les lignes de référence. Il est défini ci-dessous -

chart.brushOn = function (brushOn) {
   if (!arguments.length) {
      return _brushOn;
   }
   _brushOn = brushOn;
   return chart;
};

chartBodyG ([corps])

Il est utilisé pour récupérer le groupe SVG pour le corps du graphique. Vous pouvez appeler cette fonction comme indiqué ci-dessous -

chart.chartBodyG = function (body) {
   if (!arguments.length) {
      return _chartBodyG;
   }
};

clipPadding ([pad])

Il est utilisé pour obtenir ou définir le remplissage en pixels du chemin du clip. Il est défini ci-dessous -

chart.clipPadding = function (pad) {
   if (!arguments.length) {
      return _clipPadding;
   }   
};

élastiqueX ([X])

Cette méthode est utilisée pour activer / désactiver le comportement de l'axe x élastique. Si l'élasticité de l'axe des x est activée, le graphique en grille tente de recalculer la plage de l'axe des x. Il déclenche un événement de rafraîchissement défini ci-dessous -

chart.elasticX = function (X) {
   if (!arguments.length) {
      return _x;
   }
}

De la même manière, vous pouvez effectuer un élastiqueY ([Y]).

mise au point ([plage])

Cette méthode est utilisée pour zoomer le graphique pour se concentrer sur la plage donnée. La plage donnée doit être un tableau contenant seulement deux éléments ([début, fin]).

g ([racine])

Cette méthode est utilisée pour obtenir ou définir l'élément g racine.

isOrdinal ()

Cette méthode est utilisée pour renvoyer l'ordinal xUnits du graphique. La plupart des graphiques se comportent différemment avec les données ordinales et utilisent le résultat de cette méthode pour déclencher la logique appropriée.

mouseZoomable ([Zoom])

Cette méthode est utilisée pour définir ou obtenir la capacité de zoom de la souris.

rangeChart ([plage])

Il est utilisé pour obtenir ou définir le graphique de sélection de plage associé à l'instance.

rond (r)

Cette méthode est utilisée pour définir ou obtenir la fonction d'arrondi utilisée pour quantifier la sélection lorsque le brossage est activé.

xAxisMax ()

Calcule la valeur x maximale à afficher dans le graphique. De même, nous pouvons effectuer pour l'axe Y.

xAxisMin ()

Calcule la valeur x minimale à afficher dans le graphique. De même, nous pouvons effectuer pour l'axe Y.

xUnitCount ()

Renvoie le nombre d'unités affichées sur l'axe des x. De même, nous pouvons effectuer pour l'axe Y.