【问题标题】:Strange Label/Tooltip behavior, nvd3 line chart奇怪的标签/工具提示行为,nvd3 折线图
【发布时间】:2015-05-13 04:41:21
【问题描述】:

我可能遗漏了一些简单的东西,但我的 nvd3 折线图显示不正确。除了前两个被夹在一起之外,所有的 x 轴刻度都是均匀分布的:

我用来构建图表的代码是:

  var chart = nv.models.lineChart()
                  .useInteractiveGuideline(true)
                  .showLegend(true)
                  .showYAxis(true)
                  .showXAxis(true);

  chart.xAxis
      .orient("bottom")
      .tickFormat(function(d) {
          return d3.time.format('%d-%b-%y')(new Date(d))
      })
      .rotateLabels(-45);

  chart.yAxis
      .axisLabel('Number of Visits')
      .orient("left")
      .tickFormat(d3.format('d'));

  var myData = timeseriesData;      

  // render the chart
  d3.select('#timeseries-chart svg')
      .datum(myData)
      .call(chart)

  return chart;

关于如何分散前两个刻度以及为什么它们如此接近的任何想法?

【问题讨论】:

  • 是的,这些数据会很有帮助。把它放在 Plunker 或 JSFiddle 中会更好。
  • 问题可能与您的数据格式有关。请发布您的数据。
  • 尝试将 showMaxMin 设置为 false:chart.xAxis.showMaxMin(false);。我同意 Plunker 或 JSFiddle 会很有帮助。
  • 啊哈,确实是数据。我正在提取额外一天的信息。谢谢大家的提示。

标签: javascript d3.js charts nvd3.js linechart


【解决方案1】:

原来有额外一天的数据。更仔细地过滤它就可以了。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2016-11-22
    • 1970-01-01
    • 1970-01-01
    • 2016-04-05
    • 1970-01-01
    • 1970-01-01
    • 2017-06-24
    相关资源
    最近更新 更多