d3-y轴,对数刻度-刻度线重叠

问题描述 投票:0回答:1

我正在尝试对折线图的y轴使用对数刻度。这是我的代码:

 var yScale_for_axis = d3.scaleLog().domain([1,d3.max(vals)]).range ([height,0]);


 g.append("g")
      .call(d3.axisLeft(yScale_for_axis).tickFormat( d3.format(".1e"));

刻度线相互重叠。这是它的外观:

enter image description here

我应该怎么做才能使其看起来像这样?

enter image description here

d3.js
1个回答
0
投票

看一下代码段-似乎正常。也许是刻度线格式使刻度线重叠:

const width = 400, height = 500;

 // Append SVG 
 const svg = d3.select("body")
                .append("svg")
                .attr("width", width)
                .attr("height", height);

// Create scale
const scale = d3.scaleLog()
                  .domain([1, 5000])
                  .range([20, height - 20]);

// Add scales to axis
const yAxis = d3.axisLeft()
                   .scale(scale);

    //Append group and insert axis
svg.append("g")
  .attr('transform', 'translate(150, 0)')
  .call(yAxis);
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.7.0/d3.min.js"></script>
© www.soinside.com 2019 - 2024. All rights reserved.