Визуализация воронки на основе данных

Данная воронка строится автоматически на основе специальной разметки (вы можете подобную разметку подготовить в SQL формы). 

<div class="as-funnel "
     data-width="400" data-height="200" 
     data-half="0" data-padding="10" data-labelFormat="title: value" >
  <i data-color="#ED5565" data-value="7000" data-title="Первый"></i>
  <i data-color="#FC6D58" data-value="4000" data-title="Второй"></i>
  <i data-color="#46CFB0" data-value="2000" data-title="Третий"></i>
  <i data-color="#9FD477" data-value="1000" data-title="Четвертый"></i>
  <i data-color="#ED87BD" data-value="300" data-title="Пятый"></i>
</div>
 

Параметры: 

• width, height - ширина, высота воронки
• half - если 1, то будет рисоваться половинка воронки
• padding - зазор в пикселях между сегментами
• labelFormat - в каком формате выводить заметку (переменные value, title заменяются на значения из сегмента). 
• Внутри контейнера указываем теги i с color, value и title - цвет сегмента, значение и название.