Custom Visual Setup Exceptions (pbi-visuals-api 2.2.2, pbi-visuals-utils-dataviewutils 1.5.0)

mrogunlana — Sat, 01 Dec 2018 19:57:30 GMT

HI All,

I get the following exception when running pbiviz on a new visual

c:\Projects\visuals\powerbi\test2>pbiviz start
info Building visual...
error TYPESCRIPT /visualPlugin.ts : (8,103) Property 'visual' does not exist on type 'typeof extensibility'.

I used this, just to clarify the steps to produce these exceptions:

pbiviz new {name}
cd {dir to folder}
added latest (e.g. 2.2.2) powerbi-visuals-api into dependencies of project by executing command npm install --save powerbi-visuals-api.
added latest (e.g. 5.7.0) d3 into dependencies of project by executing command npm install --save d3.
added latest (e.g. 5.0.1) d3 types into dependencies of project by executing command npm install --save @types/d3.
ran npm install for good measure
removed all modules definitions from each file of source code (e.g. from ./src/visual.ts and ./src/settings.ts
```
module powerbi.extensibility.visual {...}
```
(see "Changes inside of the visuals sources" here: https://microsoft.github.io/PowerBI-visuals/docs/how-to-guide/migrating-to-powerbi-visuals-tools-3-0/)

added these imports to ./src/visual.ts for interfaces and classes

import powerbi from "powerbi-visuals-api";
import IViewport = powerbi.IViewport;
import IVisualHost = powerbi.extensibility.visual.IVisualHost;
import DataViewMetadataColumn = powerbi.DataViewMetadataColumn;
import DataViewMetadata = powerbi.DataViewMetadata;
import PrimitiveValue = powerbi.PrimitiveValue;
import VisualObjectInstance = powerbi.VisualObjectInstance;
import EnumerateVisualObjectInstancesOptions = powerbi.EnumerateVisualObjectInstancesOptions;
import DataViewObjectPropertyIdentifier = powerbi.DataViewObjectPropertyIdentifier;
import DataView = powerbi.DataView;
import ValueTypeDescriptor = powerbi.ValueTypeDescriptor;
import Fill = powerbi.Fill;
import VisualConstructorOptions = powerbi.extensibility.visual.VisualConstructorOptions;
import VisualUpdateOptions = powerbi.extensibility.visual.VisualUpdateOptions;
import DataViewPropertyValue = powerbi.DataViewPropertyValue;
import SortDirection = powerbi.SortDirection;
import IVisual = powerbi.extensibility.visual.IVisual;
import VisualObjectInstanceEnumeration = powerbi.VisualObjectInstanceEnumeration;

added these imports to ./src/settings.ts

import { dataViewObjectsParser } from "powerbi-visuals-utils-dataviewutils";
import DataViewObjectsParser = dataViewObjectsParser.DataViewObjectsParser;

removed settings specific functions

private static parseSettings(dataView: DataView): VisualSettings {
            return VisualSettings.parse(dataView) as VisualSettings;
        }

        /** 
         * This function gets called for each of the objects defined in the capabilities files and allows you to select which of the 
         * objects and properties you want to expose to the users in the property pane.
         * 
         */
        public enumerateObjectInstances(options: EnumerateVisualObjectInstancesOptions): VisualObjectInstance[] | VisualObjectInstanceEnumerationObject {
            return VisualSettings.enumerateObjectInstances(this.settings || VisualSettings.getDefault(), options);
        }

updated tsconfig to:

{
  "compilerOptions": {
    "allowJs": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "ES6",
    "module": "amd",
    "sourceMap": true,
    "outDir": "./.tmp/build/",
    "moduleResolution": "node"
  },
  "files": [
    ".api/v2.2.0/PowerBI-visuals.d.ts",
    "node_modules/powerbi-visuals-utils-dataviewutils/lib/index.d.ts",
    "node_modules/powerbi-visuals-api/index.d.ts",
    "src/settings.ts",
    "src/visual.ts"
  ]
}

updated pbiviz.json to:

{
  "visual": {
    "name": "test2",
    "displayName": "test2",
    "guid": "test22E2F85DEE16141ED87144301F2DFC4C8",
    "visualClassName": "Visual",
    "version": "1.0.0",
    "description": "",
    "supportUrl": "",
    "gitHubUrl": ""
  },
  "apiVersion": "2.2.0",
  "author": {
    "name": "",
    "email": ""
  },
  "assets": {
    "icon": "assets/icon.png"
  },
  "externalJS": [
    "node_modules/powerbi-visuals-utils-dataviewutils/lib/index.js",
    "node_modules/powerbi-visuals-api/index.js",
    "node_modules/d3/d3.min.js"
  ],
  "style": "style/visual.less",
  "capabilities": "capabilities.json",
  "dependencies": "dependencies.json",
  "stringResources": []
}

pbiviz start
Exception is shown

For the full source code to this example, goto: https://github.com/mrogunlana/powerbi-2.2.0-example

Thank you for your help in advance!

Re: Custom Visual Setup Exceptions (pbi-visuals-api 2.2.2, pbi-visuals-utils-dataviewutils 1.5.0)

mrogunlana — Sun, 02 Dec 2018 03:54:20 GMT

Ok, I answered my own question: for all those risk takers out there willing to take a deep dive into powerbi-visuals-tools 3.0, but have an older version installed pay close attention to this article: https://microsoft.github.io/PowerBI-visuals/docs/how-to-guide/migrating-to-powerbi-visuals-tools-3-0/ with special emphasis on the section titled: "How to install powerbi-visuals-tools@beta"

What this article fails to mention is that if you have an existing version of the tools installed globally on npm, instead of simply running the command:

npm install powerbi-visuals-tools@beta

You must update your global instance as well with:

npm install powerbi-visuals-tools@beta -g

Make sure you includ the global flag "-g" to update your local toolset. Then, create a new visual like so:

pbiviz new {name}

and run it with the following command:

npm run start

and you will see the new webpack runner in the command window.

**note: I had to update my security certificate as well with:

pbiviz --install-cert

follow the prompts after you run this command and you should be good to go. Hopefully this helps someone 🙂

topic Custom Visual Setup Exceptions (pbi-visuals-api 2.2.2, pbi-visuals-utils-dataviewutils 1.5.0) in Developer

Custom Visual Setup Exceptions (pbi-visuals-api 2.2.2, pbi-visuals-utils-dataviewutils 1.5.0)

Re: Custom Visual Setup Exceptions (pbi-visuals-api 2.2.2, pbi-visuals-utils-dataviewutils 1.5.0)