I'm tasked with adding Tableau-generated javascript embed code to a SharePoint SPFx single part app, and assume the issue I'm having (with nothing showing up) is because of the Javascript in the middle of my "HTML DOM innerHTML Property".
As I'll have several additional workbooks to deploy, I'm hoping to add the JS reference to the same TS file. How would you do it?
public render(): void {
this.domElement.innerHTML = `
<div class="${ styles.myCoolSinglePartPage }">
<div class="${ styles.container }">
<div class="${ styles.row }">
<div class="${ styles.column }">
<span class="${ styles.title }">Tableau Test 9</span>
<p class="${ styles.subTitle }">SIGH!</p>
<p class="${ styles.description }">${escape(this.properties.description)}</p>
</div>
</div>
<script type='text/javascript' src='https://tableauprod.prod.redacted.org/javascripts/api/viz_v1.js'></script>
<div class='tableauPlaceholder' style='width: 1200px; height: 900px;'>
<object class='tableauViz' width='1500' height='900' style='display:none;'>
<param name='host_url' value='https%3A%2F%2Ftableauprod.prod.redacted.org%2F' />
<param name='embed_code_version' value='3' />
<param name='site_root' value='' />
<param name='name' value='StrategyLandingPage/FiveYearStrategicPlanning' />
<param name='tabs' value='no' />
<param name='toolbar' value='yes' />
<param name='display_count' value='n' />
<param name='origin' value='viz_share_link' />
<param name='showAppBanner' value='false' />
</object>
</div>
</div>
</div>`;
}