矩形而不是刻度D3 [英] Rectangles Instead of Ticks D3

查看:58
本文介绍了矩形而不是刻度D3的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

与问题类似此处,我一直在做与上一个问题相同的事情.我的问题现在与链接相似,但更多地是关于实现的.运行代码时,我的日志中出现错误,提示"TypeError:x.ticks不是函数".这是它所指的一段代码:

Similar to question here, I've been working on the same thing as in the last question. My question now is similar to the link, but is more about the implementation. When I run my code, I get an error in my log that says "TypeError: x.ticks is not a function". This is the piece of code it refers to:

svg.selectAll("g.grid")
    .data(y.ticks()).enter()
    .append("g").attr("class", "grid")
    .selectAll("rect")
        .data(x.ticks())
        .enter()
        .append("rect")
        .attr("x", function(d, i, j) {
                return xScale(j);
        })
         .attr("y", function(d, i, j) {
                return yScale(i);
        })
        .attr("width", xScale.rangeBand())
        .attr("height", yScale.rangeBand())
         .attr("fill", function(d, i) {
              return ((i) % 2) == 1 ? "green" : "blue";
         });

此代码在小提琴中效果很好,但在运行时却给了我一个错误我的代码,如此处所示.有帮助吗?

This code works perfectly well in this fiddle, but gives me an error while running it in my code, as seen here. Any help?

推荐答案

在您的示例中,您尝试在线性刻度.像在您所链接的问题中一样,使用rangeBoundBandBands可能是可行的方法.

In your example you are trying to call ticks on an ordinal scale instead of a linear scale. Utilising rangeBoundBands, like in the question you've linked to, is probably the way to go.

这篇关于矩形而不是刻度D3的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆