Редизайн дешборда qlikview в qlik sense, data-daily

Для старту нам буде потрібно:

Крок 1. Завантаження даних

Отже, завантажуємо дані з завантаженого додатки (Exercise app.qvw)

Редизайн дешборда qlikview в qlik sense, data-daily

  1. Зберігаємо наші настройки і завантажуємо дані. Після завершення операції, всі дані будуть завантажені в наше новий додаток Qlik Sense.
  2. Далі нам потрібно додати три колірні змінні. Для цього додати такий скрипт:

Крок 2. Починаємо дизайн програми

Редизайн дешборда qlikview в qlik sense, data-daily







По-перше, додаємо новий лист в додаток Qlik Sense.

Отже, називаємо наш лист "Dashboard" і переходимо до створення візуалізації з додаванням об'єктів листа.

Крок 3. Створюємо візуалізацію KPI

Щоб створити візуалізацію вище:

  1. На аркуші натисніть Правка 'Edit'.
    2. Додати об'єкт Текст і малюнок ( 'Text and Image') в верхній лівий кут листа
    3. Налаштувати розмір об'єкта на 1 * 2 осередки.
    4. Додати текст Замовлення ( 'Orders').
    5. Щоб показати цифру поряд з цим заголовком, нам потрібно додати вираз до Замовлення ( 'Orders'):

НА ЗАМІТКУ! Найкраще додавати ці такі вирази в репозиторій Master Measures. Так ви зможете використовувати ці заходи в подальшому і централізувати управління виразами в Qlik Sense.

Отже, створюємо наші майстер-вирази:

Після цього можна створити все текстові об'єкти зі зв'язаними значеннями, як на скріншоті вище.

Такий роздільник допомагає візуально розмежувати наші текстові об'єкти з KPI від інших графіків і розділів нашого дешборда.

Для того щоб додати цей елемент дизайну, робимо наступне:

  1. Додаємо на робочу область текстовий об'єкт.
  2. Заходимо в властивості об'єкта праворуч: Зовнішній вигляд> Шпалери> Вибрати малюнок (Appearance> Background image> Select an image).
    3. Додаємо малюнок 'Hairline.png'.
    4. Маємо малюнок на робочій області документа Qlik Sense. Вибираємо центр щодо горизонталі і вертикалі малюнка.

Крок 5. Діаграма «Динаміка доходів»

Редизайн дешборда qlikview в qlik sense, data-daily

Для створення цієї діаграми робимо наступне:

  1. Перетягуємо гистограмму на робочу область листа.
    2. Додаємо два виміри: Рік і Квартал.
  2. Додаємо Дохід ( 'Revenue') в якості запобіжного, вибираємо значення з майстер-виразів, які створили раніше.
  3. Міняємо порядок сортування періоду за спаданням, оскільки будемо показувати останні роки спочатку.
    5. Розміщуємо цю діаграму під підсумковими значеннями вгорі. Приклад розташування можна подивитися в самому початку посту.
    6. Щоб дизайн був єдиним, додаємо після діаграми роздільник, як на попередньому кроці

Тепер наш дизайн виглядає так:

Редизайн дешборда qlikview в qlik sense, data-daily
Крок 6. Бульбашкова діаграма по клієнтам (аналітика по доходах і валового прибутку в%)

Редизайн дешборда qlikview в qlik sense, data-daily

Для того щоб додати цей графік, робимо наступне:

  1. Перетягуємо бульбашкову діаграму в праву частину робочої області листа.
    2. Вибираємо клієнта ( 'Customer') в якості вимірювання.
    3. Додаємо два значення: Дохід і Валовий прибуток% (виберіть з ваших майстер-виразів).
  2. Також можемо налаштувати зовнішній вигляд осей і змінити їх масштаб, якщо вважаєте за необхідне.
    5. Додаємо заголовок діаграми.
  3. Графік повинен займати 7 * 13 осередків на наявної робочої області справа вгорі.






Щоб зробити цю діаграму більш наочною, можна додати кольору в залежності від показників. Для цього використовуємо функцію colormix в:

Зовнішній вигляд> Кольори і легенда> Вибрати Колір за виразом (Appearance> Colors and legend> Choose 'Color by expression').

ColorMix1 ((1 + Sign (2 * ((sum (SalesPrice * Quantity) - sum ((CostPrice) * Quantity) -

sum ((SalesPrice * Quantity) * FixedCostFactor)) / sum (SalesPrice * Quantity) - RangeMin (top (total (sum (SalesPrice * Quantity) - sum ((CostPrice) * Quantity) -

sum ((SalesPrice * Quantity) * FixedCostFactor)) / sum (SalesPrice * Quantity). 1. NoOfRows (total)))) / (RangeMax (top (total (sum (SalesPrice * Quantity) - sum ((CostPrice) * Quantity) -

sum ((SalesPrice * Quantity) * FixedCostFactor)) / sum (SalesPrice * Quantity). 1. NoOfRows (total))) - RangeMin (top (total (sum (SalesPrice * Quantity) - sum ((CostPrice) * Quantity) -

sum ((SalesPrice * Quantity) * FixedCostFactor)) / sum (SalesPrice * Quantity). 1. NoOfRows (total)))) - 1) * Sqrt (Fabs ((2 * ((sum (SalesPrice * Quantity) - sum ((CostPrice) * Quantity) -

sum ((SalesPrice * Quantity) * FixedCostFactor)) / sum (SalesPrice * Quantity) - RangeMin (top (total (sum (SalesPrice * Quantity) - sum ((CostPrice) * Quantity) -

sum ((SalesPrice * Quantity) * FixedCostFactor)) / sum (SalesPrice * Quantity). 1. NoOfRows (total)))) / (RangeMax (top (total (sum (SalesPrice * Quantity) - sum ((CostPrice) * Quantity) -

sum ((SalesPrice * Quantity) * FixedCostFactor)) / sum (SalesPrice * Quantity). 1. NoOfRows (total))) - RangeMin (top (total (sum (SalesPrice * Quantity) - sum ((CostPrice) * Quantity) -

sum ((SalesPrice * Quantity) * FixedCostFactor)) / sum (SalesPrice * Quantity). 1. NoOfRows (total)))) - 1)))) / 2.

Після цього додаємо розділову лінію і отримуємо:

Редизайн дешборда qlikview в qlik sense, data-daily
Червона стрілка показує, чого ми ще не зробили. Наступний крок - додати вертикальну розділову лінію.

Крок 7. Матрична діаграма по продуктових групах

Редизайн дешборда qlikview в qlik sense, data-daily

Звичайно, для порівняння продуктових груп матрична діаграма - не найкраще рішення, але для прикладу все-таки розповім, як її створити в Qlik Sense:

  1. Перетягніть матричну діаграму в правий верхній кут робочої області, відразу за розділової лінією.
  2. Додайте продуктову групу в якості вимірювання.
  3. Додайте в якості запобіжного Дохід ( 'Revenue').
  4. Додайте заголовок.
  5. І в настройках зовнішнього вигляду в Кольорі (Appearance> Colors add), додайте вираз до Валовий прибуток в%:

ColorMix1 ((1 + Sign (2 * ((sum (SalesPrice * Quantity) - sum ((CostPrice) * Quantity) -

sum ((SalesPrice * Quantity) * FixedCostFactor)) / sum (SalesPrice * Quantity) - RangeMin (top (total (sum (SalesPrice * Quantity) - sum ((CostPrice) * Quantity) -

sum ((SalesPrice * Quantity) * FixedCostFactor)) / sum (SalesPrice * Quantity). 1. NoOfRows (total)))) / (RangeMax (top (total (sum (SalesPrice * Quantity) - sum ((CostPrice) * Quantity) -

sum ((SalesPrice * Quantity) * FixedCostFactor)) / sum (SalesPrice * Quantity). 1. NoOfRows (total))) - RangeMin (top (total (sum (SalesPrice * Quantity) - sum ((CostPrice) * Quantity) -

sum ((SalesPrice * Quantity) * FixedCostFactor)) / sum (SalesPrice * Quantity). 1. NoOfRows (total)))) - 1) * Sqrt (Fabs ((2 * ((sum (SalesPrice * Quantity) - sum ((CostPrice) * Quantity) -

sum ((SalesPrice * Quantity) * FixedCostFactor)) / sum (SalesPrice * Quantity) - RangeMin (top (total (sum (SalesPrice * Quantity) - sum ((CostPrice) * Quantity) -

sum ((SalesPrice * Quantity) * FixedCostFactor)) / sum (SalesPrice * Quantity). 1. NoOfRows (total)))) / (RangeMax (top (total (sum (SalesPrice * Quantity) - sum ((CostPrice) * Quantity) -

sum ((SalesPrice * Quantity) * FixedCostFactor)) / sum (SalesPrice * Quantity). 1. NoOfRows (total))) - RangeMin (top (total (sum (SalesPrice * Quantity) - sum ((CostPrice) * Quantity) -

sum ((SalesPrice * Quantity) * FixedCostFactor)) / sum (SalesPrice * Quantity). 1. NoOfRows (total)))) - 1)))) / 2.

Редизайн дешборда qlikview в qlik sense, data-daily
Отже, заключний крок: для створення сітчастої діаграми в Qlik Sense скористаємося розширенням, яке було люб'язно створено нашими західними колегами. Його можна завантажити за посиланням:

Після того, як ви скачаєте розширення, ви повинні витягти його в наступну директорію: C: \ Users \ \ Documents \ Qlik \ Sense \ Extensions

Ось тепер після цього можемо додати сітчасту діаграму в Qlik Sense. Для цього робимо наступне:

  1. Отже, додаємо нову міру і використовуємо вираз, яке вже використовували в роботі з кольором для Валовий прибуток (Gross Margin%).
  2. Ну, і, звичайно, додаємо заголовок діаграмі.

На замітку: В Qlik Sense є можливість працювати з кольором у Зовнішньому вигляді ( 'Appearance' - 'Color'), але тільки в шістнадцятковому форматі (наприклад, # 000000 для чорного).

Тепер отримали наш підсумковий результат:

Редизайн дешборда qlikview в qlik sense, data-daily