Question

我正在使用dojox.charting.DataSeries从dojo.data.ItemFileReadStore创建Dojo折线图。我正在使用DataSeries构造函数的第三个参数（值）来指定一个将在图表上生成点的方法。 e.g。

function formatLineGraphItem(store,item) 
{   
    var o = {
        x: graphIndex++, 
        y: store.getValue(item, "fileSize"),
    };
    return o;
}

graphIndex是一个整数，对于每个fileSize值递增。这给了我一个折线图，其中fileSize显示为数字计数。这很好。

我想要的是能够指定要使用的x轴标签而不是graphIndex的值，即下面的数据仍然是1,2,3,4，但标签将显示文本（在此case捕获文件大小的时间）。

我可以通过在调用chart.addAxis（）时将一组标签传入x asis来实现这一点，但这需要我在迭代数据之前知道这些值。 e.g。

var dataSeriesConfig = {query: {id: "*"}};
var xAxisLabels = [{text:"2011-11-20",value:1},{text:"2011-11-21",value:2},{text:"2011-11-22",value:3}];

var chart1 = new dojox.charting.Chart("chart1");
chart1.addPlot("default", {type: "Lines", tension: "4"});
chart1.addAxis("x", {labels: xAxisLabels});
chart1.addAxis("y", {vertical: true});
chart1.addSeries("Values", new dojox.charting.DataSeries(dataStore, dataSeriesConfig, formatLineGraphItem));
chart1.render();

可以通过预先编写dataSeries来创建xAxisLabels数组，但这不是一个非常好的解决方法。

有没有人有任何想法如何扩展formatLineGraphItem方法来提供x轴标签。或者是否有人有关于对象o可以包含哪些值的任何文档？

提前致谢！

Answer 1

这将采用unix时间戳，将值乘以1000（以便JavaScript具有微秒，然后将值传递给dojo日期以对其进行格式化）。根据您需要的格式编辑它应该没有任何问题。

您举例说明您的日期类似于“1”，“2”，“3”，这显然是错误的。那些不是日期..所以除非你编辑你的问题，否则这是你能做的最好的。

 chart1.addAxis("x",{
            labelFunc: function(n){              
                if(isNaN(dojo.number.parse(n)) || dojo.number.parse(n) % 1 != 0){
                    return " ";
                }
                else {
                    // I am assuming that your timestamp needs to be multiplied by 1000. 
                    var date = new Date(dojo.number.parse(n) * 1000);
                    return dojo.date.locale.format(date,  {
                        selector: "date",
                        datePattern: "dd MMMM",
                        locale: "en"
                    });
                }
            },
            maxLabelSize: 100
        }

使用dojox.charting.DataSeries时添加x轴标签

1 个答案: