d3附加简单区域 [英] d3 append simple area

问题描述

我要将简单区域附加到我的图表中，并将端点值作为常量。

I want to append simple area to my chart with end points of area values as constants.

percentArea = d3.svg.area()
      .interpolate('linear')
      .x0(0)
      .x1(w)
      .y0(h/4)
      .y1(h);

我想直接追加这个区域，并给它一个颜色填充。感谢帮助。我有特别困难的时间试图获得面积填充。

I want to append this area directly and give it a color fill. Thanks for help. I am having specially hard time trying to get the area fill. The chart shows a line over the area but no fill when I tried.

编辑：试图使问题更清晰和具体：我面对的问题只有当我尝试时，尝试调用我的函数而不传递数据。当我调用percentArea（data）时，区域填充按预期工作。但是我无法理解为什么我的区域的端点是常数时必须传递数据。

Trying to make the question more clear and specific : The issue I face is only when I try to call my function without passing data. The area fill works as expected when I call percentArea(data). However I am unable to understand why I must pass data when endpoints of my area are constant.

推荐答案

路径已填充。有两种方法可以执行此操作：

You need to ensure that the path you have rendered is being filled. There are two ways you can do this:

设置样式

path.style("fill", "steelblue");

设置类和利用CSS

path.attr("class", "filled-area");

// In CSS
.filled-area {
    fill: steelblue;
}

这里有一个简单的例子：

Here's a quick example:

具有笔划的区域图：

没有填充的区域图

正如您所看到的，此默认值为黑色

As you can see this defaults to black

填充正确的区域图

这篇关于d3附加简单区域的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！