diff --git a/visual_console_client/src/items/BarsGraph.ts b/visual_console_client/src/items/BarsGraph.ts index 351c75b8b8..c5481ec0dc 100644 --- a/visual_console_client/src/items/BarsGraph.ts +++ b/visual_console_client/src/items/BarsGraph.ts @@ -73,30 +73,20 @@ export default class BarsGraph extends Item { protected createDomElement(): HTMLElement { const element = document.createElement("div"); element.className = "bars-graph"; - element.innerHTML = this.props.html; - - // Hack to execute the JS after the HTML is added to the DOM. - const scripts = element.getElementsByTagName("script"); - for (let i = 0; i < scripts.length; i++) { - setTimeout(() => { - if (scripts[i].src.length === 0) eval(scripts[i].innerHTML.trim()); - }, 0); - } + element.style.backgroundImage = `url(${this.props.html})`; + element.style.backgroundRepeat = "no-repeat"; + element.style.backgroundSize = `${this.props.width}px ${ + this.props.height + }px`; return element; } protected updateDomElement(element: HTMLElement): void { - element.innerHTML = this.props.html; - - // Hack to execute the JS after the HTML is added to the DOM. - const aux = document.createElement("div"); - aux.innerHTML = this.props.html; - const scripts = aux.getElementsByTagName("script"); - for (let i = 0; i < scripts.length; i++) { - if (scripts[i].src.length === 0) { - eval(scripts[i].innerHTML.trim()); - } - } + element.style.backgroundImage = `url(${this.props.html})`; + element.style.backgroundRepeat = "no-repeat"; + element.style.backgroundSize = `${this.props.width}px ${ + this.props.height + }px`; } }