在D3plus.js .time()中使用月而不是年份

时间:2016-02-01 07:39:15

标签: d3.js d3plus

我正在为我的项目使用d3plus.js,我使用的代码如下所示 链接到演示here

<!doctype html>
<meta charset="utf-8">

<script src="http://www.d3plus.org/js/d3.js"></script>
<script src="http://www.d3plus.org/js/d3plus.js"></script>

<div id="viz"></div>

<script>
  var sample_data = [
    {"year": 1991, "name":"alpha", "value": 15},
    {"year": 1992, "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": 35},
    {"year": 1995, "name":"gamma", "value": 40}
  ]
  var visualization = d3plus.viz()
    .container("#viz")
    .data(sample_data)
    .type("tree_map")
    .id("name")
    .size("value")
    .time({"value": "year", "solo": 1994})
    .draw()
</script>

在这里,我想用几个月代替年份。喜欢而不是1991,1992等等,我需要Jan,Feb,March等。问题看起来很简单但只是替换了dint工作。有没有办法做到这一点?

这是我试过的

<script>
  var sample_data = [
    {"month": 'jan', "name":"alpha", "value": 15},
    {"month": 'feb', "name":"alpha", "value": 20},
    {"month": 'march', "name":"alpha", "value": 30},
    {"month": 'april', "name":"alpha", "value": 60},
    {"month": 'may', "name":"beta", "value": 40},
    {"month": 'march', "name":"beta", "value": 60},
    {"month": 'april', "name":"beta", "value": 10},
    {"month": 'march', "name":"gamma", "value": 35},
    {"month": 'april', "name":"gamma", "value": 40}
  ]
  var visualization = d3plus.viz()
    .container("#viz")
    .data(sample_data)
    .type("tree_map")
    .id("name")
    .size("value")
    .time({"value": "month", "solo": "jan"})
    .draw()
</script>

1 个答案:

答案 0 :(得分:0)

找到答案

<script>
  var sample_data = [
    {"month": "2012/05/21", "name":"alpha", "value": 15},
    {"month": "2012/05/21", "name":"alpha", "value": 20},
    {"month": "2012/06/21", "name":"alpha", "value": 30},
    {"month": "2012/06/21", "name":"gamma", "value": 60},
    {"month": "2012/08/21", "name":"gamma", "value": 40}
  ]
  var visualization = d3plus.viz()
    .container("#viz")
    .data(sample_data)
    .type("tree_map")
    .id("name")
    .size("value")
    .time({"value": "month", "solo": "2012/05/21"})
    .draw()
</script>