ось dcjs y на обычных столбчатых диаграммах?

Question

Используя dc.js, я сделал порядковый график с численными значениями. Я выбрал порядковый график, потому что я хотел добавить x-tick для «unknown».

Проблема с осью y. Я не могу понять, как установить маркировку/масштабирование оси. Как видно из рисунка, он чередуется между [00, 20, 40, 60, 80]. Я бы хотел, чтобы у него был полный диапазон. Я попытался вручную вставить y ticks, но, похоже, не существует метода доступа для оси y. Ниже мой код и захват.

ghg2Chart /* dc.barChart('#volume-month-chart', 'chartGroup') */ 
     .width(FULL_CHART_WIDTH) 
     .height(FULL_CHART_HEIGHT) 
     .margins({top: 10, right: 20, bottom: 40, left: 20}) 
     .dimension(GHG2) 
     .group(GHG2Group) 
     .elasticY(true) 
     .centerBar(true) 
     .gap(5) 
     .round(dc.round.floor) 
     .alwaysUseRounding(true) 
     .x(d3.scale.ordinal().domain(GHG2bins)) 
     .xUnits(dc.units.ordinal) 
     .renderHorizontalGridLines(true) 
     //Customize the filter displayed in the control span 
     .filterPrinter(function (filters) { 
      var filter = filters[0], s = ''; 
      s += numberFormat(filter[0]) + ' -> ' + numberFormat(filter[1]); 
      return s; 
     }) 
     .filterHandler(function (dimension, filter) { 
      var selectedRange = ghg2Chart.filter(); 
      dimension.filter(function (d) { 
       var range; 
       var match = false; 
       // Iterate over each selected range and return if 'd' is within the range. 
       for (var i = 0; i < filter.length; i++) { 
        range = filter[i]; 
        if (d >= range - .1 && d <= range) { 
         match = true; 
         break; 
        } 
       } 
       return selectedRange != null ? match : true; 
      }); 
      return filter; 
     }); 

Answer 1

Единственная проблема с вашей карты является то, что там не хватает места для клещей, поэтому метки становятся обрезается.

По умолчанию левое поле составляет 30 пикселей:

https://github.com/dc-js/dc.js/blob/develop/web/docs/api-latest.md#dc.marginMixin+margins

Попробуйте увеличить маржу. Ленивый путь:

chart.margins().left = 40; 

Но это своего рода путаницу, поэтому более распространенным способом является

chart.margins({top: 10, right: 50, bottom: 30, left: 40}); 

Было бы удивительным для dc.js, чтобы сделать это автоматически:

https://github.com/dc-js/dc.js/issues/713

, но выполнение макета на основе размеров текста довольно сложно, поэтому на данный момент все эти материалы по-прежнему являются ручными (затрагивают легенды, метки осей и т. Д.)