在d3plus堆积区域图中设置顺序

时间:2016-06-28 12:10:11

标签: d3plus

如何在d3plus中设置堆积区域图中区域的顺序?

我使用http://d3plus.org/examples/basic/9029462/中的以下示例:

<script>
  // sample data array
  var sample_data = [
    {"year": 1993, "name":"alpha", "value": 20},
    {"year": 1994, "name":"alpha", "value": 30},
    {"year": 1995, "name":"alpha", "value": 60},
    {"year": 1993, "name":"beta", "value": 40},
    {"year": 1994, "name":"beta", "value": 60},
    {"year": 1995, "name":"beta", "value": 10},
    {"year": 1994, "name":"gamma", "value": 10},
    {"year": 1995, "name":"gamma", "value": 40}
  ]
  // instantiate d3plus
  var visualization = d3plus.viz()
    .container("#viz")  // container DIV to hold the visualization
    .data(sample_data)  // data to use with the visualization
    .type("stacked")    // visualization type
    .id("name")         // key for which our data is unique on
    .text("name")       // key to use for display text
    .y("value")         // key to use for y-axis
    .x("year")          // key to use for x-axis
    .time("year")       // key to use for time
    .draw()             // finally, draw the visualization!
</script>

排序是 Gamma Beta Alpha 。如何进行自定义订购?

我尝试.order({'value': ['Beta', 'Alpha', 'Gamma']}没有效果。 .order({'sort': 'asc'})然而有效。然后,.order({'agg': 'min'})(应该产生 Gamma Alpha Beta )也不起作用。

1 个答案:

答案 0 :(得分:0)

我在叠加条形图时遇到了类似的问题。我认为它在d3plus中是bug。将您的x轴字段(在您的情况下&#39;年&#39;)更改为字符串字段而不是整数。然后订购可能会开始工作。

e.g。 {"year": "1993", "name":"alpha", "value": 20}