Skip to Content
Menu
This question has been flagged
1 Reply
4128 Views

Hi All,

I'm a complete JS n00b and I'm really struggling to figure this out. I'm trying to change the default colors used in graphs. There's a 'getColors' functions in web/views/graph/colors.js that simply returns an array of colors that are used for this and it seems best to me to just override this function with my own array of colors but I can't for the life of me figure out how to patch it because this function does not belong to a class. 

The original code (that I want to patch) looks like this (notice that none of this is inside a class):

/** @odoo-module **/
const COLORS_BRIGHT = [
"#1f77b4",
// rest removed for brevity
];

const COLORS_DARK = [
"#00ffff",
// rest removed for brevity
];

// this is the function I want to replace with my own
export function getColors(colorScheme) {
return colorScheme === "dark" ? COLORS_DARK : COLORS_BRIGHT;
}

// a few more functions that I don't care about

I've created my own colors.js like this

/** @odoo-module **/    
import { patch } from '@web/core/utils/patch';
import { getColors } from '@web/views/graph/colors';

const MY_COLORS_BRIGHT = [
"#1f77b4",
// rest removed for brevity
];

const MY_COLORS_DARK = [
"#00ffff",
// rest removed for brevity
];

patch(getColors, 'my_module.colors', {
getColors(colorScheme) {
return colorScheme === "dark" ? MY_COLORS_DARK : MY_COLORS_BRIGHT;
}
}

Obviously this doesn't work - it basically adds a new getColors function inside the old getColors function instead of replacing it. Normally I think I would patch the Class with getColors function and that would work. How can I go about replacing this function without it having a parent to patch? 

Avatar
Discard
Author Best Answer

I've solved my own problem. The key here is importing the entire colors.js file with 'import * as colors' and then patching 'colors' with the new function. I'm not sure why, but when doing it this way I was unable to patch the getColors function directly (the original one would still be called). But patching getColor (which is what all other modules actually call) and using my own getMyColors function it works.

/** @odoo-module **/
import { patch } from '@web/core/utils/patch';
import * as colors from '@web/views/graph/colors';

const MY_COLORS_BRIGHT = [
"#1f77b4",
// rest removed for brevity
];

const MY_COLORS_DARK = [
"#00ffff",
// rest removed for brevity
]; function getMyColors(colorScheme) { return colorScheme === "dark" ? MY_COLORS_DARK : MY_COLORS_BRIGHT; } patch(colors, 'my_module.colors', { getColor(index, colorScheme) { const colors = getMyColors(colorScheme); return colors[index % colors.length]; } });
Avatar
Discard

Thanks! This really helped

Related Posts Replies Views Activity
1
May 25
7725
2
Jul 24
2069
0
May 24
1505
1
Apr 24
1556
0
Aug 21
8645