d3 line chart - axis labels don't appear responsive to different data?

[aaronkyle]

Thanks to @mcmcclur and @mootari, I am able to inject data into an imported Line Chart. This sorta works, but the charts axes appear | still to be linked to the original notebook–not my data | differently than expected:

If I am not mistaken, this is because the vales for the xAxis and yAxis that rely on these data in the original notebook aren’t aware of my data override (though the data references in the imported chart function are).

So what do I need to do in order to make them aware?

I have tried explicitly importing them, but this doesn’t work:

``` import {chart as tax_levy_by_class_chart, x, y, xAxis, yAxis} with {tax_levy_by_class_map as data} from "@d3/line-chart" ```

I have seen something similar when embedding notebooks - like if I were to separate out imports, they wouldn’t interact as the different cells weren’t aware of one another.

Any tips for how to correctly grouped imports so that my data will update all cells linked in the original notebook?

EDIT As noted below, my previous conjectures and speculation missed the mark. I don’t yet know what I have to do to get the axes to render correctly.

Here’s the notebook (a cleaned up fork of the one I shared in an earlier thread):

Sandisfield in Data - Oct 2020

Thank you!

[aaronkyle]

So my question is probably a bad one It turns out this doesn’t have anything to do with the import. When I copy over the entire notebook and replace the data value with my own, the axes are exactly the same.

I’ll play around more but reading the code I can’t immediately see why this is the case.

Sandisfield in Data - Oct 2020 - chart not as import

[radames]

Hi @aaronkyle, after quick look at your notebook, I notice that you’re not parsing the date as a Date() object, you can use d3.timeParse() to convert the year number to a proper time format

tax_levy_by_class_map = tax_levy_by_class.map(o => {
 return {
   date: d3.timeParse("%Y")(+o['Fiscal Year']),
   value: parseInt(o['Personal Property Levy '].replace(/,/g, ""))
 };
})

[aaronkyle]

Thanks @radames!! That definitely solves the issue for the x value. Any idea why my y value oscillates between 50,000 and 00,000 ?

[radames]

yes, add some pixels to your left margin!

[aaronkyle]

Awesome! Thank you!