Skip to content

Ranges with one number and one string generate axis ticks with invalid translations #107

@ajoslin103

Description

@ajoslin103

Not that I was doing this on purpose...

// dynamically determine the stylistic width of the graph, then strip the 'px' 
let width =String(this.graph.attr('width') || this.graph.style('width')).replace('px', '');
let height = String(this.graph.attr('height') || this.graph.style('height')).replace('px', '');

let xExtent = d3.extent(this.getTimeData()); // a series of millisecond times
let xScale = d3.scaleTime().domain(xExtent).range([0, width]);
let xAxis = d3.axisBottom(xScale);

d3.select('lines').append("svg").append("g").call(xAxis);

resulted in erroneous translations such as: transform="translate(20.8287963768115960.5,0)"
(notice the two decimal points in the x value)

the fix

let width = Number(String(this.graph.attr('width') || this.graph.style('width')).replace('px', ''));
let height = Number(String(this.graph.attr('height') || this.graph.style('height')).replace('px', ''));

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions