2016-08-26 5 views
6

Необходимо создать пользовательский элемент управления для диаграммы последовательности в iOS (либо в Swift, либо Objective-C).Создание диаграммы воронки в iOS?

Найдено Несколько библиотека для него: вот ссылка: https://github.com/ayudasystems/funnel

Планирование использовать BezierPath для реализации Воронка Chart.

Просьба указать структуру данных , которым необходимо реализовать этот элемент управления.

** Примечание - Поиск много поста, но вмятина найти точное решение для реализации Воронки диаграммы в ИО (несколько сообщений есть, но ответы не верны или принято)

+0

Если у вас есть образец кода, вы также должны иметь c ода, используемая для генетизации. –

+0

его библиотека cocoapod, так что доступ к ней имел много функциональности, после прохождения этих я создаю контроль –

ответ

2

enter image description here

Вы должны использовать простую логику для реализации выше воронки диаграммы.

Есть 5 вещей: A1, A2, A3, A4, A5 иворонки является высота .

& & А1 = 30%, А2 = 25%, А3 = 20%, А4 = 15% и 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 . 

Логика в Вычислить Высота распределения

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

0

«Структура данных» должно быть простыми: массив значений от 0,0 до 100,0, каждое значение, представляющее либо горизонтальную прямоугольную полосу, либо трапецию для части воронки, с индикатором, показывающим, где он изменяется от прямоугольников до трапеций, плюс цвета для каждого из сегментов.

Начните с простого, а затем продолжайте украшать изображение с промежутками между сегментами, тенями и т. Д. Сделав статическую версию, вы должны перейти к слоям для получения анимации.

+0

любая ссылка или ссылка могли бы помочь мне создать это. –