Vizzu overwrites config object
korompaiistvan opened this issue · comments
This is a strange one, I'm not even sure it's a bug or just unexpected for me.
In my WIP application, I'm keeping track of the config object I'm passing to Vizzu because I use it to render pieces of the UI.
This state
object extends the AppState interface from the below definition:
import { Data, Config } from "vizzu/dist/vizzu";
type FullConfig = NoOptional<Config.Chart>;
interface AppState {
chartConfig: FullConfig;
dataset: Data.TableBySeries;
}
in my app I pass this to Vizzu every single time it gets modified by my app
// whenever state.chartConfig is changed by the app
chart.animate({
config: state.chartConfig,
});
in another place I attempt to render UI elements based on the state
object, and so I loop through the key-value pairs of state.chartConfig.channels
. a simplified snippet for this would be e.g.:
const colorSeries = state.chartConfig.channels.color
colorSeries.map(series => // render the ui)
However, after the first UI change, I get the following error:
TypeError: selected.map is not a function
Looking at my state object, it's because the channels no longer hold string arrays, they have been replaced by objects
I believe this is done because JavaScript passes objects by reference and not by value, so this line in the lib mutates my original object, instead of creating a copy for its own internal use.
This can be solved in two places in my view.
- Either the lib takes a deep copy of the config object before mutating it
- I pass a deep copy to the animate method instead of the actual object
I think option 1 would give the better developer experience.
I agree, the 1. solution is preferable.
This is a bit too big of a change to include in a patch version, it will be released in 0.4.0.