Unanswered

Using Highcharts from custom charts

(0) Share

Report

Posted on by Community Power Pla... Microsoft Employee

I have a use case where i'll need to embed a chart into my portal based on the results of a FetchXML query. I know that Power Apps portals use Highcharts and based on experimentation i am able to show a chart on my portal by referencing the following javascript bundle

and using a variation of the html / javascript found here http://jsfiddle.net/ca8h5eqz/

Whilst this works, i wonder if its a bad idea to include a reference to https://content.powerapps.com/resource/powerappsportal/dist/chart.bundle-d15c2abad8.js in my web template. Is there a risk that Microsoft may change / upgrade / remove this js file? Is there a better way that I could do it?

Categories:

Power Apps portals

I have the same question (0)

All responses (6)

Answers (0)

Sort by

ragavanrajan 7,044 Most Valuable Professional on at

Like (1)

Report
Copy link

Link copied!

Hi @Anonymous

As long as you trust the JavaScript library. Then you can reference it and use it wherever it is necessary.

Microsoft will not block any third-party libraries. But you need to think about while making to production if there is a breaking change in the third party library you depend on. Then this will cause a significant impact on users or clients. And especially security of the third-party library.

For your use case. You can build a PCF component portal using charts. This is also one of the way the portal prefers. Where you can maintain your custom component properly.

On the other hand, the approved and preferred method ways Power BI.

------------

If you like this post, give it a Thumbs up. Where it solved your request, Mark it as a Solution to enable other users to find it.

Was this reply helpful? Yes No
Community Power Pla... Microsoft Employee on at

Like (0)

Report
Copy link

Link copied!

Thank you for your response. In regards to your comment "You can build a PCF component portal using charts. This is also one of the way the portal prefers. Where you can maintain your custom component properly." do you have any more information on how to build a PCF component using a chart? I was just planning on building a web template

Was this reply helpful? Yes No
OOlashyn 3,498 Most Valuable Professional on at

Like (1)

Report
Copy link

Link copied!

Hi @Anonymous ,

You can fetch necessary data using fetchxml and then use whatever library to create charts that you like. In a couple of projects, I was using chart.js (https://www.chartjs.org/) which I can easily recommend. If you need to dynamically refetch some data you can always use Web API or webpage with fetchxml (see here) to get fresh data and refresh your chart.

Was this reply helpful? Yes No
Community Power Pla... Microsoft Employee on at

Like (0)

Report
Copy link

Link copied!

Yes i am comfortable using FetchXML to generate the data for the Chart. My original question was around whether or not it was a good or bad idea to use the Highcharts library by referencing this javascript in my page template <script src="https://content.powerapps.com/resource/powerappsportal/dist/chart.bundle-d15c2abad8.js"></script>

I've since realised that the simplest way to avoid having to directly reference the javascript file is to use at least one Power Apps driven chart in your page template (eg: use the liquid tags chart id:"...), this will make the portal include the correct javascript file for Highcharts and then i can include any other custom highchart in the same page template

Was this reply helpful? Yes No
ragavanrajan 7,044 Most Valuable Professional on at

Like (0)

Report
Copy link

Link copied!

Hi @Anonymous

Yes, you can have a page template/ web template and reference it to all your web pages. Or you can build a content snippet and inject content snippet with charts. The choice is up to you. Always check the page load performance when you are trying different methods.

Here is the PCF component article which you requested.

https://docs.microsoft.com/en-us/powerapps/maker/portals/component-framework

https://docs.microsoft.com/en-us/powerapps/developer/component-framework/overview

Hope it helps.
------------

If you like this post, give it a Thumbs up. Where it solved your request, Mark it as a Solution to enable other users to find it.

Was this reply helpful? Yes No
Christian Leverenz 1,214 on at

Like (0)

Report
Copy link

Link copied!

Hi @Anonymous ,
even if i strongly agree on using pcfs nowadays, using liquid i usually upload my version of the used library as a webfile and use it locally. This ensures, that i use a working version (and i have to upload new version from time to time, i know).
A problem could be, that loading the same library twice on one page usually fails. But i load things like vue.js or knockout (ok, a while ago) which are not used by the portal at all.

Hope this helps lifting some fog,
Christian

Was this reply helpful? Yes No