Шкала журнала не строилась для линейного графика с доменами (мин .: 0,97, макс .: 0,99)

Question

Я пытался построить линейную диаграмму с линейным масштабом для оси x и логарифмической шкалой для оси y, я смог получить отметки на оси x и не смог получить отметки на оси y, приблизительный домен для y- ось, для которой я пытался построить (мин: 0,97, макс: 0,99).

Для получения дополнительной информации я делюсь фрагментом кода того, что я пытался реализовать, используя d3 js.

<div class="chart">
  <svg id="lineChart" width="700" height="400"></svg>
</div>

 var data =[{"x":0,"y":0.9978130459785461},{"x":0.008500000461935997,"y":0.9978128337965614},{"x":0.017000000923871994,"y":0.9978125548636445},{"x":0.025499999523162842,"y":0.9978121495279796},{"x":0.03400000184774399,"y":0.9978114984883847},{"x":0.042500000447034836,"y":0.9878106612451595},{"x":0.050999999046325684,"y":0.9878096376589295},{"x":0.05950000137090683,"y":0.9878084275193106},{"x":0.06800000369548798,"y":0.9878070306571847},{"x":0.07649999856948853,"y":0.9878055064026502},{"x":0.08500000089406967,"y":0.987803675684732},{"x":0.09350000321865082,"y":0.9778017168930565},{"x":0.10199999809265137,"y":0.9777995106789062},{"x":0.11050000041723251,"y":0.9777972353041961},{"x":0.11900000274181366,"y":0.9777947712404012},{"x":0.1274999976158142,"y":0.9777920584884845},{"x":0.13600000739097595,"y":0.9777892157479598},{"x":0.1445000022649765,"y":0.9777860636906962},
];

    var lineChart = d3.select("#lineChart");
    var WIDTH = 700;
    var HEIGHT = 400;
    var MARGINS = {top: 30,right:50, bottom:30, left:50};
    var xMin = d3.min(data, function(d) {
      return d.x;
    });
    var xMax = d3.max(data, function(d) {
      return d.x;
    });
    var yMin = d3.min(data, function(d) {
      return d.y;
    });
    var yMax = d3.max(data, function(d) {
      return d.y;
    });
    var xScale = d3.scale.linear().range([MARGINS.left, WIDTH-MARGINS.right]).domain([xMin,xMax]);
    var yScale = d3.scale.log().range([HEIGHT-MARGINS.top, MARGINS.bottom]).domain([yMin,yMax]);

    var xAxes = d3.svg.axis().scale(xScale);
    var yAxes = d3.svg.axis().scale(yScale).orient("left");

lineChart.append("g")
    .attr("transform", "translate(0," + (HEIGHT-MARGINS.bottom) + ")")
    .attr("class","x")
    .call(xAxes);

lineChart.append("g")
    .attr("transform", "translate(" + (MARGINS.left) + ",0)")
    .attr("class","y")
    .call(yAxes);

var line = d3.svg.line()
    .x(function(d){return xScale(d.x);})
    .y(function(d){return yScale(d.y);});

lineChart.append("path")
    .attr("d", line(data))
    .attr("stroke", "green")
    .attr("stroke-width", 2)
    .attr("fill", "none");

.chart {
  width:700px;
  height:400px;
  margin: 0 auto;
}

#lineChart {
  margin: 0 auto;
  background-color: #ffffff;
  box-shadow: 0px 0px 20px #000000;
}

.x, .y {
  fill: none;
  stroke: #000;
  shape-rendering: crispEdges;
}

.x text, .y text {
  stroke: none;
  fill: #000;
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
  font-size: 13px;
}

codepen snippet:- https://codepen.io/shanmuks/pen/ZEQBpYm