缩放直线和圆

时间:2019-09-04 13:12:40

标签: d3.js scaling

我正在根据称为“数据”的数据中的最小值和最大值(已计算出的变量)来缩放线的长度和圆的位置。

我使用了scaleLinear()和scalePoint(),但是它们似乎无法正常工作。数据是一个对象数组。


Sample Object From Data

    {
        safety_metric: "total fatalities",
        min: 11,
        lcl: 13,
        median: 23,
        mean: 28,
        hcl: 32,
        max: 43,
        value: 32,
        combo: 110000,
        major_road: '1st St',
        minor_road: 'Church St'

    }

g.append("line")
  .attr("stroke", "#aaa")
  .attr("x1", d => x(d3.min(measurements, k => d[k])))
  .attr("x2", d => x(d3.max(measurements, k => d[k])));

g.append("g")
  .selectAll("circle")
  .data(d => d3.cross(measurements, [d]))
  .join("circle")
  .attr("cx", ([k, d]) => x(d[k]))
  .attr("fill", ([k]) => color(k))
  .attr("r", 3.5);

x = d3.scaleLinear()
    .domain([0, d3.max(data, d => d3.max(measurements, k => d[k]))])
    .range([0,10])
    .rangeRound([margin.left, width - margin.right])

y = d3.scalePoint()
    .domain(safety_metrics)
    .rangeRound([margin.top, height - margin.bottom])
    .padding(5)

0 个答案:

没有答案