topic Re: Custom visual not displaying in Developer

Custom visual not displaying

ConorHG — Fri, 15 Dec 2017 16:47:39 GMT

Hi all,

I am new to developing visuals so I am working my way through the powebi-visual github repo.

But I am stuck on 'Building a Visual with Static Data'. I have tried following this tutorial but it doesn't work for me.

I am not having any issues with my code or receiving any errors, my visual just won't display. I have even copied the code directly from the repo and still, nothing is displaying.

I have added a hello world output to the visual and that updates straight away so I know the issue isn't the connection.

Any ideas would be appreciated.

Thanks,
Conor.

Re: Custom visual not displaying

v-chuncz-msft — Mon, 18 Dec 2017 03:39:37 GMT

@ConorHG,

Use try...catch statement and check the Web Console. If convenient, share us a complete project for a quick test.

Re: Custom visual not displaying

ConorHG — Mon, 18 Dec 2017 11:16:43 GMT

Thanks @v-chuncz-msft,

I checked the console and got the following:

Uncaught SyntaxError: Unexpected token export
    at Object.i [as injectJsCode] (VM1088 visualhostcore.min.js:2)
    at i.loadWithoutResourcePackage (VM1089 visualsandbox.min.js:1)
    at i.executeMessage (VM1089 visualsandbox.min.js:1)
    at i.onMessageReceived (VM1089 visualsandbox.min.js:1)
    at VM1089 visualsandbox.min.js:1
    at e.invokeHandler (VM1088 visualhostcore.min.js:3)
    at e.dispatchMessage (VM1088 visualhostcore.min.js:3)
    at e.onMessageReceived (VM1088 visualhostcore.min.js:3)
    at windowMessageHandler (VM1088 visualhostcore.min.js:3)
    at dispatch (VM1084 visualsandbox.minimal.externals.js:16777)

The line of code it's referring to is from VM1322:

export {version} from "./build/package";

Not really sure what the issue is, tried installing different versions of d3 but no change.

Thanks,

Conor.

Re: Custom visual not displaying

v-viig — Mon, 18 Dec 2017 11:24:49 GMT

What version of d3 do you use?

Please note that PBIVIZ Tools don't support d3 v4. You should use d3 v3 instead (d3 v3.5.5 works well).

Ignat Vilesov,

Software Engineer

Microsoft Power BI Custom Visuals

pbicvsupport@microsoft.com

Re: Custom visual not displaying

ConorHG — Mon, 18 Dec 2017 11:54:30 GMT

@v-viig I was using v4.9.1 so I downgraded and that resolved that issue but I still cannot see my visual.

Code:

https://github.com/ConorHG/barchart

Note: According to Microsoft's git repo PowerBI Tools supports d3 v4.9.1 but clearly it doesn't.

Appreciate any help.

Thanks,
Conor.

Re: Custom visual not displaying

v-viig — Wed, 20 Dec 2017 10:08:46 GMT

I can see the visual (take a look at the screenshot below).

However, there's tiny mistake of applying class name for d3 selection. This issue can be fixed by this code:

            let bars = this.barContainer.selectAll(".bar").data(ViewModel.dataPoints);
            bars.enter()
                .append("rect")
                .classed("bar" , true);

Ignat Vilesov,

Software Engineer

Microsoft Power BI Custom Visuals

pbicvsupport@microsoft.com

Re: Custom visual not displaying

ConorHG — Wed, 20 Dec 2017 10:45:20 GMT

Hi @v-viig,

Thanks for your reply.

Fixed that issue in the code but for whatever reason, I still cannot see the visual.

I have tried several different browsers as well and it has made no difference.

Completely stumped.

I added the below to the code and it displays okay.

Thanks for your help.

Conor.

Re: Custom visual not displaying

ConorHG — Wed, 20 Dec 2017 11:02:13 GMT

I have also tried the stock project.

But the update count counter doesn't change when I move or resize the visual.

Re: Custom visual not displaying

v-viig — Thu, 21 Dec 2017 08:15:52 GMT

You must fill Fields of the stock custom visual to fix the issue with update count.

Ignat Vilesov,

Software Engineer

Microsoft Power BI Custom Visuals

pbicvsupport@microsoft.com