添加换行符到xCharts xaxis

时间:2013-08-06 07:17:31

标签: svg javascript

我想在xCharts的x轴中添加换行符。 我一直在尝试使用<tspan>添加换行符失败。

以下是我目前的代码:

// Set initial data
var data = {
  "xScale": "time",
  "yScale": "linear",
  "type": "line",
  "main": [
    {
      "className": ".foo",
      "data": [
        {
          "x":"2013-08-06 14:30:00",
          "y":12
        },
        {
          "x":"2013-08-06 14:30:01",
          "y":8
        }
      ]
    }
  ]
}

// Set options
var opts = {
  "dataFormatX": function(x) {
    return d3.time.format('%Y-%m-%d %H:%M:%S').parse(x);
  },
  "tickFormatX": function(x) {

    /** This is where I'm adding the <tspan> **/
    return '<tspan>' + d3.time.format('%Y-%m-%d')(x) + '</tspan>'
      + '<tspan x="0" dy="1em">' + d3.time.format('%H:%M:%S')(x) + '</tspan>';
  }
}

// Plot the graph
var recentChart = new xChart('line', data, '#recent-Chart', opts);

它应该用YYYY-MM-DD和HH:MM:SS绘制在下面一行。但生成的输出如下:

<text y="3" x="0" dy=".71em" text-anchor="middle">&lt;tspan&gt;2013-08-06&lt;/tspan&gt;&lt;tspan x="0" dy="1em"&gt;14:30:00&lt;/tspan&gt;</text>

使用"\<tspan\>"转义会产生相同的结果。

如何插入换行符?

0 个答案:

没有答案