Hi Shweta,
It seems there is an issue in D3 code.
Your D3 code:
function onDocumentReady() {
var powerGauge = gauge("#c1", {
size: 300,
clipWidth: 300,
clipHeight: 300,
ringWidth: 60,
maxValue: 10,
transitionMs: 4000,
});
powerGauge.render();
}
if ( !window.isLoaded ) {
window.addEventListener("load", function() {
onDocumentReady();
}, false);
} else {
onDocumentReady();
}
From this I am able to understand that your gauge will be load only when your page will refresh. So,when you ll navigate between tabs this function will not be called as your page is not getting refreshed.
I will suggest take two HTML component of sap ui5 and in afterRendering() function paste your D3 code . you just need to modify ur this code of d3
function onDocumentReady() {
var powerGauge = gauge("#c1", {
size: 300,
clipWidth: 300,
clipHeight: 300,
ringWidth: 60,
maxValue: 10,
transitionMs: 4000,
});
powerGauge.render();
}
onDocumentReady();
Do like this.
then you can create row oLayout.createRow(Html1,Html2);
Just let me know if you need more information about it or still facing the issue.
Thanks
Kapil Jain