Yui 3 Tableau: comment formater les dates dans l'axe graphique (YUI 3.3.0 Preview Release 3)
-
09-10-2019 - |
Question
Je suis en train d'utiliser la version preview YUI 3.3.0 3 YUI 3 exemples de cartographie ).
YUI().use('charts', function (Y)
{
var myDataValues = [
{category:"5/1/2010", values:2000},
{category:"5/2/2010", values:50},
{category:"5/3/2010", values:400},
{category:"5/4/2010", values:200},
{category:"5/5/2010", values:5000}
];
var myAxes = {
dateRange:{
keys:["date"],
position:"bottom",
type:"category",
styles:{
majorTicks:{
display: "none"
},
label: {
rotation:-45,
margin:{top:5}
}
}
}
};
var mychart = new Y.Chart({
dataProvider:myDataValues,
render:"#mychart",
categoryKey:"date",
categoryType:"time",
axes:myAxes
});
});
Mais je ne peux pas trouver les exemples ou de la documentation sur la façon de formater les dates pour cette nouvelle version pré-version YUI cartographie. Ma question est:
Comment puis-je changer le format de la date de l'axe des x?
La solution
J'ai eu ma réponse sur le forum YUI , je viens d'avoir d'ajouter les attributs type:"time"
et labelFormat: "%e %b %Y"
à mon dateRange
de x-axes.
YUI().use('charts', function (Y)
{
var myDataValues = [
{category:"5/1/2010", values:2000},
{category:"5/2/2010", values:50},
{category:"5/3/2010", values:400},
{category:"5/4/2010", values:200},
{category:"5/5/2010", values:5000}
];
var myAxes = {
dateRange:{
keys:["date"],
position:"bottom",
type:"time",
labelFormat: "%e %b %Y",
styles:{
majorTicks:{
display: "none"
},
label: {
rotation:-45,
margin:{top:5}
}
}
}
};
var mychart = new Y.Chart({
dataProvider:myDataValues,
render:"#mychart",
categoryKey:"date",
categoryType:"time",
axes:myAxes
});
});
Pour les instances TimeAxis la labelFormat est une chaîne strftime. Pour plus d'informations sur le formatage strftime voir ce qui suit: http://pubs.opengroup.org/onlinepubs/007908799/xsh/strftime.html
Autres conseils
Ou vous pouvez essayer d'utiliser labelFunction
http: // jhtmlcss. blogspot.com/2014/05/yui-3-using-custom-function-to-display.html