topic Re: Create new custom visuals from the scratch code in Developer

Create new custom visuals from the scratch code

Krunalbpatel — Mon, 19 Dec 2016 10:01:54 GMT

Hi,

I want to create custom Power BI visuals for the report. I follow the different links to create custom visuals. But did't get the code for that. I need to know how to write a code in the visuals.ts file. Can you please provide me some basic Idea, How can I write the code? Or Is there any document fot it How to write a code?

I have some inbuilt code but I am getting the following error

Argument of type '{ value: string | number | boolean | Date; identity: string; }' is not assignable to parameter of type 'CategoryViewModel'.
Types of property 'value' are incompatible.
Type 'string | number | boolean | Date' is not assignable to type 'string'.
Type 'number' is not assignable to type 'string'.

Thanks

Re: Create new custom visuals from the scratch code

BhaveshPatel — Mon, 19 Dec 2016 10:48:45 GMT

Hi Krunal,

You can find more information on below github repository.

https://github.com/Microsoft/PowerBI-visuals

Re: Create new custom visuals from the scratch code

Krunalbpatel — Mon, 19 Dec 2016 10:59:45 GMT

Hi @BhaveshPatel,

I see this post, But how can I write a code? Is there any documentation for how to code? I am using the code but it gives me an error.

Re: Create new custom visuals from the scratch code

BhaveshPatel — Mon, 19 Dec 2016 11:02:31 GMT

You would find more information on the below VIDEO POST by Sachin Patney.

https://www.youtube.com/watch?v=_thcxwFmH9A

Re: Create new custom visuals from the scratch code

Krunalbpatel — Mon, 19 Dec 2016 11:24:25 GMT

Hi @BhaveshPatel,

I see this video but I am not able understand properly. Is there any documentation available for basic codes?

Re: Create new custom visuals from the scratch code

v-chuncz-msft — Tue, 20 Dec 2016 10:34:20 GMT

@Krunalbpatel,

Sample Bar Chart Repo could be the start point, and you'll need to learn TypeScript first. As for the error message, check Type assertions.

Re: Create new custom visuals from the scratch code

Krunalbpatel — Tue, 20 Dec 2016 11:27:13 GMT

Hi @v-chuncz-msft,

Thanks for your reply. I have follow the Sample Bar Chart Repo and write the same code as explain, but when look in the Power BI I am not able to see the report data.

Thanks

Re: Create new custom visuals from the scratch code

v-chuncz-msft — Wed, 21 Dec 2016 10:00:32 GMT

@Krunalbpatel,

Make sure that all necessary files are added to the files array in tsconfig.json. This allows the TypeScript compiler to load them and in what order. For tips about debugging your custom visual, see the debugging guide.

Re: Create new custom visuals from the scratch code

Krunalbpatel — Fri, 23 Dec 2016 05:07:39 GMT

Hi @v-chuncz-msft,

Thanks for your reply, and I got the solution for this. It was the D3 folder and node_module folder is not able to find the correct file. So it was giving an error.

Re: Create new custom visuals from the scratch code

Krunalbpatel — Fri, 23 Dec 2016 05:10:56 GMT

Hi,

Now I am stuck on color selection for the bar or text. I got the color selection option in theproperty window but I am not able to apply the color to the bars or color. For this I have to add any file which I have forgottotn to add? I am getting error on getSelection() for the color.

Thanks

Krunal Patel

Re: Create new custom visuals from the scratch code

v-chuncz-msft — Fri, 23 Dec 2016 10:20:33 GMT

@Krunalbpatel,

This is another error, better to raise a new thread. That way, community members could easily find the solution to a specific problem. By the way, you may post some screenshots and the related code snippet to better illustrate this issue.