Hello ,
I customized Mode Action bar i replaced the icon with new icon code is given below
const ModeBarButtons = require('plotly.js/src/components/modebar/buttons.js');
const ModeBarIcons = {...someIconObject}
export const modeBarConfig = {
displayModeBar: true,
displaylogo: false,
modeBarButtons: [
[{
name: 'Zoom In',
icon: ModeBarIcons.zoomIn,
attr: ModeBarButtons.zoomIn2d.attr,
val: ModeBarButtons.zoomIn2d.val,
click: ModeBarButtons.zoomIn2d.click,
}],
[{
name: 'Zoom Out',
icon: ModeBarIcons.zoomOut,
attr: ModeBarButtons.zoomOut2d.attr,
val: ModeBarButtons.zoomOut2d.val,
click: ModeBarButtons.zoomOut2d.click,
}],
[{
name: 'Pan',
attr: ModeBarButtons.pan2d.attr,
val: ModeBarButtons.pan2d.val,
icon: ModeBarIcons.pan,
click: ModeBarButtons.pan2d.click,
}],
[{
name: 'Reset',
icon: ModeBarIcons.reset,
attr: ModeBarButtons.autoScale2d.attr,
val: ModeBarButtons.autoScale2d.val,
click: ModeBarButtons.autoScale2d.click,
}],
[{
name: 'Download',
icon: ModeBarIcons.download,
title: ModeBarButtons.toImage.title,
click: ModeBarButtons.toImage.click,
}]],
};
But while the component mounted first time and i clicked on zoom-in or zoom-out button am getting one Uncaught TypeError and functionality is not working also
`Uncaught TypeError: Cannot read property 'node' of undefined
at Object.drawing.bBox (index.js?83d1:904)
at SVGGElement.eval (axes.js?0642:1882)
at eval (plotly.js?f794:17485)
at d3_selection_each (plotly.js?f794:17491)
at Array.d3_selectionPrototype.each (plotly.js?f794:17484)
at fixLabelOverlaps (axes.js?0642:1876)
at Object.lib.syncOrAsync (index.js?fc26:353)
at drawLabels (axes.js?0642:2038)
at Object.axes.doTicksSingle (axes.js?0642:2254)
at eval (axes.js?0642:1546)`
when i click on reset and then click on these button the issue is not coming.
Any idea why this error is coming ?