topic Re: Cannot import my own custom visual in Custom Visuals Development Discussion

Cannot import my own custom visual

ziyi — Mon, 25 Feb 2019 02:28:55 GMT

Hello,

I created a custom visual with PowerBI Visuals Tools version 2.3.0.

It works fine at my local environment.

So I import it to PowerBI Online, PowerBI shows a error message.

And also JavaScript shows this.

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://wabi-south-east-asia-redirect.analysis.windows.net/powerbi/content/visual. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).[Learn More]

How can I fix this ?

Re: Cannot import my own custom visual

v-evelk — Mon, 25 Feb 2019 16:51:10 GMT

Hello,

Looks like your visual tries to communicate with the outer environment (outside iframe) by sending some events or so on.

If there is a possibility to provide access to your code, I can try to investigate the issue.

Thanks!

Evgenii Elkin,

Software Engineer

Microsoft Power BI Custom Visuals
pbicvsupport@microsoft.com

Re: Cannot import my own custom visual

ziyi — Tue, 26 Feb 2019 00:37:26 GMT

Hello,

I pushed my code to github.

https://github.com/sengokyu/ex-powerbi-and-igniteui

Following are parts of my code.

visuals.ts

module powerbi.extensibility.visual {
    'use strict';

    export class Visual implements IVisual {
        private table: JQuery<HTMLElement>; // ignite-ui grid
        // (snip)
        constructor(options: VisualConstructorOptions) {
            // (snip)
            try {
                this.table.igGrid(params);
            } catch (err) {
                console.log(err);
            }
        }
        // (snip)
    }
}

pbiviz.json

{
  /* (snip) */
  "externalJS": [
    "node_modules/jquery/dist/jquery.js",
    "src/jquery.adapter.js",
    "vendor/jquery-ui-1.12.1/jquery-ui.js",
    "vendor/ignite-ui/js/infragistics.core.js",
    "vendor/ignite-ui/js/infragistics.lob.js",
    "src/infragistics.adapter.js",
    "node_modules/powerbi-visuals-utils-dataviewutils/lib/index.js"
  ],
  /* (snip) */
}

igGrid is a component manufactured by Infragistics.

https://www.infragistics.com/products/ignite-ui

Thank you.

Re: Cannot import my own custom visual

v-evelk — Wed, 27 Feb 2019 12:23:19 GMT

I tried to build it but it requires some files from "vendor" folder.

Is it possible to provide them?

Evgenii Elkin,
Software Engineer
Microsoft Power BI Custom Visuals
pbicvsupport@microsoft.com

Re: Cannot import my own custom visual

ziyi — Thu, 28 Feb 2019 10:34:15 GMT

I zipped some files in vendor directory.

https://1drv.ms/f/s!AoOnXNteXYjpiQSsAS6l4wOfeDvP

Zip password: greatbi

I will delete this file after a day.

Thanks.

Re: Cannot import my own custom visual

v-evelk — Thu, 28 Feb 2019 11:07:24 GMT

Thanks, I have downloaded them.

Evgenii Elkin,
Software Engineer
Microsoft Power BI Custom Visuals
pbicvsupport@microsoft.com

Re: Cannot import my own custom visual

v-evelk — Thu, 28 Feb 2019 14:16:57 GMT

The reason was found.

Your package has size of more than 3Mb but PowerBI Service alow to import packages of size no more than 2Mb.

In than case you should unpack a built package by any archivator and pack manually as zip file and then change the extension to PIVIZ. It must help to reduce the package size.

Also you can use new tools that let to use JS modules and import 3rd party libraries as modules without including external links to pbiviz.json. It must help to reduce a package size and simplify work with outer libraries.

Details you can find by the following link (https://community.powerbi.com/t5/Custom-Visuals-Community-Blog/New-Beta-version-of-powerbi-visual-tools-v3/ba-p/545287)

PBIVIZ file size must be less than 2MB Re: Cannot import my own custom visual

ziyi — Fri, 01 Mar 2019 00:27:03 GMT

Thank you! You saved me.

I did unzip pbiviz and re-zip them.

unzip exGrid.pbiviz
zip -9 -r exGrid.zip package.json resources
mv exGrid.zip exGrid.rezip.pbiviz

I have imported my pbiviz successfully.

Re: PBIVIZ file size must be less than 2MB Re: Cannot import my own custom visual

v-viig — Mon, 04 Mar 2019 16:34:50 GMT

We are integrating ZIP compression into PBIVIZ 3.x.x. It will be released soon once we are sure it works well.

Ignat Vilesov,

Software Engineer

Microsoft Power BI Custom Visuals

pbicvsupport@microsoft.com

Re: PBIVIZ file size must be less than 2MB Re: Cannot import my own custom visual

Anujshaan — Tue, 20 Jun 2023 16:17:47 GMT

Can you elaborate how you acheived this?