Dashboard API.resize not working with rendered javascript objects

Jira Development Jira Server
, , ,
1

I have a dashboard item using d3.js to render javascript items, however the API.resize is not working and the d3 objects spill out over the dashboard item’s frame. I have created a div with the space the d3 requires in my soy template which is called before resize is but this hasn’t helped. I would love to know what I am doing wrong here.

  • my soy template for the d3 code
{template .Chart}
<head>
    <title>chart</title>
    <meta name="decorator" content="atl.general"/>
</head>
<div id="chart">
  <div class="svg" width="800" height="400">
    <h1>hello world</h1>
  </div>
</div>

{/template}
  • a snippet from my dashboard item renderer
self.issues = data.issues;
            if (self.issues === undefined || self.issues.length  === 0) {
                $element.empty().html(Dashboard.Item.Tutorial.Templates.Empty());
            }
            else {
                $element.empty().html(Dashboard.Item.Tutorial.Templates.IssueList({issues: self.issues}));
                $element.append(Dashboard.Item.Tutorial.Templates.Chart());
                d3chart.chart(self.issues);
            }
            self.API.resize();
            $element.find(".submit").click(function (event) {
                event.preventDefault();
                self.render(context, preferences);
            });
        });

        this.API.once("afterRender", this.API.resize);