Unable to Render Org Chart in Lightning Web Component (LWC)

[saitejagit1247]

I am experiencing difficulties rendering the Org Chart using the BalkanOrgChart library within a Salesforce Lightning Web Component (LWC). Despite loading the script successfully,

i am able to see only black screen in Salesforce

Could you please provide assistance or guidance on why the Org Chart is not rendering as expected within the LWC? Any insights or recommendations to resolve this issue would be greatly appreciated.

[ZornitsaPesheva]

Please get the lates version, clear the browser cache and try again. If you still have the issue, please send us the result of these: console.log(OrgChart.VERSION) console.log(OrgChart.isTrial())

[saitejagit1247]

Hi i have added the console statements and i got

[ZornitsaPesheva]

I just have tested it with the latest version and it works okay:

Please follow the doc page to create a simple brand new component for test: https://balkan.app/OrgChartJS/Docs/Salesforce If it still does not work, your trial may have expired.

[saitejagit1247]

Hey Thanks for the reference doc you have provided and now i am able to render the chart it was not rendering because i did not add "https://*.azurewebsites.net" in the "Trusted Site"

Thanks for all the help

[ZornitsaPesheva]

Great. Thank you for the update.

[saitejagit1247]

Hey can you also let me know if we can move the tiles around i want to drag and drop the tiles into diff positions on the screen

can we do that if yes please guide me how to do that

[ZornitsaPesheva]

Please check if this is what you need?: https://balkan.app/OrgChartJS/Docs/DragAndDrop#movable

[saitejagit1247]

Yes that was what i wanted thanks

[saitejagit1247]

Can you also help me on drag and drop from another div so that we can add a new node to the orgchart

[ZornitsaPesheva]

Drag and drop from another div: https://code.balkan.app/org-chart-js/draganddrop-from-another-element#JS

but you can also do it without another div: https://code.balkan.app/org-chart-js/draganddrop-items-to-the-chart#JS

[saitejagit1247]

thanks for the help

can you also help me with this

what exactly the reason to perform this step can you please provide me with a detailed explanation regarding the details of the steps like why do we need to do this and also what exactly it does in the backend

[ZornitsaPesheva]

Because the trial version makes requests to our Azure servers. You can see here how it works.

[saitejagit1247]

thanks for the help can you also let me know this we wanted to use this in our new salesforce product which version do we need get and also if we use this in our salesforce product will it pass all the security reviews and legal procedures that salesforce check

Please let me know if anything else i need to know regarding this

[ZornitsaPesheva]

We have lot of customers that are using it in Salesforce, so most probably it pass the tests. If you are using it for one single domain, the Professional license should be enough, but if are using it for SaaS or multiple domains/subdomains, you will need the Premium license.

[saitejagit1247]

Thank You for the details

if you can provide any salesforce app exchange products that are using Balkan.js that will be more helpful

[saitejagit1247]

Hey i also want to know one more thing i want to use the default search in balakan.js to do an apex call from my LWC is it possible ..if YES can you please guide me

[ZornitsaPesheva]

You ca search using the functions if this is what you mean: https://balkan.app/OrgChartJS/Docs/Search#function

[saitejagit1247]

i have referred the above link but i am looking for something diff i want to know when the user type something in the search box and i want to capture that data to get the data from the database and show them on the search results

but in the above example search is happening only on the data that is already in the UI

[ZornitsaPesheva]

Here is code example: https://code.balkan.app/search-customization#JS