Commit 7c7fe7eb authored by Sascha Herzinger's avatar Sascha Herzinger
Browse files

fixed x axis label sizing

parent a2680814
......@@ -4,6 +4,7 @@ import '../../assets/css/scatterplot.css';
const ANIMATION_DURATION = 500;
const MAX_FONT_SIZE = 20;
const D3_AXIS_TEXT_OFFSET = 9;
export default class extends Chart {
constructor({ container }) {
......@@ -128,6 +129,7 @@ export default class extends Chart {
const tooltipOffset = width / 100;
const yLabelSize = (margin.left / 5) > MAX_FONT_SIZE ? MAX_FONT_SIZE : (margin.left / 5);
const xLabelSize = yLabelSize;
const padding = width / 40;
const x = d3.scaleLinear()
......@@ -185,7 +187,6 @@ export default class extends Chart {
.tickFormat('');
function axisWrap(nodes, maxWidth) {
const D3_AXIS_TEXT_OFFSET = 9;
nodes.each(function () {
const text = d3.select(this);
while (text.node().getComputedTextLength() > maxWidth - D3_AXIS_TEXT_OFFSET) {
......@@ -255,8 +256,8 @@ export default class extends Chart {
this.xLabel
.attr('text-anchor', 'middle')
.style('dominant-baseline', 'central')
.style('font-size', MAX_FONT_SIZE)
.attr('transform', `translate(${width / 2}, ${height + margin.bottom - MAX_FONT_SIZE / 2})`)
.style('font-size', xLabelSize)
.attr('transform', `translate(${width / 2}, ${height + margin.bottom - xLabelSize / 2})`)
.text(this.xAxisLabel);
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment