Le domaine des dates non continues D3 donne des lacunes sur les axes X

Je souhaite tracer des données de séries temporelles qui ne sont pas continues (lacunes dans les dates des week-ends, des vacances, etc.). Ce sont des données journalières.

Les données ressemblent à:

date,value 1/2/15,109.33 1/5/15,106.25 1/6/15,106.26 1/7/15,107.75 1/8/15,111.89 1/9/15,112.01 1/12/15,109.25 1/13/15,110.22 ... 

Je définis mes scales x et y :

 var x = d3.time.scale().range([0, width]); var y = d3.scale.linear().range([height, 0]); 

Et définissez le domaine à partir de mes données source:

 x.domain(d3.extent(data, function(d) { return d.date; })); y.domain(d3.extent(data, function(d) { return d.value; })); 

Le problème, cependant, est que mes dates présentent des lacunes. Et mon axe des x comprend maintenant les dates manquantes ( d3.time.scale() est-ce que cela est automatiquement d3.time.scale() car il correspond à une gamme continue?).

.extent() trouve les valeurs max et min en date puis .domain() renvoie ces valeurs max et min comme plage pour l'axe des x. Mais je ne suis pas sûr de savoir comment gérer les lacunes et renvoyer les dates non gap à la portée.

Donc, ma question est: Comment puis-je avoir ma gamme d'axes x ne comprennent que les dates qui se trouvent dans mon ensemble de données? Et ne pas "remplir les blancs". Devrais-je jouer avec la d3.time.scale().range() ? Ou dois-je utiliser une scale différente?

Quelle est la manière correcte de faire cela? Quelqu'un peut-il me montrer dans la bonne direction ou donner un exemple? Je vous remercie!

Aussi, je souhaite résoudre avec simplement d3 et javascript. Je ne suis pas intéressé à utiliser des bibliothèques d'abstraction tierces.

Comme le souligne Lars Kotthof, vous pouvez créer un axe ordinal x, qui "ressemble" à une échelle de temps. En supposant que vous souhaitez tracer vos séries temporelles en tant que ligne, voici un exemple de la façon de le faire: http://jsfiddle.net/ee2todev/3Lu46oqg/

Si vous souhaitez personnaliser votre format pour les dates, exportez-vous la date comme jour (de la semaine), jour et mois, vous devez convertir votre chaîne en une date en premier. J'ai ajouté un exemple qui forme les dates dans un format allemand commun. Mais vous pouvez facilement ajuster le code à vos besoins. http://jsfiddle.net/ee2todev/phLbk0hf/

Enfin, mais pas le moindre, vous pouvez utiliser

 axis.tickValues([values]) 

Pour choisir les dates que vous souhaitez afficher. Voir aussi: https://github.com/mbostock/d3/wiki/SVG-Axes#tickFormat

Le composant à échelle discontinue d3fc adapte toute autre échelle (par exemple une échelle de temps d3) et en ajoutant le concept de discontinuités.

Ces discontinuités sont déterminées par le biais d'un «fournisseur de discontinuité», la discontinuité intégréeSkipWeekends vous permet de sauter les week-ends.

Voici un exemple:

 const skipWeekendScale = fc.scaleDiscontinuous(d3.scaleTime()) .discontinuityProvider(fc.discontinuitySkipWeekends()); 

Et voici une démonstration complète: https://bl.ocks.org/ColinEberhardt/0a5cc7ca6c256dcd6ef1e2e7ffa468d4