小编gra*_*ife的帖子

我是D3的新手.我创建了一个条形图,我的Y轴以某种方式反转(似乎规模也不对).我真的无法自己解决这个问题.这是Jsfiddle 的链接.

这是我正在处理的代码,以防您想在其他地方尝试.

提前致谢,对不起我的英语.

var w = 700;
var h = 400;
var margin = 40;

var dataset = [
{key:1,value:4000},
{key:2,value:3500},
{key:3,value:4400},
{key:4,value:3250},
{key:5,value:4785},
{key:6,value:3600},
{key:7,value:3200}
];


var key = function(d) {
    return d.key;
};

var value = function(d) {
    return d.value;
};
console.log(dataset);

//Create SVG element
var svg = d3.select("body")
            .append("svg")
            .attr("width", w)
            .attr("height", h);

var xScale = d3.scale.ordinal()
                .domain(d3.range(dataset.length+1))
                .rangeRoundBands([40, w], 0.05); 

var yScale = d3.scale.linear()
                     .domain([0, 5000])
                     .range([0, h-40]);

var x_axis = d3.svg.axis().scale(xScale);
var y_axis …

我想使用JSON文件绘制多个实时行.我基本上是从网站检索JSON文件,获取时间数据(持续时间以秒为单位),将它们转换为分钟并将它们推送到数据数组中.此代码每秒检查JSON文件.

我想添加尽可能多的行.例如,我想在数据数组中添加元素的平均值(平均持续时间)并将其绘制在同一平面上.我试图添加另一个"line"和"path"变量,但是我无法同时绘制它.

数据数组是一个空数组,开头有44个元素,每次代码检查JSON文件时,它都会用检索到的持续时间数据替换这些零.

这是我的代码只绘制一行.

  function graph() {

  var n = 43,
      duration = 1000,
      now = new Date(Date.now() - duration),
      count = 0,
      data = d3.range(n).map(function() { return 0; });

  var margin = {top: 10, right: 20, bottom: 30, left: 60},
      width = 1200 - margin.left-margin.right,
      height = 460 - margin.top - margin.bottom;

  var x = d3.time.scale()
      .domain([now - (n - 2) * duration, now - duration])
      .range([0, width]);

  var y = d3.scale.linear()
      .range([height, 0]);

  var line = d3.svg.line()
      .interpolate("basis") …