Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Creating Funnel Chart in iOS?

Need to create Custom control for Funnel Chart in iOS ( Either in Swift or Objective - C ) .

Found Few library for it : here is link : https://github.com/ayudasystems/funnel

Planning to use BezierPath to implement Funnel Chart .

Kindly suggest the Data Structure which needs to implement this control .

**Note - Search lot of post but dint find the exact solution to implement Funnel chart in ios ( few posts are there but answers are not correct or accepted)

like image 711
Shobhakar Tiwari Avatar asked Aug 26 '16 07:08

Shobhakar Tiwari


People also ask

How do you use a funnel chart?

A funnel chart helps you visualize a linear process that has sequential, connected stages. For example, a sales funnel that tracks customers through stages: Lead > Qualified Lead > Prospect > Contract > Close. At a glance, the shape of the funnel conveys the health of the process you're tracking.


1 Answers

enter image description here

You have to use simple logic to implement above funnel chart.

There are 5 items : A1,A2,A3,A4,A5 and funnel is height of 200.

&& A1=30% ,A2=25% , A3=20%, A4=15% and A5=10%

Now distritribute items according to height % in funnel. So

A1 = 0.3*200  = 60
A2 = 0.25*200 = 50
A3 = 0.2*200  = 40
A4 = 0.15*200 = 30
A5 = 0.1*200  = 20
--------------------
Total         = 200


On the basis of above calculated height:- 5 different BezierPath can  be drawn . 

Above data can be generalised to 'n' items and 'x' Height .

Logic to Calculate height Distribution

class HeightDistribution {
   class func  height(percentages: [Float] , TotalHeight:Float ) -> [Float]  
      {
        var heights = [Float]()
        for percentage in   percentages
        {
           let height = (percentage/100)*TotalHeight
            heights.append(height)
        }
        return heights
    }
}

Progress Demo Funnel Chart app || Swift3

like image 91
Shrawan Avatar answered Oct 02 '22 19:10

Shrawan