D3-字号刻度

Question

我有一个用D3制作的图形，要解决两个问题（我附上了示例图片）：

1）如何添加Y轴的字体大小？它仅采用“ candidad”标题所指示的值。

2）x轴上第一个刻度的文本出现在其余行的下方。缺少什么指示？

一些用于创建轴的代码：

var svg = d3.select('#graf_act_tiempo'),
  margin = { top: 20, right: 108, bottom: 60, left: 70 },
  width = +svg.attr('width') - margin.left - margin.right,
  height = +svg.attr('height') - margin.top - margin.bottom,
  g = svg.append('g').attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');

// Function to convert a string into a time
var parseTime = d3.time.format('%Y-%m-%d').parse;

// Set the X scale
var x = d3.time.scale().range([0, width], 0.5);
// Set the Y scale
var y = d3.scale.linear().range([height, 0]);
// Set the color scale
var color = d3.scale.ordinal()
    .range(["orange", "blue", "red"]);

var tickValuesForAxis = data.map(d => parseTime(d.fecha));
var ticks = data.length;

var xAxis = d3.svg.axis()
.scale(x)
.orient("bottom")
.ticks(ticks)
.tickFormat(d3.time.format('%d/%m/%y'))
;

var yAxis = d3.svg.axis()
.scale(y)
.orient("left")
.tickSize(1, 0)
.tickFormat(d3.format("d"))
;

  // Set the X domain
  x.domain(d3.extent(data, function(d) {
    return d.fecha;
  }));

  // Set the Y domain
  y.domain([
    d3.min(currencies, function(c) {
      return d3.min(c.values, function(v) {
        return v.worth;
      });
    }),
    d3.max(currencies, function(c) {
      return d3.max(c.values, function(v) {
        return v.worth;
      });
    })
  ]);

  // Set the X axis
  g.append("g")
    .attr("class", "x axis")
    .call(xAxis)
    .attr("transform", function(d) { console.log(height); return "translate(0," + height + ")"; })
    .selectAll("text")  
        .style("text-anchor", "end")
        .attr("dx", "-.8em")
        .attr("dy", ".15em")
        .attr("transform", "rotate(-65)")
        .style("font-size", "10px")         
    ;
  // Set the Y axis
  g.append("g")
    .attr("class", "y axis")
    .call(yAxis)
    .append("text")
    .attr("y", 0)
    .attr("x", -20)
    .attr("dy", "4px")
    .style("text-anchor", "end")
    .text("Cantidad")
    .style("font-size", "11px")
;

谢谢

Answer 1

1>您可以使用Yaxis的类名称并选择文本，并在CSS文件中提供字体大小 例如-在您的CSS文件中

.y.axis text {
font-size: 14px;
}

2>您能更具体地回答第二个问题吗？