Simple Funnel Chart Using SVG & Javascript
Hey fellow brovelopers! Recently, I was tasked with requirements of creating a sales funnel widget for a CRM that I am working in. I checked around in the internet and found a lot of great options, but in the end they were all too “heavy” for my needs. I didn’t want to have to link or incorporate and entire javascript library for the need of just one type of graph. I wanted something lightweight and simple, so I created my own simple funnel chart that utilizes SVG and JavaScript.
The funnel chart is scalable with as many levels or stages that you want to include and resizes automatically depending on your view port.
The JavaScript is set up in an object oriented style with a constructer function that accepts a single parent array of data. How you choose to pass that data to the class is completely up to you. I’ve also created the base html necessary for the graph to build, just drop it into your (html) template or view file.
I have documented and placed all the code on GitHub for download. Let me know if you use it in your project! I would love feedback and to see it implemented!
No Comments