【问题标题】:Can't display axis to my rickshaw chart无法在我的人力车图表上显示轴
【发布时间】:2013-09-03 08:09:14
【问题描述】:

我正在尝试在我的图表中显示 x 轴和 y 轴。 我正在使用 JSON 作为数据。

这是我的以下代码:

new Rickshaw.Graph.Ajax( {

  element: document.getElementById("chart"),
  width: 580,
  height: 300,
  renderer: 'line',
  dataURL: 'dataoutevo.json',
  onData: function(d) { 
    return d },
  onComplete: function(transport) {
    var graph = transport.graph;
    var hoverDetail = new Rickshaw.Graph.HoverDetail( {
      graph: graph
    } );

   var shelving = new Rickshaw.Graph.Behavior.Series.Toggle( {
      graph: graph,
      legend: legend
    } );
  },
  series: [
    {
      name: 'ligne1',
      color: '#c05020',
    }, {
      name: 'ligne2',
      color: '#30c020',
    }, {
      name: 'ligne3',
      color: '#6060c0'
    }, {
      name: 'ligne4',
      color: 'red'
    }
  ],
  onComplete: function() {
    var x_axis = new Rickshaw.Graph.Axis.Time({
      graph: graph
    });
    x_axis.graph.update();
  }
} 

);

谁能帮助我并告诉我该怎么做? 我有数字作为 x 和 y 数据(不是单词)

【问题讨论】:

    标签: json rickshaw


    【解决方案1】:
    new Rickshaw.Graph.Ajax( {
      element: document.getElementById("chart"),
      width: 580,
      height: 300,
      renderer: 'line',
      dataURL: 'dataoutevo.json',
      onData: function(d) { d[0].data[0].y = 80; return d },
        onComplete: function(transport) {
          // important . do not forget
          var graph = transport.graph;
    
          var detail = new Rickshaw.Graph.HoverDetail({ graph: graph });
          var legend = new Rickshaw.Graph.Legend({graph: graph,element:   document.querySelector('#legend')});
    
          var xAxis = new Rickshaw.Graph.Axis.Time({graph: graph});
          xAxis.render();
    
          var yAxis = new Rickshaw.Graph.Axis.Y({graph: graph});
          yAxis.render();
    
          var shelving = new Rickshaw.Graph.Behavior.Series.Toggle({
            graph: graph,
            legend: legend
          });
    
          var highlighter = new Rickshaw.Graph.Behavior.Series.Highlight({
            graph: graph,
            legend: legend
          });
          var order = new Rickshaw.Graph.Behavior.Series.Order({
            graph: graph,
            legend: legend
          });
       },
       series: [
         {
           name: 'ligne1',
           color: '#c05020',
         }, {
           name: 'ligne2',
           color: '#30c020',
         }, {
           name: 'ligne3',
           color: '#6060c0'
         }, {
           name: 'ligne4',
           color: 'red'
         }
       ],
    });
    

    【讨论】:

    • 如何在web2py上创建人力车图
    【解决方案2】:

    Rickshaw.Graph.Axis.Time 更改为Rickshaw.Graph.Axis.X 在非常相似的情况下为我工作。顺便说一句,您的示例代码显示了onComplete 的两个定义,我认为这不是故意的?

    【讨论】:

    • 我们如何实现双引号中包含 x 和 y 的 JSON。
    猜你喜欢
    • 2016-09-05
    • 1970-01-01
    • 2013-10-06
    • 2018-04-04
    • 1970-01-01
    • 2012-05-16
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多