Heat Map D3 yAxis Error

Hello,

I’m running into an error on my D3 Heat Map project that I can’t quite figure out. I’ve tried to find a solution to it, but am having no luck.

Could someone point me in the right direction?

For whatever reason, when I call the yAxis I get the following errors:

Error: <path> attribute d: Expected number, "M-6,NaNH0.5VNaNH-6".
Error: <g> attribute transform: Trailing garbage, "translate(0,NaN)".

I set up my yScale on lines 50 - 57
I set up my yAxis on lines 74 -75
I append the yAxis on lines 82 - 85

Here is my project: https://codepen.io/ttstauss/pen/MqQQWO/

I’ve read some forums and StackOverflow issues that were similar, but I’m not quite getting it.

Any help would be greatly appreciated.

Thanks!
Taylor

check the syntax when using d3.scaleBound

_

add brackets

it works without brackets in the domain, i suppose, because the variable’s an array already

1 Like

Ah, I’m suprised I didn’t catch that. I figured it was a syntax issue on my part…Thanks so much for your help!

You hit the nail on the head, according to the documentation:

If domain is specified, sets the scale’s domain to the specified array of numbers. The array must contain two or more elements. If the elements in the given array are not numbers, they will be coerced to numbers. If domain is not specified, returns a copy of the scale’s current domain.

If range is specified, sets the scale’s range to the specified array of values. The array must contain two or more elements. Unlike the domain, elements in the given array need not be numbers; any value that is supported by the underlying interpolator will work, though note that numeric ranges are required for invert. If range is not specified, returns a copy of the scale’s current range.

Thanks!