значение, не отображаемое для последнего тика по оси Y на графиках d3 - PullRequest
0 голосов
/ 22 апреля 2019

Я использовал d3 для создания гистограммы. Когда я строил график с данными, несколько раз значение последнего тика не отображалось на оси Y. Иногда все тики имеют значения по оси Y, но иногда первый и последний тики не имеют значений.

См. Пример кода, который я использовал.

const margin = { top: 4, right: 80, bottom: 30, left: 30 };
const width = 800- (margin.left + 30) - margin.right;
const height = 220- margin.top - margin.bottom;

let parseTime = d3.timeParse("%b-%y");
const tooltipDate = d3.timeFormat("%b-%y"), formatSuffixDecimal2 = 
d3.format(".2s");

const x = d3.scaleTime()
  .range([0, width])
  .domain(d3.extent(dates, function (d) {
    return d;
  }));

const y = d3.scaleLinear().domain([parseInt(val1), parseInt(aa)]).range([height, 0]);
const chart = d3.select('#' + id)
  .append('g')
  .attr('transform', 'translate(' + (margin.left + 20) + ',' + margin.top + ')');

 states.forEach(function (d) {
    d.Month = parseTime(d.Month);
  });
 let xAxis = d3.axisBottom(x).tickFormat(d3.timeFormat("%b-%y")).ticks(d3.timeMonth, 1);
const yAxis = d3.axisLeft(y);
chart.append('g').call(yAxis);
chart.append('g').attr('transform', 'translate(0,' + height + ')').call(xAxis);

let bar = chart.selectAll("rect")
  .data(states)
  .enter().append("g");

bar.append("rect")
  .attr("class", "barGraph")
  .attr("x", function (d, i) {
    return x(d.Month);
  })
  .attr("y", function (d, i) {
    return y(d.Value);
  })
  .attr("width", 20)
  .attr("height", function (d, i) { return height - y(d.Value); });

Пример данных:

let states = [
{"Month": "Mar-18", "Value": "2004.50"}, 
{"Month": "Apr-18", "Value": "2255.00"}, 
{"Month": "May-18", "Value": "2292.00"}, 
{"Month": "Jun-18", "Value": "2133.00"}, 
{"Month": "Jul-18", "Value": "2081.00"}, 
{"Month": "Aug-18", "Value": "2125.00"}, 
{"Month": "Sep-18", "Value": "2032.00"}, 
{"Month": "Oct-18", "Value": "2027.00"}, 
{"Month": "Nov-18", "Value": "1934.00"}, 
{"Month": "Dec-18", "Value": "1942.00"}, 
{"Month": "Jan-19", "Value": "1852.00"}, 
{"Month": "Feb-19", "Value": "1856.00"}]

Изображение тиков

Последние тики не имеют значения

Последний и первый тики не имеют значений

Все тики имеют значения

Пожалуйста, помогите мне с этим.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...