How to do data visualizations using colors in Salesforce using LWC?

Do you wish to organize and declutter your data? With our solution, you can display colorful values in the data table based on the Picklist value. If you want to achieve all this, then you are in the right place. This solution will tell you How to do data visualizations in Salesforce LWC using colors?

Why would you choose to use this solution? This solution will help you to do the following;

  • Organize,
  • Declutter,
  • And, Easily find values among lots of data.

See what you’ll be able to achieve and grab the code for this solution from below!

The below screenshot represents all lead records of a business. It includes First Name, Last Name, Company, and Lead Status. Lead Status contains our Picklist Values. Here, we have used different colors to differentiate various Lead Statuses. Color Yellow depicts working- Not contacted, color Orange represents Open- Not contacted, color Green shows that the lead has been closed but Not Converted. Finally, the color Pink represents that the lead is closed and Converted.

Output:

data visualizations in Salesforce LWC

Codes:

LeadList.html

LeadList.js

LeadList.js-meta.xml

APEX Class

LeadStatusColour.html

LeadStatusColour.js

LeadStatusColour.css

LeadStatusColour.js-meta.xml

Conclusion

Wasn’t this solution just great? Do follow us on our social media handles to stay updated with our latest blogs. If you try out this solution, then do share your experiences with us. We will be back with another blog soon that will help you succeed with Salesforce. Till then, Happy Learning! 🙂

Our Location worldwide
India
3rd Floor, A-10, Pegasus Tower, Sector 68, Noida, Uttar Pradesh 201301 +91-1203117884
SR Tower 2nd Floor Hydel Gate Haldwani Uttarakhand 263126 +91-5946359996
USA
333 West Brown Deer Road Unit G – 366 Milwaukee WI, USA 53217 +1(262) 310-7818
UK
7 Bell Yard, London, WC2A 2JR +44 20 3239 9428
Canada
HIC Global Solutions INC
43 Lafferty Lane, Richmond Hill, L4C 3N8, CA +1(262) 310-7818