如何设置nvd3轴使用字符串而不是数值？ [英] How to set a nvd3 axis to use strings instead of numerical values ?

问题描述

而不是x轴上的数值，我想设置我的属性名称。
我不是Javascript的英雄。
我使用散点图。

Instead of numerical values on the x-axis, i want to set my attribute names. I am no Javascript hero. I am using the scatter Chart.

我相信它应该是：

chart.xAxis.tickFormat(d3.format(String));

，然后我可以设置：

chart.xAxis
  .axisLabel('Attributes').staggerLabels(true).tickValues(["A", "B", "C"]);;

，然后设置值：

data[i].values.push({
 x : "A" ,
       y : 29.765957771107,
    size: Math.random(), 
    shape: shapes[j % 6]
     } , ..

属性A，B等在x轴？
我浏览了nvd3源代码，但没有找到正确的API调用。

How to see my attributes "A", "B", etc on the x-axis ? I browsed the nvd3 source code also but not finding the right API call.

推荐答案

您可以传入一个返回标签的格式函数，这是d3js的API。

You can pass in a format function that returns label. This is an API of d3js.

var x_format = function(num) {
    if (num === 2.3)
        return "A";
    else if (num === 5.6)
        return "B";
    else if (num === 45.2)
        return "C";
};

var xAxis = d3.svg.axis()
    .scale(x)
    .orient("bottom")
    .tickFormat(x_format);

查看这个散点图的例子。

Check out this example that I make for scatterplot.

http://vida.io/documents/jSGz9TQEmzwMqQzhs

{（A，2.3），（B，5.6）， C，45.2）}

{(A, 2.3), (B, 5.6), (C, 45.2) }

更新：我的答案为固定值。

Update: my answer with fixed value.

更新：行，条形图，散点图之间的混合组合：

Update: hybrid combination between line, bar, scatterplot:

http://vida.io/documents/fN5FjsYaHaJSXEjz7

这篇关于如何设置nvd3轴使用字符串而不是数值？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！