Last active
June 7, 2022 01:47
-
-
Save khurchla/8b2414b939cf6239ee0ba3b7853b19f3 to your computer and use it in GitHub Desktop.
demo example of whylogs v1 profile visualizer summary drift report to compare two data profile views
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| { | |
| "cells": [ | |
| { | |
| "cell_type": "markdown", | |
| "metadata": {}, | |
| "source": [ | |
| "## Compare Wine Quality in a Summary Drift Report" | |
| ] | |
| }, | |
| { | |
| "cell_type": "code", | |
| "execution_count": 1, | |
| "metadata": {}, | |
| "outputs": [ | |
| { | |
| "data": { | |
| "text/html": [ | |
| "<div></div><iframe srcdoc=\"<!DOCTYPE html>\n", | |
| "<html lang="en">\n", | |
| " <head>\n", | |
| " <meta charset="UTF-8" />\n", | |
| " <meta http-equiv="X-UA-Compatible" content="IE=edge" />\n", | |
| " <meta name="viewport" content="width=device-width, initial-scale=1.0" />\n", | |
| " <meta name="description" content="" />\n", | |
| " <meta name="author" content="" />\n", | |
| "\n", | |
| " <title>Profile Visualizer | whylogs</title>\n", | |
| "\n", | |
| " <link rel="icon" href="images/whylabs-favicon.png" type="image/png" sizes="16x16" />\n", | |
| " <link rel="preconnect" href="https://fonts.googleapis.com" />\n", | |
| " <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />\n", | |
| " <link href="https://fonts.googleapis.com/css2?family=Asap:wght@400;500;600;700&display=swap" rel="stylesheet" />\n", | |
| " <link rel="preconnect" href="https://fonts.gstatic.com" />\n", | |
| " <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" />\n", | |
| "\n", | |
| " <script\n", | |
| " src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.7.7/handlebars.min.js"\n", | |
| " integrity="sha512-RNLkV3d+aLtfcpEyFG8jRbnWHxUqVZozacROI4J2F1sTaDqo1dPQYs01OMi1t1w9Y2FdbSCDSQ2ZVdAC8bzgAg=="\n", | |
| " crossorigin="anonymous"\n", | |
| " referrerpolicy="no-referrer"\n", | |
| " ></script>\n", | |
| "\n", | |
| " <style type="text/css">\n", | |
| " :root {\n", | |
| " /* CONSTANTS */\n", | |
| " --SIDE-PANEL-WIDTH: 320px;\n", | |
| " --PROPERTY-PANEL-WIDTH: 420px;\n", | |
| "\n", | |
| " /* COLOR VARIABLES */\n", | |
| " /** Standard colors */\n", | |
| " --red: #d11010;\n", | |
| " --orange: #f07028;\n", | |
| " --yellow: #faaf40;\n", | |
| " --olive: #b5cc18;\n", | |
| " --green: #1dbb42;\n", | |
| " --teal: #00b5ad;\n", | |
| " --blue: #2683c9;\n", | |
| " --violet: #6435c9;\n", | |
| " --purple: #a333c8;\n", | |
| " --pink: #ed45a4;\n", | |
| " --brown: #ac724d;\n", | |
| " --grey: #778183;\n", | |
| " --black: #1b1c1d;\n", | |
| " --white: #ffffff;\n", | |
| "\n", | |
| " /** Branded colors */\n", | |
| " --brandPrimary900: #0e7384;\n", | |
| " --brandPrimary800: #228798;\n", | |
| " --brandPrimary700: #369bac;\n", | |
| " --brandPrimary600: #4aafc0;\n", | |
| " --brandPrimary500: #5ec3d4;\n", | |
| " --brandPrimary400: #72d7e8;\n", | |
| " --brandPrimary300: #86ebfc;\n", | |
| " --brandPrimary200: #a6f2ff;\n", | |
| " --brandPrimary100: #cdf8ff;\n", | |
| " --brandSecondary900: #4f595b;\n", | |
| " --brandSecondary800: #636d6f;\n", | |
| " --brandSecondary700: #778183;\n", | |
| " --brandSecondary600: #8b9597;\n", | |
| " --brandSecondary500: #9fa9ab;\n", | |
| " --brandSecondary400: #b3bdbf;\n", | |
| " --brandSecondary300: #c7d1d3;\n", | |
| " --brandSecondary200: #dbe5e7;\n", | |
| " --brandSecondary100: #ebf2f3;\n", | |
| " --secondaryLight1000: #313b3d;\n", | |
| " --brandRed4: #b30000;\n", | |
| " --brandRed3: #d72424;\n", | |
| " --brandRed2: #eb5656;\n", | |
| " --brandRed1: #ff8282;\n", | |
| " --night1: #021826;\n", | |
| " /** Purpose colors */\n", | |
| " --textColor: #4f595b;\n", | |
| " --linkColor: #369bac;\n", | |
| " --infoColor: #2683c9;\n", | |
| " --warningColor: #faaf40;\n", | |
| " --tealBackground: #eaf2f3;\n", | |
| " --pageBackground: #e5e5e5;\n", | |
| " --contrastTableRow: #fafafa;\n", | |
| " --whiteBackground: #ffffff;\n", | |
| " --primaryBackground: #e5e5e5;\n", | |
| " }\n", | |
| "\n", | |
| " /* RESET STYLE */\n", | |
| " *,\n", | |
| " *::after,\n", | |
| " *::before {\n", | |
| " margin: 0;\n", | |
| " padding: 0;\n", | |
| " box-sizing: border-box;\n", | |
| " font-family: "Asap", Arial, Helvetica, sans-serif;\n", | |
| " }\n", | |
| "\n", | |
| " /*\n", | |
| " * Main content\n", | |
| " */\n", | |
| " .main {\n", | |
| " position: relative;\n", | |
| " background: #FFFFFF;\n", | |
| " border: 1px solid #DBE5E7;\n", | |
| " box-sizing: border-box;\n", | |
| " border-radius: 4px;\n", | |
| " }\n", | |
| " .main .page-header {\n", | |
| " margin-top: 0;\n", | |
| " }\n", | |
| "\n", | |
| " /* CSS DIV TABLE BASIC STYLE */\n", | |
| "\n", | |
| " .wl-table-row .wl-table-head:first-child {\n", | |
| " min-width: 360px;\n", | |
| " z-index: 2;\n", | |
| " }\n", | |
| "\n", | |
| " .wl-table-wrap {\n", | |
| " position: relative;\n", | |
| " overflow: auto;\n", | |
| " }\n", | |
| "\n", | |
| " .wl-table {\n", | |
| " display: table;\n", | |
| " width: 100%;\n", | |
| " }\n", | |
| "\n", | |
| " .row>* {\n", | |
| " padding-right: 0 !important;\n", | |
| " padding-left: 0 !important;\n", | |
| " }\n", | |
| "\n", | |
| " .wl-table-row {\n", | |
| " display: table-row;\n", | |
| " }\n", | |
| "\n", | |
| " .wl-table-row:hover,\n", | |
| " .wl-table-row:hover .wl-table-cell:first-child {\n", | |
| " background-color: var(--brandSecondary100);\n", | |
| " }\n", | |
| " .wl-table-row--clickable:hover .wl-table-cell__title-button {\n", | |
| " visibility: visible;\n", | |
| " }\n", | |
| "\n", | |
| " .wl-table-heading {\n", | |
| " position: relative;\n", | |
| " z-index: 1;\n", | |
| " display: table-header-group;\n", | |
| " font-weight: 700;\n", | |
| " }\n", | |
| "\n", | |
| " .wl-table-cell,\n", | |
| " .wl-table-head {\n", | |
| " border-bottom: 1px solid var(--brandSecondary200);\n", | |
| " display: table-cell;\n", | |
| " padding: 12px 18px;\n", | |
| " }\n", | |
| "\n", | |
| " .wl-table-cell {\n", | |
| " font-size: 14px;\n", | |
| " }\n", | |
| "\n", | |
| " .wl-table-cell--top-spacing {\n", | |
| " padding-top: 35px; /* cell-top-padding + cell-title-height */\n", | |
| " }\n", | |
| "\n", | |
| " .wl-table-head-wraper {\n", | |
| " background-color: var(--white);\n", | |
| " }\n", | |
| "\n", | |
| " .wl-table-head {\n", | |
| " position: sticky;\n", | |
| " left: 0;\n", | |
| " min-width: 100px;\n", | |
| " border-bottom: 2px solid var(--brandSecondary100);\n", | |
| " font-size: 12px;\n", | |
| " line-height: 1.67;\n", | |
| " white-space: nowrap;\n", | |
| " }\n", | |
| "\n", | |
| " .wl-sub-table-head {\n", | |
| " position: relative;\n", | |
| " }\n", | |
| "\n", | |
| " .wl-table-body {\n", | |
| " display: table-row-group;\n", | |
| " }\n", | |
| "\n", | |
| " .wl-table-row .wl-table-cell:first-child{\n", | |
| " position: sticky;\n", | |
| " left: 0;\n", | |
| " background-color: var(--white);\n", | |
| " border-right-width: 2px;\n", | |
| " }\n", | |
| "\n", | |
| " /* Table custom style */\n", | |
| "\n", | |
| " .wl-table-cell__title-wrap {\n", | |
| " display: flex;\n", | |
| " justify-content: space-between;\n", | |
| " }\n", | |
| "\n", | |
| " .wl-table-cell__title {\n", | |
| " height: 25px;\n", | |
| " margin: 0;\n", | |
| " font-size: 14px;\n", | |
| " font-weight: 700;\n", | |
| " overflow: hidden;\n", | |
| " white-space: nowrap;\n", | |
| " text-overflow: ellipsis;\n", | |
| " }\n", | |
| "\n", | |
| " .wl-table-cell__bedge-wrap {\n", | |
| " padding: 2px 0;\n", | |
| " white-space: nowrap;\n", | |
| " overflow: hidden;\n", | |
| " font-style: italic;\n", | |
| " text-align: center;\n", | |
| " color: var(--brandSecondary400);\n", | |
| " }\n", | |
| " .wl-table-cell__bedge {\n", | |
| " height: 24px;\n", | |
| " margin: 1px;\n", | |
| " padding: 2px 8px;\n", | |
| " border: 1px solid var(--brandSecondary400);\n", | |
| " font-style: normal;\n", | |
| " color: var(--brandSecondary900);\n", | |
| " border-radius: 20px;\n", | |
| " white-space: nowrap;\n", | |
| " }\n", | |
| "\n", | |
| " /* Property side panel */\n", | |
| "\n", | |
| " .wl-compare-profile {\n", | |
| " position: relative;\n", | |
| " left: 0;\n", | |
| " padding: 18px;\n", | |
| " background: var(--white);;\n", | |
| " border-bottom: 1px solid var(--brandSecondary200);\n", | |
| " }\n", | |
| "\n", | |
| " /* Screen on smaller screens */\n", | |
| " .no-responsive {\n", | |
| " display: none;\n", | |
| " position: fixed;\n", | |
| " top: 0;\n", | |
| " left: 0;\n", | |
| " z-index: 1031;\n", | |
| " width: 100vw;\n", | |
| " height: 100vh;\n", | |
| " background-color: var(--tealBackground);\n", | |
| " display: flex;\n", | |
| " align-items: center;\n", | |
| " justify-content: center;\n", | |
| " }\n", | |
| "\n", | |
| " .no-responsive__content {\n", | |
| " max-width: 600px;\n", | |
| " width: 100%;\n", | |
| " padding: 0 24px;\n", | |
| " }\n", | |
| "\n", | |
| " .no-responsive__title {\n", | |
| " font-size: 96px;\n", | |
| " font-weight: 300;\n", | |
| " color: var(--brandSecondary900);\n", | |
| " line-height: 1.167;\n", | |
| " }\n", | |
| "\n", | |
| " .no-responsive__text {\n", | |
| " margin: 0;\n", | |
| " font-size: 16px;\n", | |
| " font-weight: 400;\n", | |
| " color: var(--brandSecondary900);\n", | |
| " line-height: 1.5;\n", | |
| " }\n", | |
| "\n", | |
| " .space-between {\n", | |
| " display: flex;\n", | |
| " justify-content: space-between;\n", | |
| " }\n", | |
| "\n", | |
| " .align-items {\n", | |
| " display: flex;\n", | |
| " align-items: center;\n", | |
| " }\n", | |
| "\n", | |
| " .display-flex{\n", | |
| " display: flex;\n", | |
| " }\n", | |
| "\n", | |
| " .table-border-none {\n", | |
| " padding: 0;\n", | |
| " border: none;\n", | |
| " }\n", | |
| "\n", | |
| " .flex-direction-colum {\n", | |
| " display: flex;\n", | |
| " flex-direction: column;\n", | |
| " }\n", | |
| "\n", | |
| " .align-items {\n", | |
| " align-items: center;\n", | |
| " }\n", | |
| "\n", | |
| " .search-input{\n", | |
| " padding-top: 0 !important;\n", | |
| " padding-bottom: 0 !important;\n", | |
| " }\n", | |
| "\n", | |
| " .search-input input{\n", | |
| " border: none;\n", | |
| " background: none;\n", | |
| " outline: none;\n", | |
| " height: 40px;\n", | |
| " width: 100%;\n", | |
| " font-size: 14px;\n", | |
| " }\n", | |
| "\n", | |
| " .search-input img{\n", | |
| " height: 19px;\n", | |
| " pointer-events: none;\n", | |
| " }\n", | |
| "\n", | |
| " input::placeholder {\n", | |
| " color: var(--secondaryLight1000);\n", | |
| " }\n", | |
| "\n", | |
| " .text-align-center {\n", | |
| " text-align: center;\n", | |
| " }\n", | |
| "\n", | |
| " .text-align-end {\n", | |
| " text-align: end;\n", | |
| " }\n", | |
| "\n", | |
| " .drift-detection {\n", | |
| " justify-content: space-between;\n", | |
| " align-items: center;\n", | |
| " }\n", | |
| "\n", | |
| " .drift-detection-info-circle {\n", | |
| " width: 15px;\n", | |
| " height: 15px;\n", | |
| " border-radius: 50px;\n", | |
| " display: inline-block;\n", | |
| " margin-right: 8px;\n", | |
| " }\n", | |
| "\n", | |
| " .severe-drift-circle-color {\n", | |
| " background: #D40D00;\n", | |
| " }\n", | |
| "\n", | |
| " .moderate-drift-circle-color {\n", | |
| " background: #F5843C;\n", | |
| " }\n", | |
| "\n", | |
| " .mild-drift-circle-color {\n", | |
| " background: #F2C142;\n", | |
| " }\n", | |
| "\n", | |
| " .minimal-drift-circle-color {\n", | |
| " background: #ABCA52;\n", | |
| " }\n", | |
| "\n", | |
| " .drift-detection-info-drifts-item {\n", | |
| " padding-right: 20px;\n", | |
| " }\n", | |
| "\n", | |
| " .drift-detection-info-title {\n", | |
| " font-family: Arial;\n", | |
| " font-weight: bold;\n", | |
| " font-size: 16px;\n", | |
| " line-height: 130%;\n", | |
| " color: #313B3D;\n", | |
| " }\n", | |
| "\n", | |
| " .drift-detection-info-drifts-item-count {\n", | |
| " font-family: Arial;\n", | |
| " font-weight: bold;\n", | |
| " font-size: 14px;\n", | |
| " line-height: 16px;\n", | |
| " color: #000000;\n", | |
| " padding-right: 8px;\n", | |
| " }\n", | |
| "\n", | |
| " .drift-detection-info-drifts-item-name {\n", | |
| " font-family: Arial;\n", | |
| " font-style: normal;\n", | |
| " font-weight: normal;\n", | |
| " font-size: 12px;\n", | |
| " line-height: 14px;\n", | |
| " color: #000000;\n", | |
| " }\n", | |
| "\n", | |
| " .drift-detection-info-drifts-item-range {\n", | |
| " font-family: Arial;\n", | |
| " font-style: normal;\n", | |
| " font-weight: normal;\n", | |
| " font-size: 11px;\n", | |
| " line-height: 13px;\n", | |
| " color: #6C757D;\n", | |
| " }\n", | |
| "\n", | |
| " .drift-detection-search-input {\n", | |
| " display: flex;\n", | |
| " align-items: center;\n", | |
| " background: rgba(255, 255, 255, 0.7);\n", | |
| " border: 1px solid #DBE5E7;\n", | |
| " box-sizing: border-box;\n", | |
| " border-radius: 4px;\n", | |
| " width: 170px;\n", | |
| " padding-left: 10px;\n", | |
| " }\n", | |
| "\n", | |
| " .drift-detection-search-input img{\n", | |
| " margin-right: 5px;\n", | |
| " }\n", | |
| "\n", | |
| " .drift-detection-search-input input::placeholder {\n", | |
| " font-family: Arial;\n", | |
| " font-weight: normal;\n", | |
| " font-size: 13px;\n", | |
| " line-height: 16px;\n", | |
| " color: #313B3D;\n", | |
| " }\n", | |
| "\n", | |
| " .close-filter-button {\n", | |
| " display: flex;\n", | |
| " justify-content: center;\n", | |
| " align-items: center;\n", | |
| " background: rgba(255, 255, 255, 0.7);\n", | |
| " border: 1px solid #369BAC;\n", | |
| " box-sizing: border-box;\n", | |
| " border-radius: 4px;\n", | |
| " width: 40px;\n", | |
| " height: 40px;\n", | |
| " cursor: pointer;\n", | |
| " margin-left: 10px;\n", | |
| " }\n", | |
| "\n", | |
| " .filter-options-title {\n", | |
| " width: 240px;\n", | |
| " }\n", | |
| "\n", | |
| " .filter-options-title p {\n", | |
| " margin: 0;\n", | |
| " }\n", | |
| "\n", | |
| " .dropdown-container {\n", | |
| " position: absolute;\n", | |
| " right: 18px;\n", | |
| " z-index: 999;\n", | |
| " background: #FFFFFF;\n", | |
| " border: 1px solid #DBE5E7;\n", | |
| " box-sizing: border-box;\n", | |
| " box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.05);\n", | |
| " border-radius: 4px;\n", | |
| " padding: 10px !important;\n", | |
| " border: none !important;\n", | |
| " }\n", | |
| "\n", | |
| " .form-check-input:checked {\n", | |
| " background-color: #0E7384;\n", | |
| " border-color: #0E7384;\n", | |
| " }\n", | |
| "\n", | |
| " .form-check-input[type=checkbox] {\n", | |
| " border-radius: 2px;\n", | |
| " }\n", | |
| "\n", | |
| " .justify-content-center {\n", | |
| " justify-content: center;\n", | |
| " }\n", | |
| "\n", | |
| " .wl-table-cell__graph-wrap {\n", | |
| " width: 0;\n", | |
| " }\n", | |
| "\n", | |
| " .svg-container {\n", | |
| " display: inline-block;\n", | |
| " position: relative;\n", | |
| " width: 85%;\n", | |
| " padding-bottom: 17%;\n", | |
| " vertical-align: top;\n", | |
| " overflow: hidden;\n", | |
| " }\n", | |
| "\n", | |
| " .svg-content-responsive {\n", | |
| " display: inline-block;\n", | |
| " position: absolute;\n", | |
| " left: 0;\n", | |
| " }\n", | |
| "\n", | |
| " .reference-table-head {\n", | |
| " min-width: 250px;\n", | |
| " }\n", | |
| "\n", | |
| " .wl__dropdown_arrow-icon {\n", | |
| " position: relative;\n", | |
| " }\n", | |
| "\n", | |
| " .notif-circle-container{\n", | |
| " position: absolute;\n", | |
| " top: -4px;\n", | |
| " right: -4px;\n", | |
| " padding: 5.3px;\n", | |
| " border-radius: 50%;\n", | |
| " background-color: white;\n", | |
| " cursor: pointer;\n", | |
| " }\n", | |
| "\n", | |
| " .notif-circle {\n", | |
| " position: absolute;\n", | |
| " top: 2px;\n", | |
| " right: 2px;\n", | |
| " padding: 3.3px;\n", | |
| " border-radius: 50%;\n", | |
| " background-color: #F2994A;\n", | |
| " }\n", | |
| "\n", | |
| "\n", | |
| " .header-title {\n", | |
| " font-size: 26px;\n", | |
| " font-weight: 700;\n", | |
| " color: #444444;\n", | |
| " }\n", | |
| "\n", | |
| " .statistic-number-title {\n", | |
| " font-family: Arial;\n", | |
| " font-weight: normal;\n", | |
| " font-size: 14px;\n", | |
| " line-height: 20px;\n", | |
| " color: #6C757D;\n", | |
| " }\n", | |
| "\n", | |
| " .statistic-number {\n", | |
| " font-family: Arial;\n", | |
| " font-weight: bold;\n", | |
| " font-size: 20px;\n", | |
| " line-height: 140%;\n", | |
| " display: flex;\n", | |
| " align-items: center;\n", | |
| " color: #0E7384;\n", | |
| " }\n", | |
| "\n", | |
| " .statistic-measurement {\n", | |
| " font-size: 15px !important;\n", | |
| " margin-left: 3px;\n", | |
| " }\n", | |
| "\n", | |
| " .statistic-measurement-percent {\n", | |
| " font-size: 15px !important;\n", | |
| " }\n", | |
| "\n", | |
| " .question-mark {\n", | |
| " font-size: 10px;\n", | |
| " font-weight: 900;\n", | |
| " color: #0E7384;\n", | |
| " border-radius: 50px;\n", | |
| " border: 2px solid #0E7384;\n", | |
| " padding: 0px 4px;\n", | |
| " transition: 0.5s;\n", | |
| " cursor: pointer;\n", | |
| " }\n", | |
| "\n", | |
| " .question-mark:hover {\n", | |
| " color: white;\n", | |
| " background: #0E7384;\n", | |
| " border: 2px solid none;\n", | |
| " transition: 0.5s;\n", | |
| " }\n", | |
| "\n", | |
| " .tooltip-full-number {\n", | |
| " position: relative;\n", | |
| " display: inline-block;\n", | |
| " }\n", | |
| "\n", | |
| " .tooltip-full-number .tooltiptext {\n", | |
| " visibility: hidden;\n", | |
| " background: black;\n", | |
| " color: white;\n", | |
| " border: 1px solid black;\n", | |
| " text-align: start;\n", | |
| " padding: 3px;\n", | |
| " position: absolute;\n", | |
| " z-index: 1;\n", | |
| " top: 0;\n", | |
| " left: 100%;\n", | |
| " margin-left: 5px;\n", | |
| " opacity: 0;\n", | |
| " transition: opacity 0.5s;\n", | |
| " font-size: 13px;\n", | |
| " font-weight: normal;\n", | |
| " line-height: 100%;\n", | |
| " }\n", | |
| "\n", | |
| " .tooltip-full-number:hover .tooltiptext {\n", | |
| " visibility: visible;\n", | |
| " opacity: 1;\n", | |
| " }\n", | |
| "\n", | |
| " .display-flex {\n", | |
| " display: flex;\n", | |
| " }\n", | |
| "\n", | |
| " .flex-direction-column {\n", | |
| " flex-direction: column;\n", | |
| " }\n", | |
| "\n", | |
| " .justify-content-space-between {\n", | |
| " justify-content: space-between;\n", | |
| " }\n", | |
| "\n", | |
| " .justify-content-center {\n", | |
| " justify-content: center;\n", | |
| " }\n", | |
| "\n", | |
| " .align-items-center {\n", | |
| " align-items: center;\n", | |
| " }\n", | |
| "\n", | |
| " .padding-right-30 {\n", | |
| " padding-right: 30px;\n", | |
| " }\n", | |
| "\n", | |
| " .padding-5 {\n", | |
| " padding: 5px;\n", | |
| " }\n", | |
| "\n", | |
| " .text-color {\n", | |
| " color: var(--secondaryLight1000);\n", | |
| " }\n", | |
| "\n", | |
| " .error-message {\n", | |
| " display: flex;\n", | |
| " justify-content: center;\n", | |
| " align-items: center;\n", | |
| " color: rgb(255, 114, 71);\n", | |
| " font-size: 30px;\n", | |
| " font-weight: 900;\n", | |
| " }\n", | |
| "\n", | |
| " @media screen and (min-width: 500px) {\n", | |
| " .desktop-content {\n", | |
| " display: block;\n", | |
| " }\n", | |
| " .no-responsive {\n", | |
| " display: none;\n", | |
| " }\n", | |
| " }\n", | |
| " </style>\n", | |
| " </head>\n", | |
| "\n", | |
| " <body id="generated-html"></body>\n", | |
| "\n", | |
| " <script id="entry-template" type="text/x-handlebars-template">\n", | |
| " \n", | |
| " <div class="desktop-content">\n", | |
| " <div class="container-fluid">\n", | |
| " <div class="feature-summary-statistics-wrap">\n", | |
| " <div class="feature-summary-statistics">\n", | |
| " <div class="mb-4">\n", | |
| " <strong class="header-title">Profile Summary</strong>\n", | |
| " </div>\n", | |
| " <div class="display-flex statistics">\n", | |
| " <div class="padding-right-30">\n", | |
| " <div class="statistic-number-title">Observations</div>\n", | |
| " <div class="statistic-number">{{{observations this}}}</div>\n", | |
| " </div>\n", | |
| " <div class="padding-right-30">\n", | |
| " <div class="statistic-number-title">Missing Cells</div>\n", | |
| " <div class="statistic-number">\n", | |
| " {{{missingCells this}}}\n", | |
| " <div>{{{missingCellsPercentage this}}}</div>\n", | |
| " </div>\n", | |
| " </div>\n", | |
| " </div>\n", | |
| " </div>\n", | |
| " </div>\n", | |
| " <div class="row">\n", | |
| " <div class="main">\n", | |
| " <div class="wl-compare-profile" id="compare-profile">\n", | |
| " <div class="drift-detection-wrap">\n", | |
| " <div class="drift-detection display-flex">\n", | |
| " <div class="drift-detection-info flex-direction-colum">\n", | |
| " <div class="drift-detection-info-title-wrap display-flex">\n", | |
| " <p class="drift-detection-info-title">\n", | |
| " Drift detected in\n", | |
| " <span class="drift-count"></span>\n", | |
| " of\n", | |
| " <span class="all-features"></span>\n", | |
| " features\n", | |
| " </p>\n", | |
| " </div>\n", | |
| " <div class="drift-detection-info-drifts display-flex" id="drift-detection-info-drifts">\n", | |
| " </div>\n", | |
| " </div>\n", | |
| " <div class="drift-detection-search-input-wrap display-flex">\n", | |
| " <div class="drift-detection-search-input search-input">\n", | |
| " <input type="text" id="wl__feature-search" placeholder="Quick search..."/>\n", | |
| " <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAGdSURBVHgBpZK7TkJBEIZnZoVocdTYyQNALxpNKPQBMEaNJsbCRMKhl8ISWwt6AaksCF5iTHgAGhJD4AHkAaAzGiwUsjvOQnO4SYh/cXbPzO43OxcEj9Zy92EiFSXNIfvPyE1kKFfdoxJMENpP6DrvLC0vJoEwCgwto7DWcxoIIHBYbA3NmKwnDltjAeuZhyul1DaTTlfPB6Nt5Z53DOgky4P875+nlctY2+unjZviLklkJhi5bPUa3y/7qJuQUM7PinMy7CdQc1Gh16vnBxPzrMROmlKQEgKNASAHLQCmSIGpS75O+O5pdQAgVXaIqTkNwDDXHmcnW3VmHZoGMLoTsOt88+NrAMCIZdu+iLTyTwKRa1Md6YKfOgXbzO7K8sWku5u5RxcRV5EpPezrzcHGbXEXWaUkgkweZ/UC9YrK3zqggFw5FBZfm8EUavHj7AjAKpIvBDrGn+pNnlcyhYgqbcC41idr1gvB4SdZkDbzQa21gwv0Vj07aPTtL07XdDOyDXohCDNoHIRmAVRie20f+RKybRDQDvxHkXy/7b/DrayncLbMwQAAAABJRU5ErkJggg=="/>\n", | |
| " </div>\n", | |
| " <div class="wl__dropdown_arrow-icon">\n", | |
| " <div onclick="openFilter()" class="close-filter-button">\n", | |
| " <div class="display-flex close-filter-icon d-none">\n", | |
| " <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAALCAYAAACprHcmAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAADFSURBVHgBfY+xDcIwEEXvnLQBZQkYAEhDwwKpEEK0CCZgAEjJCEmgjYSAygxAHTZgFRSOsyUjY5mcZFnn/+78PwBXf3+MoKWUPuYjVBPFnTwpr9t/oNJfcTfXsAhRAlDqDhhQIPYgpAqNMDqcUqSAYZT1epr9gAHt6uXshvYme4DYHQJNDKh0dD0m5WXB10Y3Fqjtuh7fROn3oREDWxfeMLyRsMnc0OgDzdduaA0Pi3Plgr7Q2kaAePeBqh6rueSNBVt6fgCwBV1JLF3rlAAAAABJRU5ErkJggg=="/>\n", | |
| " </div>\n", | |
| " <div class="display-flex filter-icon">\n", | |
| " <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAPCAYAAADtc08vAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAACSSURBVHgBrZLBCYAwDEWTUjw7igcdwI1cxkNXUJzBEVzFAbSVKoKmaVrEB6GHJv/w+AACtRk7P9IONv1QOYUl96k0zv61m2tjARoLtSDI3EFsgIJ4uoXrMLazO72CRG2mzg/8BSdVlEjhpGZJjAWdAZJECpWalEhJSs1pHuUlMad5FFai1Lwg4Ckx1TxKIPFL8w55mEWd8VjPGAAAAABJRU5ErkJggg=="/>\n", | |
| " </div>\n", | |
| " </div>\n", | |
| " <span class="notif-circle-container">\n", | |
| " <span class="notif-circle"></span>\n", | |
| " </span>\n", | |
| " </div>\n", | |
| " </div>\n", | |
| " </div>\n", | |
| " </div>\n", | |
| " <div class="dropdown-container flex-direction-colum mb-2 d-none" id="dropdown-container">\n", | |
| " <div class="filter-options">\n", | |
| " <div class="filter-options-title space-between dropdown">\n", | |
| " <p>Filter by type</p>\n", | |
| " </div>\n", | |
| " <div class="form-check mb-1 mt-2">\n", | |
| " <input\n", | |
| " class="form-check-input wl__feature-filter-input"\n", | |
| " type="checkbox"\n", | |
| " name="checkbox"\n", | |
| " value="Discrete"\n", | |
| " id="inferredDiscrete"\n", | |
| " onclick="changeDiscreteValue()"\n", | |
| " checked\n", | |
| " />\n", | |
| " <label class="form-check-label" for="inferredDiscrete">\n", | |
| " Inferred discrete (<span class="wl__feature-count--discrete">{{getDiscreteTypeCount}}</span>)\n", | |
| " </label>\n", | |
| " </div>\n", | |
| " <div class="form-check mb-1">\n", | |
| " <input\n", | |
| " class="form-check-input wl__feature-filter-input"\n", | |
| " type="checkbox"\n", | |
| " name="checkbox"\n", | |
| " value="Non-discrete"\n", | |
| " id="inferredNonDiscrete"\n", | |
| " onclick="changeNonDiscreteValue()"\n", | |
| " checked\n", | |
| " />\n", | |
| " <label class="form-check-label" for="inferredNonDiscrete">\n", | |
| " Inferred non-discrete (<span\n", | |
| " class="wl__feature-count--non-discrete"\n", | |
| " >{{getNonDiscreteTypeCount}}</span>)\n", | |
| " </label>\n", | |
| " </div>\n", | |
| " <div class="form-check mb-1">\n", | |
| " <input\n", | |
| " class="form-check-input wl__feature-filter-input"\n", | |
| " type="checkbox"\n", | |
| " name="checkbox"\n", | |
| " value="Unknown"\n", | |
| " id="inferredUnknown"\n", | |
| " onclick="changeUnknwonValue()"\n", | |
| " checked\n", | |
| " />\n", | |
| " <label class="form-check-label" for="inferredUnknown">\n", | |
| " Unknown (<span class="wl__feature-count--unknown">{{getUnknownTypeCount}}</span>)\n", | |
| " </label>\n", | |
| " </div>\n", | |
| " </div>\n", | |
| " </div>\n", | |
| " </div>\n", | |
| " <div class="wl-table-wrap" id="table-content">\n", | |
| " <div class="wl-table">\n", | |
| " <div class="wl-table-heading">\n", | |
| " <div class="wl-table-row wl-table-row--bottom-shadow">\n", | |
| " <div class="wl-table-head wl-table-head-wraper">\n", | |
| " <div class="wl-table-head table-border-none graph-table-head">Target</div>\n", | |
| " <div class="wl-table-head table-border-none reference-table-head">Reference</div>\n", | |
| " </div>\n", | |
| " <div class="wl-table-head wl-sub-table-head text-align-center" id="diff-from-ref">\n", | |
| " p-value\n", | |
| " <div class="tooltip-full-number">\n", | |
| " <span class="question-mark">?</span>\n", | |
| " <span class="tooltiptext">\n", | |
| " <div class="mb-1">p-values are calculated with K-S test for numerical features and Chi-squared for categorical features.</div>\n", | |
| " </span>\n", | |
| " </div>\n", | |
| " </div>\n", | |
| " <div class="wl-table-head wl-sub-table-head text-align-center">Total count</div>\n", | |
| " <div class="wl-table-head wl-sub-table-head text-align-center">Mean</div>\n", | |
| " </div>\n", | |
| " </div>\n", | |
| " <ul class="wl-table-body wl__table-body" id="table-body">\n", | |
| "{{#each this.columns}} <li\n", | |
| " {{#if this.numberSummary}} class="wl-table-row wl-table-row--clickable" {{else}} class="wl-table-row" {{/if}}\n", | |
| " data-feature-name={{@key}}\n", | |
| " data-inferred-type={{inferredType this}}\n", | |
| " data-scroll-to-feature-name={{@key}}\n", | |
| " >\n", | |
| " <div class="wl-table-cell wl-table-cell__graph-wrap">\n", | |
| " <div class="wl-table-cell__title-wrap">\n", | |
| " <h4 class="wl-table-cell__title">{{@key}}</h4>\n", | |
| " <div></div>\n", | |
| " </div>\n", | |
| " <div class="display-flex">\n", | |
| " {{{getGraphHtml this}}}\n", | |
| " {{{getReferenceGraphHtml this}}}\n", | |
| " </div>\n", | |
| " </div>\n", | |
| " <div\n", | |
| " class="diff-from-ref-table-cell wl-table-cell wl-table-cell--top-spacing align-middle"\n", | |
| " style="max-width: 270px; padding-right: 18px"\n", | |
| " ><div class="wl-table-cell__bedge-wrap text-align-end">\n", | |
| " {{{getDiffFromRef this}}}\n", | |
| " </div></div><div\n", | |
| " class="wl-table-cell wl-table-cell--top-spacing align-middle"\n", | |
| " ><div class="text-align-end">{{totalCount this}}</div></div><div\n", | |
| " class="wl-table-cell wl-table-cell--top-spacing align-middle"\n", | |
| " ><div class="text-align-end">{{mean this}}</div></div>\n", | |
| " </li>\n", | |
| "{{/each}} </ul>\n", | |
| " </div>\n", | |
| " </div>\n", | |
| " </div>\n", | |
| " </div>\n", | |
| " </div>\n", | |
| " </div>\n", | |
| " <div class="no-responsive">\n", | |
| " <div class="no-responsive__content">\n", | |
| " <h1 class="no-responsive__title">Hold on! :)</h1>\n", | |
| " <p class="no-responsive__text">\n", | |
| " It looks like your current screen size or device is not yet supported by the WhyLabs Sandbox. The Sandbox is\n", | |
| " best experienced on a desktop computer. Please try maximizing this window or switching to another device. We\n", | |
| " are working on adding support for a larger variety of devices.\n", | |
| " </p>\n", | |
| " </div>\n", | |
| " </div>\n", | |
| " \n", | |
| " </script>\n", | |
| "\n", | |
| " <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>\n", | |
| "\n", | |
| " <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/6.7.0/d3.min.js" integrity="sha512-cd6CHE+XWDQ33ElJqsi0MdNte3S+bQY819f7p3NUHgwQQLXSKjE4cPZTeGNI+vaxZynk1wVU3hoHmow3m089wA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>\n", | |
| "\n", | |
| " <script>\n", | |
| " const getReferenceProfile = () => { return {"columns": {"alcohol": {"histogram": {"start": 8.4, "end": 11.0000011, "width": 0, "counts": [2, 2, 0, 4, 2, 0, 28, 2, 20, 76, 58, 102, 138, 62, 58, 0, 77, 50, 68, 47, 50, 30, 0, 40, 69, 30, 28, 42, 49, 57], "max": 11.0, "min": 8.4, "bins": [8.4, 8.486666703333334, 8.573333406666666, 8.66000011, 8.746666813333334, 8.833333516666666, 8.92000022, 9.006666923333334, 9.093333626666666, 9.18000033, 9.266667033333334, 9.353333736666666, 9.44000044, 9.526667143333334, 9.613333846666666, 9.70000055, 9.786667253333334, 9.873333956666666, 9.96000066, 10.046667363333334, 10.133334066666666, 10.22000077, 10.306667473333334, 10.393334176666666, 10.48000088, 10.566667583333334, 10.653334286666666, 10.74000099, 10.826667693333334, 10.913334396666666, 11.0000011], "n": 1191}, "frequentItems": null, "drift_from_ref": 0.0, "isDiscrete": false, "featureStats": null}, "pH": {"histogram": {"start": 2.74, "end": 3.750000375, "width": 0, "counts": [0, 0, 0, 2, 6, 10, 0, 10, 24, 22, 47, 40, 78, 99, 69, 83, 149, 93, 106, 123, 59, 64, 26, 33, 20, 12, 6, 4, 6, 0], "max": 3.75, "min": 2.74, "bins": [2.74, 2.773666679166667, 2.8073333583333335, 2.8410000375, 2.874666716666667, 2.9083333958333335, 2.942000075, 2.975666754166667, 3.0093334333333335, 3.0430001125, 3.076666791666667, 3.1103334708333334, 3.14400015, 3.1776668291666668, 3.2113335083333334, 3.2450001875, 3.2786668666666667, 3.3123335458333334, 3.346000225, 3.3796669041666667, 3.4133335833333334, 3.4470002625, 3.4806669416666667, 3.5143336208333333, 3.5480003, 3.5816669791666667, 3.6153336583333333, 3.6490003375, 3.6826670166666666, 3.7163336958333333, 3.750000375], "n": 1191}, "frequentItems": null, "drift_from_ref": 0.0018798899769251003, "isDiscrete": false, "featureStats": null}, "fixed acidity": {"histogram": {"start": 5.0, "end": 15.0000015, "width": 0, "counts": [4, 7, 13, 26, 51, 123, 142, 121, 154, 90, 54, 86, 50, 38, 52, 26, 26, 24, 18, 22, 22, 12, 12, 10, 4, 0, 4, 0, 0, 0], "max": 15.0, "min": 5.0, "bins": [5.0, 5.333333383333334, 5.666666766666666, 6.00000015, 6.333333533333334, 6.666666916666667, 7.0000003, 7.333333683333334, 7.666667066666667, 8.00000045, 8.333333833333334, 8.666667216666667, 9.0000006, 9.333333983333333, 9.666667366666667, 10.00000075, 10.333334133333334, 10.666667516666667, 11.0000009, 11.333334283333333, 11.666667666666667, 12.00000105, 12.333334433333334, 12.666667816666667, 13.0000012, 13.333334583333334, 13.666667966666667, 14.00000135, 14.333334733333334, 14.666668116666667, 15.0000015], "n": 1191}, "frequentItems": null, "drift_from_ref": 1.6719160675836287e-07, "isDiscrete": false, "featureStats": null}, "volatile acidity": {"histogram": {"start": 0.18, "end": 1.580000158, "width": 0, "counts": [14, 39, 59, 70, 113, 116, 90, 112, 159, 123, 100, 60, 46, 22, 20, 18, 8, 12, 2, 0, 0, 2, 2, 0, 4, 0, 0, 0, 0, 0], "max": 1.58, "min": 0.18, "bins": [0.18, 0.22666667193333334, 0.27333334386666663, 0.3200000158, 0.36666668773333333, 0.4133333596666667, 0.46000003159999997, 0.5066667035333333, 0.5533333754666667, 0.6000000474, 0.6466667193333333, 0.6933333912666666, 0.7400000631999999, 0.7866667351333334, 0.8333334070666667, 0.880000079, 0.9266667509333333, 0.9733334228666666, 1.0200000948, 1.0666667667333334, 1.1133334386666667, 1.1600001106, 1.2066667825333333, 1.2533334544666666, 1.3000001263999998, 1.3466667983333334, 1.3933334702666667, 1.4400001422, 1.4866668141333332, 1.5333334860666665, 1.580000158], "n": 1191}, "frequentItems": null, "drift_from_ref": 1.2580272113287693e-11, "isDiscrete": false, "featureStats": null}, "quality": {"histogram": null, "frequentItems": [{"value": "bad", "estimate": 1115}, {"value": "good", "estimate": 76}], "drift_from_ref": 4.72188097163335e-120, "isDiscrete": true, "featureStats": null}, "citric acid": {"histogram": {"start": 0.0, "end": 1.0000001, "width": 0, "counts": [180, 67, 88, 47, 42, 74, 76, 105, 68, 63, 40, 50, 35, 38, 94, 30, 24, 26, 11, 14, 10, 0, 8, 1, 0, 0, 0, 0, 0, 0], "max": 1.0, "min": 0.0, "bins": [0.0, 0.03333333666666667, 0.06666667333333334, 0.10000001000000001, 0.13333334666666669, 0.16666668333333334, 0.20000002000000003, 0.2333333566666667, 0.26666669333333337, 0.30000003000000003, 0.3333333666666667, 0.3666667033333334, 0.40000004000000006, 0.4333333766666667, 0.4666667133333334, 0.50000005, 0.5333333866666667, 0.5666667233333335, 0.6000000600000001, 0.6333333966666668, 0.6666667333333334, 0.7000000700000001, 0.7333334066666668, 0.7666667433333334, 0.8000000800000001, 0.8333334166666668, 0.8666667533333334, 0.9000000900000001, 0.9333334266666669, 0.9666667633333335, 1.0000001], "n": 1191}, "frequentItems": null, "drift_from_ref": 7.957790879053686e-10, "isDiscrete": false, "featureStats": null}, "chlorides": {"histogram": {"start": 0.038, "end": 0.6110000610999999, "width": 0, "counts": [35, 381, 545, 131, 32, 10, 14, 6, 2, 6, 3, 6, 0, 0, 0, 4, 4, 2, 0, 6, 0, 0, 4, 0, 0, 0, 0, 0, 0, 0], "max": 0.611, "min": 0.038, "bins": [0.038, 0.05710000203666667, 0.07620000407333333, 0.09530000611, 0.11440000814666665, 0.13350001018333332, 0.15260001222, 0.17170001425666664, 0.19080001629333332, 0.20990001833, 0.22900002036666664, 0.24810002240333331, 0.26720002443999996, 0.28630002647666664, 0.30540002851333325, 0.32450003054999993, 0.3436000325866666, 0.3627000346233333, 0.38180003665999995, 0.40090003869666657, 0.42000004073333325, 0.4391000427699999, 0.4582000448066666, 0.47730004684333327, 0.49640004887999994, 0.5155000509166666, 0.5346000529533332, 0.55370005499, 0.5728000570266666, 0.5919000590633333, 0.6110000610999999], "n": 1191}, "frequentItems": null, "drift_from_ref": 1.6569428823583533e-26, "isDiscrete": false, "featureStats": null}, "sulphates": {"histogram": {"start": 0.33, "end": 2.0000002, "width": 0, "counts": [2, 32, 101, 217, 232, 215, 110, 85, 73, 28, 34, 10, 10, 10, 6, 12, 0, 4, 2, 0, 0, 0, 4, 0, 0, 0, 0, 0, 0, 4], "max": 2.0, "min": 0.33, "bins": [0.33, 0.3856666733333334, 0.4413333466666667, 0.49700002, 0.5526666933333333, 0.6083333666666666, 0.66400004, 0.7196667133333334, 0.7753333866666667, 0.83100006, 0.8866667333333333, 0.9423334066666667, 0.99800008, 1.0536667533333333, 1.1093334266666668, 1.1650001, 1.2206667733333334, 1.2763334466666667, 1.33200012, 1.3876667933333333, 1.4433334666666666, 1.4990001400000001, 1.5546668133333335, 1.6103334866666668, 1.66600016, 1.7216668333333334, 1.7773335066666667, 1.83300018, 1.8886668533333335, 1.9443335266666668, 2.0000002], "n": 1191}, "frequentItems": null, "drift_from_ref": 1.3923726824145813e-09, "isDiscrete": false, "featureStats": null}, "residual sugar": {"histogram": {"start": 1.2, "end": 15.50000155, "width": 0, "counts": [110, 476, 357, 110, 36, 25, 14, 0, 10, 16, 10, 7, 0, 1, 6, 2, 2, 0, 0, 4, 0, 0, 0, 0, 0, 0, 3, 0, 0, 2], "max": 15.5, "min": 1.2, "bins": [1.2, 1.6766667183333333, 2.1533334366666668, 2.6300001550000003, 3.1066668733333334, 3.5833335916666664, 4.06000031, 4.5366670283333335, 5.0133337466666665, 5.4900004650000005, 5.966667183333334, 6.443333901666667, 6.920000620000001, 7.396667338333334, 7.873334056666667, 8.350000775, 8.826667493333334, 9.303334211666666, 9.78000093, 10.256667648333332, 10.733334366666666, 11.210001085, 11.686667803333332, 12.163334521666666, 12.64000124, 13.116667958333332, 13.593334676666666, 14.070001395, 14.546668113333332, 15.023334831666666, 15.50000155], "n": 1191}, "frequentItems": null, "drift_from_ref": 0.015982727884831006, "isDiscrete": false, "featureStats": null}, "free sulfur dioxide": {"histogram": {"start": 1.0, "end": 72.0000072, "width": 0, "counts": [32, 106, 188, 108, 101, 132, 92, 66, 76, 47, 72, 35, 31, 39, 19, 6, 16, 2, 2, 8, 0, 4, 6, 0, 0, 0, 0, 1, 0, 2], "max": 72.0, "min": 1.0, "bins": [1.0, 3.3666669066666666, 5.733333813333333, 8.10000072, 10.466667626666666, 12.833334533333332, 15.20000144, 17.566668346666667, 19.933335253333333, 22.30000216, 24.666669066666664, 27.033335973333333, 29.40000288, 31.766669786666665, 34.133336693333334, 36.5000036, 38.866670506666665, 41.23333741333333, 43.60000432, 45.96667122666666, 48.33333813333333, 50.70000504, 53.066671946666666, 55.43333885333333, 57.80000576, 60.16667266666666, 62.53333957333333, 64.90000648, 67.26667338666667, 69.63334029333333, 72.0000072], "n": 1191}, "frequentItems": null, "drift_from_ref": 0.020999157107383475, "isDiscrete": false, "featureStats": null}, "density": {"histogram": {"start": 0.99236, "end": 1.003690100369, "width": 0, "counts": [2, 0, 4, 0, 6, 8, 34, 46, 73, 94, 131, 136, 128, 127, 100, 86, 42, 44, 34, 32, 26, 18, 4, 4, 4, 0, 2, 4, 0, 2], "max": 1.00369, "min": 0.99236, "bins": [0.99236, 0.9927376700123001, 0.9931153400246, 0.9934930100369, 0.9938706800492, 0.9942483500615, 0.9946260200738, 0.9950036900861, 0.9953813600984001, 0.9957590301107, 0.996136700123, 0.9965143701353, 0.9968920401476, 0.9972697101599, 0.9976473801722, 0.9980250501845, 0.9984027201968, 0.9987803902091, 0.9991580602214, 0.9995357302337, 0.999913400246, 1.0002910702582999, 1.0006687402706, 1.0010464102829, 1.0014240802952, 1.0018017503075, 1.0021794203198, 1.0025570903321, 1.0029347603443999, 1.0033124303567, 1.003690100369], "n": 1191}, "frequentItems": null, "drift_from_ref": 4.08790353520196e-71, "isDiscrete": false, "featureStats": null}, "total sulfur dioxide": {"histogram": {"start": 6.0, "end": 160.000016, "width": 0, "counts": [46, 96, 96, 103, 103, 68, 76, 99, 64, 50, 50, 54, 38, 24, 23, 36, 27, 21, 12, 21, 12, 7, 18, 10, 9, 6, 8, 10, 2, 2], "max": 160.0, "min": 6.0, "bins": [6.0, 11.133333866666666, 16.266667733333332, 21.400001599999996, 26.533335466666664, 31.66666933333333, 36.80000319999999, 41.93333706666666, 47.06667093333333, 52.200004799999995, 57.33333866666666, 62.46667253333332, 67.60000639999998, 72.73334026666666, 77.86667413333332, 83.000008, 88.13334186666665, 93.26667573333332, 98.40000959999999, 103.53334346666665, 108.66667733333333, 113.80001119999999, 118.93334506666665, 124.06667893333332, 129.20001279999997, 134.33334666666664, 139.46668053333332, 144.6000144, 149.73334826666664, 154.8666821333333, 160.000016], "n": 1191}, "frequentItems": null, "drift_from_ref": 1.6107148931579483e-11, "isDiscrete": false, "featureStats": null}}, "properties": {"observations": 4896, "missing_cells": 0, "missing_percentage": 0.0}} }\n", | |
| " const referenceProfile = getReferenceProfile()\n", | |
| "\n", | |
| " function fixNumberTo(number, decimals = 3) {\n", | |
| " const fractionalDigits = String(number % 1).split('').slice(2, 2 + decimals).join('')\n", | |
| " return `${Math.trunc(number)}.${fractionalDigits}`\n", | |
| " }\n", | |
| "\n", | |
| " function registerHandlebarHelperFunctions() {\n", | |
| " //helper fun\n", | |
| "\n", | |
| " class GenerateChartParams {\n", | |
| " constructor(height, width, data, bottomMargin=20, topMargin=5) {\n", | |
| " this.MARGIN = {\n", | |
| " TOP: topMargin,\n", | |
| " RIGHT: 5,\n", | |
| " BOTTOM: bottomMargin,\n", | |
| " LEFT: 55,\n", | |
| " };\n", | |
| " this.SVG_WIDTH = width;\n", | |
| " this.SVG_HEIGHT = height;\n", | |
| " this.CHART_WIDTH = this.SVG_WIDTH - this.MARGIN.LEFT - this.MARGIN.RIGHT;\n", | |
| " this.CHART_HEIGHT = this.SVG_HEIGHT - this.MARGIN.TOP - this.MARGIN.BOTTOM;\n", | |
| " this.svgEl = d3.create("svg")\n", | |
| " .attr("preserveAspectRatio", "xMinYMin meet")\n", | |
| " .attr("viewBox", "30 0 240 400")\n", | |
| " .classed("svg-content-responsive", true)\n", | |
| " this.maxYValue = d3.max(data, (d) => Math.abs(d.axisY));\n", | |
| " this.xScale = d3\n", | |
| " .scaleBand()\n", | |
| " .domain(data.map((d) => d.axisX))\n", | |
| " .range([this.MARGIN.LEFT, this.MARGIN.LEFT + this.CHART_WIDTH]);\n", | |
| " this.yScale = d3\n", | |
| " .scaleLinear()\n", | |
| " .domain([0, this.maxYValue * 1.02])\n", | |
| " .range([this.CHART_HEIGHT, 0]);\n", | |
| " }\n", | |
| " }\n", | |
| "\n", | |
| " function generateChart(data, height = 70, width = 250, index = 0, referenceProfileExist = false) {\n", | |
| " const sizes = new GenerateChartParams(height, width, data, 5)\n", | |
| " const {\n", | |
| " MARGIN,\n", | |
| " SVG_WIDTH,\n", | |
| " SVG_HEIGHT,\n", | |
| " CHART_WIDTH,\n", | |
| " CHART_HEIGHT,\n", | |
| " svgEl,\n", | |
| " maxYValue,\n", | |
| " xScale,\n", | |
| " yScale\n", | |
| " } = sizes\n", | |
| " const rectColors = ["#44C0E7", "#F5843C"]\n", | |
| "\n", | |
| " // Add the y Axis\n", | |
| " if (!referenceProfileExist) {\n", | |
| " svgEl\n", | |
| " .append("g")\n", | |
| " .attr("transform", "translate(" + MARGIN.LEFT + ", " + MARGIN.TOP + ")")\n", | |
| " .call(d3.axisLeft(yScale).tickValues([0, maxYValue/2, maxYValue]))\n", | |
| " .selectAll("text")\n", | |
| " .style("font-size", "8")\n", | |
| " }\n", | |
| "\n", | |
| " const gChart = svgEl.append("g");\n", | |
| " gChart\n", | |
| " .attr("transform", "translate(" + 20 + ", " + 0 + ")")\n", | |
| " .selectAll(".bar")\n", | |
| " .data(data)\n", | |
| " .enter()\n", | |
| " .append("rect")\n", | |
| " .classed("bar", true)\n", | |
| " .attr("width", xScale.bandwidth() - 1)\n", | |
| " .attr("height", (d) => CHART_HEIGHT - yScale(d.axisY))\n", | |
| " .attr("x", (d) => xScale(d.axisX))\n", | |
| " .attr("y", (d) => yScale(d.axisY) + MARGIN.TOP)\n", | |
| " .attr("fill", rectColors[index]);\n", | |
| "\n", | |
| " return svgEl._groups[0][0].outerHTML;\n", | |
| " }\n", | |
| "\n", | |
| " function chartData(column) {\n", | |
| " const data = [];\n", | |
| " if (column.histogram) {\n", | |
| " column.histogram.counts.slice(0, 30).forEach((count, index) => {\n", | |
| " data.push({\n", | |
| " axisY: count,\n", | |
| " axisX: index,\n", | |
| " });\n", | |
| " });\n", | |
| " } else if (column.frequentItems) {\n", | |
| " Object.entries(column.frequentItems).forEach(([key, {value, estimate}], index) => {\n", | |
| " data.push({\n", | |
| " axisY: estimate,\n", | |
| " axisX: value,\n", | |
| " });\n", | |
| " });\n", | |
| " }\n", | |
| "\n", | |
| " return data\n", | |
| " }\n", | |
| "\n", | |
| " function graph(column, key, referenceColumn) {\n", | |
| " let data = [];\n", | |
| " const columnKey = key.data.key\n", | |
| " let chartValue = false\n", | |
| " let chartColor = undefined\n", | |
| " if(!!referenceColumn){\n", | |
| " column = referenceColumn.columns[columnKey]\n", | |
| " chartValue = true\n", | |
| " chartColor = 1\n", | |
| " } else if (referenceColumn === undefined) {\n", | |
| " column = ""\n", | |
| " }\n", | |
| "\n", | |
| " if (column.histogram || column.frequentItems) {\n", | |
| " data = chartData(column)\n", | |
| " } else if (referenceColumn === null ) {\n", | |
| " $(".svg-container").css("padding-bottom", "0")\n", | |
| " return '<span class="wl-table-cell__bedge-wrap">No data to show the chart</span>';\n", | |
| " } else if (referenceColumn === undefined) {\n", | |
| " $(document).ready(function() {\n", | |
| " $(".reference-table-head").addClass("d-none")\n", | |
| " });\n", | |
| " return ''\n", | |
| " } else if (referenceColumn.frequentItems === undefined){\n", | |
| " return '';\n", | |
| " }\n", | |
| " return `\n", | |
| " <div class="svg-container">\n", | |
| " ${generateChart(data, ...[,,], chartColor, chartValue)}\n", | |
| " </div>\n", | |
| " `;\n", | |
| " }\n", | |
| "\n", | |
| " function formatLabelDate(timestamp) {\n", | |
| " const date = new Date(timestamp);\n", | |
| " const format = d3.timeFormat("%Y-%m-%d %I:%M:%S %p %Z");\n", | |
| " return format(date);\n", | |
| " }\n", | |
| "\n", | |
| " const driftCountElement = (driftCount, driftColor, driftName, driftRange) => `\n", | |
| " <div class="display-flex flex-direction-column">\n", | |
| " <div class="drift-detection-info-drifts-item display-flex align-items">\n", | |
| " <div class="drift-detection-info-drifts-item-text display-flex align-items">\n", | |
| " <p class="drift-detection-info-drifts-item-count mb-0">${driftCount}</p>\n", | |
| " <p class="drift-detection-info-drifts-item-range display-flex justify-content-center mb-0">${driftRange}</p>\n", | |
| " </div>\n", | |
| " </div>\n", | |
| " </div>\n", | |
| " `\n", | |
| "\n", | |
| " const drifts = {\n", | |
| " severe: {\n", | |
| " count: 0,\n", | |
| " range: "with detected drift (0.00 - 0.05)",\n", | |
| " },\n", | |
| " moderate: {\n", | |
| " count: 0,\n", | |
| " range: "with possible drift (0.05 - 0.15)",\n", | |
| " },\n", | |
| " mild: {\n", | |
| " count: 0,\n", | |
| " range: "with no evidence of drift (0.15 - 1.0)",\n", | |
| " }\n", | |
| " };\n", | |
| "\n", | |
| " const countOfDrifts = (driftNumber) => {\n", | |
| " if(driftNumber >= 0 && driftNumber <= 0.05) {\n", | |
| " Object.values(drifts)[0].count++\n", | |
| " return 0\n", | |
| " } else if(driftNumber > 0.05 && driftNumber <= 0.15) {\n", | |
| " Object.values(drifts)[1].count++\n", | |
| " return 1\n", | |
| " } else if(driftNumber > 0.15) {\n", | |
| " Object.values(drifts)[2].count++\n", | |
| " return 2\n", | |
| " }\n", | |
| "\n", | |
| " }\n", | |
| "\n", | |
| " abbreviate_number = function(value, fixed = 0) {\n", | |
| " value = +value\n", | |
| " if (value === null) { return null; } // terminate early\n", | |
| " if (value === 0) { return '0'; } // terminate early\n", | |
| " fixed = (!fixed || fixed < 0) ? 0 : fixed; // number of decimal places to show\n", | |
| " var b = (value).toPrecision(2).split("e"), // get power\n", | |
| " k = b.length === 1 ? 0 : Math.floor(Math.min(b[1].slice(1), 14) / 3), // floor at decimals, ceiling at trillions\n", | |
| " c = k < 1 ? value.toFixed(0 + fixed) : (value / Math.pow(10, k * 3) ).toFixed(1 + fixed), // divide by power\n", | |
| " d = c < 0 ? c : Math.abs(c), // enforce -0 is 0\n", | |
| " newValue = d,\n", | |
| " suffixe = ['', 'K', 'M', 'B', 'T'][k]; // append power\n", | |
| " return {value, newValue, suffixe};\n", | |
| " }\n", | |
| "\n", | |
| " function formatBytes(bytes, decimals = 2) {\n", | |
| " let newValue,\n", | |
| " suffixe = ""\n", | |
| " if (bytes === 0) return '0 Bytes';\n", | |
| "\n", | |
| " const k = 1024;\n", | |
| " const dm = decimals < 0 ? 0 : decimals;\n", | |
| " const sizes = ['Bytes', 'KiB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];\n", | |
| "\n", | |
| " const i = Math.floor(Math.log(bytes) / Math.log(k));\n", | |
| " newValue = parseFloat((bytes / Math.pow(k, i)).toFixed(dm));\n", | |
| " suffixe = sizes[i]\n", | |
| " return {bytes, newValue, suffixe};\n", | |
| " }\n", | |
| "\n", | |
| " const valueSuffixe = (newNumber) => `\n", | |
| " <div class="statistic-measurement">\n", | |
| " ${newNumber}\n", | |
| " </div>`\n", | |
| " const valueNumber = (newNumber) => `\n", | |
| " <div class="statistic-number">\n", | |
| " ${newNumber}\n", | |
| " </div>`\n", | |
| "\n", | |
| " const numberWithSuffixe = (number, newNumber, suffixe) =>\n", | |
| " `<div class="tooltip-full-number">\n", | |
| " <div class="statistic-number">\n", | |
| " ${newNumber}\n", | |
| " <div class="statistic-measurement">${suffixe}</div>\n", | |
| " </div>\n", | |
| " <span class="tooltiptext">${number}</span>\n", | |
| " </div>`\n", | |
| "\n", | |
| " Handlebars.registerHelper("observations", function (properties) {\n", | |
| " const {value, newValue, suffixe} = abbreviate_number(referenceProfile.properties.observations)\n", | |
| " return numberWithSuffixe(value, valueNumber(newValue), valueNumber(suffixe));\n", | |
| " });\n", | |
| "\n", | |
| " Handlebars.registerHelper("missingCells", function (properties) {\n", | |
| " const {value, newValue, suffixe} = abbreviate_number(referenceProfile.properties.missing_cells)\n", | |
| " if (typeof value !== 'undefined' && typeof newValue !== 'undefined' && typeof suffixe !== 'undefined' ) {\n", | |
| " return numberWithSuffixe(value, valueSuffixe(`${newValue}`), suffixe);\n", | |
| " }\n", | |
| " return numberWithSuffixe(0, valueNumber(0), valueNumber(''));\n", | |
| " });\n", | |
| "\n", | |
| " Handlebars.registerHelper("missingCellsPercentage", function (properties) {\n", | |
| " const {value, newValue, suffixe} = abbreviate_number(referenceProfile.properties.missing_percentage)\n", | |
| " if (typeof value !== 'undefined' && typeof newValue !== 'undefined' && typeof suffixe !== 'undefined' ) {\n", | |
| " return numberWithSuffixe(value, valueSuffixe(`(${newValue}%)`), suffixe);\n", | |
| " }\n", | |
| " return numberWithSuffixe(0, valueSuffixe(`(${0}%)`), '');\n", | |
| " });\n", | |
| "\n", | |
| " Handlebars.registerHelper("getProfileTimeStamp", function (properties) {\n", | |
| " return formatLabelDate(+properties.properties.dataTimestamp)\n", | |
| " });\n", | |
| "\n", | |
| " Handlebars.registerHelper("getProfileName", function (properties) {\n", | |
| " return properties.properties.tags.name\n", | |
| " });\n", | |
| "\n", | |
| " let driftCount = 0;\n", | |
| " const diffFromRefTableElement = (driftFromRefNumber, circleColor) => `\n", | |
| " <div class="text-color padding-5 text-align-end justify-content-center">\n", | |
| " ${driftFromRefNumber}\n", | |
| " </div>\n", | |
| " `\n", | |
| "\n", | |
| " const cheqValueTypeNumber = (profile, profileValue) => {\n", | |
| " let validValue;\n", | |
| " if (profile && profileValue !== undefined && typeof profileValue === "number") {\n", | |
| " return true\n", | |
| " } else if (profileValue !== undefined && typeof profileValue !== "number") {\n", | |
| " return false\n", | |
| " }\n", | |
| " }\n", | |
| "\n", | |
| " Handlebars.registerHelper("getDiffFromRef", function (column, key) {\n", | |
| " const columnKey = key.data.key\n", | |
| " const {drift_from_ref} = referenceProfile.columns[columnKey]\n", | |
| "\n", | |
| " if (cheqValueTypeNumber(referenceProfile, drift_from_ref)) {\n", | |
| " const driftFromRefNumber = drift_from_ref.toPrecision(2)\n", | |
| " const driftCategory = countOfDrifts(driftFromRefNumber)\n", | |
| " const circleColor = Object.values(drifts)[driftCategory].colorClass\n", | |
| " if (driftCategory==0 || driftCategory == 1){\n", | |
| " driftCount++\n", | |
| " }\n", | |
| " $(document).ready(() => {\n", | |
| " $(".drift-count").html(driftCount)\n", | |
| " $(".all-features").html(Object.keys(referenceProfile.columns).length)\n", | |
| " })\n", | |
| "\n", | |
| " return diffFromRefTableElement(driftFromRefNumber, circleColor)\n", | |
| "\n", | |
| " } else if (cheqValueTypeNumber(referenceProfile, drift_from_ref) !== undefined) {\n", | |
| " Object.values(drifts)[0].count++\n", | |
| " return diffFromRefTableElement("undefined", "severe-drift-circle-color")\n", | |
| " }\n", | |
| "\n", | |
| " return '<p style="color: black">-</p>';\n", | |
| " });\n", | |
| "\n", | |
| " $(document).ready(() =>\n", | |
| " Object.values(drifts).map(({count, name, colorClass, range}) =>{\n", | |
| " $("#drift-detection-info-drifts")\n", | |
| " .append(driftCountElement(count, colorClass, name, range))\n", | |
| " })\n", | |
| " )\n", | |
| "\n", | |
| " Handlebars.registerHelper("inferredType", function (column) {\n", | |
| " let infferedType = "";\n", | |
| "\n", | |
| " if (column.isDiscrete) {\n", | |
| " infferedType = "Discrete";\n", | |
| " } else {\n", | |
| " infferedType = "Non-discrete";\n", | |
| " }\n", | |
| " return infferedType;\n", | |
| " });\n", | |
| "\n", | |
| " Handlebars.registerHelper("frequentItems", function (column) {\n", | |
| " frequentItemsElemString = "";\n", | |
| " if (column.isDiscrete) {\n", | |
| " const slicedFrequentItems = column.frequentItems.items.slice(0, 5);\n", | |
| " for (let fi = 0; fi < slicedFrequentItems.length; fi++) {\n", | |
| " frequentItemsElemString +=\n", | |
| " '<span class="wl-table-cell__bedge">' + slicedFrequentItems[fi].jsonValue + "</span>";\n", | |
| " }\n", | |
| " } else {\n", | |
| " frequentItemsElemString += "No data to show";\n", | |
| " }\n", | |
| " return frequentItemsElemString;\n", | |
| " });\n", | |
| "\n", | |
| " Handlebars.registerHelper("totalCount", function (column) {\n", | |
| " if (column.featureStats) {\n", | |
| " return column.featureStats.total_count;\n", | |
| " }\n", | |
| "\n", | |
| " return "-";\n", | |
| " });\n", | |
| "\n", | |
| " Handlebars.registerHelper("mean", function (column) {\n", | |
| " if (column.featureStats?.descriptive_statistics) {\n", | |
| " return fixNumberTo(column.featureStats.descriptive_statistics.mean);\n", | |
| " }\n", | |
| " return "-";\n", | |
| " });\n", | |
| "\n", | |
| " Handlebars.registerHelper("getGraphHtml",(column,key) => graph(column, key, null));\n", | |
| " Handlebars.registerHelper("getReferenceGraphHtml",(column,key) => graph(column, key, referenceProfile));\n", | |
| "\n", | |
| " Handlebars.registerHelper("getDiscreteTypeCount", function () {\n", | |
| " let count = 0;\n", | |
| "\n", | |
| " Object.entries(this.columns).forEach((feature) => {\n", | |
| " if (feature[1].isDiscrete === true) {\n", | |
| " count++;\n", | |
| " }\n", | |
| " });\n", | |
| " return count.toString();\n", | |
| " });\n", | |
| "\n", | |
| " Handlebars.registerHelper("getNonDiscreteTypeCount", function () {\n", | |
| " let count = 0;\n", | |
| "\n", | |
| " Object.entries(this.columns).forEach((feature) => {\n", | |
| " if (feature[1].isDiscrete === false) {\n", | |
| " count++;\n", | |
| " }\n", | |
| " });\n", | |
| " return count;\n", | |
| " });\n", | |
| "\n", | |
| " Handlebars.registerHelper("getUnknownTypeCount", function () {\n", | |
| " let count = 0;\n", | |
| " return count;\n", | |
| " Object.entries(this.columns).forEach((feature) => {\n", | |
| " if (!feature[1].isDiscrete) {\n", | |
| " count++;\n", | |
| " }\n", | |
| " });\n", | |
| " return count;\n", | |
| " });\n", | |
| " }\n", | |
| "\n", | |
| " function initHandlebarsTemplate() {\n", | |
| " // Replace this context with JSON from .py file\n", | |
| " const context = {"columns": {"alcohol": {"histogram": {"start": 11.0666666666667, "end": 14.900001490000001, "width": 0, "counts": [28, 68, 32, 30, 39, 28, 21, 22, 24, 13, 13, 27, 9, 17, 8, 8, 2, 2, 4, 5, 0, 0, 8, 0, 0, 0, 0, 0, 0, 0], "max": 14.9, "min": 11.0666666666667, "bins": [11.0666666666667, 11.194444494111144, 11.322222321555587, 11.45000014900003, 11.577777976444473, 11.705555803888917, 11.83333363133336, 11.961111458777804, 12.088889286222248, 12.216667113666691, 12.344444941111133, 12.472222768555577, 12.60000059600002, 12.727778423444464, 12.855556250888908, 12.98333407833335, 13.111111905777793, 13.238889733222237, 13.36666756066668, 13.494445388111124, 13.622223215555568, 13.750001043000012, 13.877778870444454, 14.005556697888897, 14.133334525333341, 14.261112352777785, 14.388890180222226, 14.51666800766667, 14.644445835111114, 14.772223662555557, 14.900001490000001], "n": 408}, "frequentItems": null, "drift_from_ref": null, "isDiscrete": false, "featureStats": {"total_count": 408, "missing": 0, "distinct": 7.59803978178436, "min": 11.0666666666667, "max": 14.9, "range": 3.8333333333333, "quantile_statistics": {"fifth_percentile": 11.1, "iqr": 1.0, "q1": 11.4, "median": 11.8, "q3": 12.4, "ninety_fifth_percentile": 13.2}, "descriptive_statistics": {"stddev": 0.6824986635512768, "coefficient_of_variation": 0.05725985668809312, "sum": 4863.083333333334, "variance": 0.4658044257492789, "mean": 11.919321895424838}}}, "pH": {"histogram": {"start": 2.89, "end": 4.010000401, "width": 0, "counts": [4, 2, 2, 4, 8, 5, 17, 19, 39, 35, 44, 30, 35, 40, 30, 11, 20, 16, 14, 11, 1, 10, 4, 1, 0, 2, 0, 2, 0, 2], "max": 4.01, "min": 2.89, "bins": [2.89, 2.9273333467000002, 2.9646666934000003, 3.0020000401, 3.0393333868, 3.0766667335, 3.1140000802000003, 3.1513334269, 3.1886667736, 3.2260001203, 3.2633334670000003, 3.3006668137, 3.3380001604, 3.3753335071, 3.4126668538000002, 3.4500002005, 3.4873335472, 3.5246668939, 3.5620002406, 3.5993335873000003, 3.636666934, 3.6740002807, 3.7113336274, 3.7486669741, 3.7860003208000004, 3.8233336675, 3.8606670142, 3.8980003609000002, 3.9353337076, 3.9726670543, 4.010000401], "n": 408}, "frequentItems": null, "drift_from_ref": null, "isDiscrete": false, "featureStats": {"total_count": 408, "missing": 0, "distinct": 18.8725525817653, "min": 2.89, "max": 4.01, "range": 1.1199999999999997, "quantile_statistics": {"fifth_percentile": 3.09, "iqr": 0.2200000000000002, "q1": 3.23, "median": 3.33, "q3": 3.45, "ninety_fifth_percentile": 3.68}, "descriptive_statistics": {"stddev": 0.17649177660211463, "coefficient_of_variation": 0.05273349702213279, "sum": 1365.52, "variance": 0.031149347208170735, "mean": 3.346862745098039}}}, "fixed acidity": {"histogram": {"start": 4.6, "end": 15.90000159, "width": 0, "counts": [4, 16, 16, 17, 28, 39, 40, 29, 22, 31, 23, 36, 12, 12, 23, 23, 9, 6, 2, 4, 2, 4, 2, 2, 2, 0, 0, 0, 2, 2], "max": 15.9, "min": 4.6, "bins": [4.6, 4.9766667196666665, 5.353333439333333, 5.730000158999999, 6.106666878666666, 6.483333598333333, 6.860000318, 7.236667037666667, 7.613333757333333, 7.990000477000001, 8.366667196666667, 8.743333916333334, 9.120000636, 9.496667355666666, 9.873334075333332, 10.250000795, 10.626667514666668, 11.003334234333334, 11.380000954, 11.756667673666666, 12.133334393333334, 12.510001113000001, 12.886667832666667, 13.263334552333333, 13.640001272000001, 14.016667991666667, 14.393334711333335, 14.770001431, 15.146668150666667, 15.523334870333334, 15.90000159], "n": 408}, "frequentItems": null, "drift_from_ref": null, "isDiscrete": false, "featureStats": {"total_count": 408, "missing": 0, "distinct": 20.588239538027807, "min": 4.6, "max": 15.9, "range": 11.3, "quantile_statistics": {"fifth_percentile": 5.4, "iqr": 2.7, "q1": 6.7, "median": 7.9, "q3": 9.4, "ninety_fifth_percentile": 11.9}, "descriptive_statistics": {"stddev": 2.013014441140909, "coefficient_of_variation": 0.24676558362692394, "sum": 3328.3, "variance": 4.052227140241847, "mean": 8.157598039215687}}}, "volatile acidity": {"histogram": {"start": 0.12, "end": 1.1150001115, "width": 0, "counts": [2, 8, 5, 9, 20, 33, 37, 37, 30, 35, 23, 24, 25, 24, 14, 16, 14, 15, 11, 3, 3, 4, 6, 2, 0, 3, 0, 3, 0, 2], "max": 1.115, "min": 0.12, "bins": [0.12, 0.15316667038333331, 0.18633334076666666, 0.21950001115, 0.2526666815333333, 0.28583335191666664, 0.3190000223, 0.35216669268333334, 0.38533336306666666, 0.41850003345, 0.4516667038333333, 0.48483337421666667, 0.5180000445999999, 0.5511667149833333, 0.5843333853666667, 0.61750005575, 0.6506667261333333, 0.6838333965166666, 0.7170000669, 0.7501667372833333, 0.7833334076666666, 0.81650007805, 0.8496667484333333, 0.8828334188166667, 0.9160000892, 0.9491667595833333, 0.9823334299666666, 1.01550010035, 1.0486667707333335, 1.0818334411166668, 1.1150001115000001], "n": 408}, "frequentItems": null, "drift_from_ref": null, "isDiscrete": false, "featureStats": {"total_count": 408, "missing": 0, "distinct": 22.05882840516061, "min": 0.12, "max": 1.115, "range": 0.995, "quantile_statistics": {"fifth_percentile": 0.25, "iqr": 0.23999999999999994, "q1": 0.34, "median": 0.44, "q3": 0.58, "ninety_fifth_percentile": 0.8}, "descriptive_statistics": {"stddev": 0.17791965320497752, "coefficient_of_variation": 0.3771756131540623, "sum": 192.45999999999998, "variance": 0.03165540299657947, "mean": 0.47171568627450977}}}, "quality": {"histogram": null, "frequentItems": [{"value": "bad", "estimate": 267}, {"value": "good", "estimate": 141}], "drift_from_ref": null, "isDiscrete": true, "featureStats": {"total_count": 408, "missing": 0, "distinct": 0.4901960796487877, "min": null, "max": null, "range": null, "quantile_statistics": null, "descriptive_statistics": {"stddev": null, "coefficient_of_variation": null, "sum": null, "variance": null, "mean": null}}}, "citric acid": {"histogram": {"start": 0.0, "end": 0.790000079, "width": 0, "counts": [59, 13, 7, 26, 11, 8, 5, 5, 9, 11, 13, 13, 28, 10, 23, 36, 10, 24, 30, 9, 9, 9, 7, 2, 9, 12, 2, 4, 4, 0], "max": 0.79, "min": 0.0, "bins": [0.0, 0.026333335966666666, 0.05266667193333333, 0.0790000079, 0.10533334386666666, 0.13166667983333333, 0.1580000158, 0.18433335176666665, 0.21066668773333333, 0.2370000237, 0.26333335966666666, 0.2896666956333333, 0.3160000316, 0.34233336756666666, 0.3686667035333333, 0.3950000395, 0.42133337546666666, 0.4476667114333333, 0.4740000474, 0.5003333833666667, 0.5266667193333333, 0.5530000553, 0.5793333912666666, 0.6056667272333334, 0.6320000632, 0.6583333991666667, 0.6846667351333333, 0.7110000711, 0.7373334070666666, 0.7636667430333334, 0.790000079], "n": 408}, "frequentItems": null, "drift_from_ref": null, "isDiscrete": false, "featureStats": {"total_count": 408, "missing": 0, "distinct": 17.892160062112726, "min": 0.0, "max": 0.79, "range": 0.79, "quantile_statistics": {"fifth_percentile": 0.0, "iqr": 0.37, "q1": 0.1, "median": 0.34, "q3": 0.47, "ninety_fifth_percentile": 0.66}, "descriptive_statistics": {"stddev": 0.2090283588895552, "coefficient_of_variation": 0.6677908576222575, "sum": 127.71000000000001, "variance": 0.043692854820060696, "mean": 0.313014705882353}}}, "chlorides": {"histogram": {"start": 0.012, "end": 0.230000023, "width": 0, "counts": [2, 0, 0, 9, 22, 39, 45, 76, 65, 42, 33, 22, 20, 8, 9, 8, 4, 0, 0, 1, 0, 0, 0, 0, 0, 2, 0, 0, 0, 1], "max": 0.23, "min": 0.012, "bins": [0.012, 0.019266667433333332, 0.026533334866666668, 0.0338000023, 0.04106666973333333, 0.04833333716666667, 0.0556000046, 0.06286667203333333, 0.07013333946666667, 0.0774000069, 0.08466667433333333, 0.09193334176666666, 0.0992000092, 0.10646667663333333, 0.11373334406666666, 0.12100001149999999, 0.12826667893333332, 0.13553334636666667, 0.14280001380000001, 0.15006668123333333, 0.15733334866666668, 0.1646000161, 0.17186668353333334, 0.17913335096666666, 0.1864000184, 0.19366668583333332, 0.20093335326666667, 0.2082000207, 0.21546668813333333, 0.22273335556666665, 0.230000023], "n": 408}, "frequentItems": null, "drift_from_ref": null, "isDiscrete": false, "featureStats": {"total_count": 408, "missing": 0, "distinct": 21.813730257594944, "min": 0.012, "max": 0.23, "range": 0.218, "quantile_statistics": {"fifth_percentile": 0.046, "iqr": 0.025999999999999995, "q1": 0.06, "median": 0.071, "q3": 0.086, "ninety_fifth_percentile": 0.12}, "descriptive_statistics": {"stddev": 0.024213181268290383, "coefficient_of_variation": 0.3226526212509791, "sum": 30.618, "variance": 0.0005862781471310883, "mean": 0.07504411764705882}}}, "sulphates": {"histogram": {"start": 0.37, "end": 1.130000113, "width": 0, "counts": [3, 2, 5, 3, 7, 18, 18, 46, 22, 37, 21, 33, 21, 28, 29, 27, 21, 13, 24, 7, 9, 2, 4, 2, 2, 1, 1, 0, 0, 2], "max": 1.13, "min": 0.37, "bins": [0.37, 0.3953333371, 0.4206666742, 0.4460000113, 0.47133334839999996, 0.4966666855, 0.5220000226, 0.5473333597, 0.5726666968, 0.5980000339, 0.623333371, 0.6486667080999999, 0.6740000452, 0.6993333823, 0.7246667194, 0.7500000565, 0.7753333936, 0.8006667306999999, 0.8260000677999999, 0.8513334049, 0.8766667419999999, 0.9020000791, 0.9273334162, 0.9526667533, 0.9780000904, 1.0033334274999999, 1.0286667646, 1.0540001016999998, 1.0793334388, 1.1046667759, 1.130000113], "n": 408}, "frequentItems": null, "drift_from_ref": null, "isDiscrete": false, "featureStats": {"total_count": 408, "missing": 0, "distinct": 14.215688286897349, "min": 0.37, "max": 1.13, "range": 0.7599999999999999, "quantile_statistics": {"fifth_percentile": 0.5, "iqr": 0.19000000000000006, "q1": 0.58, "median": 0.66, "q3": 0.77, "ninety_fifth_percentile": 0.88}, "descriptive_statistics": {"stddev": 0.12701037402923776, "coefficient_of_variation": 0.18776807233831805, "sum": 275.97999999999996, "variance": 0.016131635111046875, "mean": 0.6764215686274508}}}, "residual sugar": {"histogram": {"start": 0.9, "end": 12.90000129, "width": 0, "counts": [8, 39, 118, 123, 40, 16, 11, 8, 14, 8, 3, 2, 2, 6, 2, 0, 2, 1, 2, 2, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1], "max": 12.9, "min": 0.9, "bins": [0.9, 1.300000043, 1.7000000860000002, 2.100000129, 2.500000172, 2.900000215, 3.3000002580000003, 3.700000301, 4.100000344000001, 4.500000387, 4.90000043, 5.300000473000001, 5.700000516000001, 6.100000559000001, 6.500000602000001, 6.900000645, 7.300000688000001, 7.700000731000001, 8.100000774, 8.500000817, 8.90000086, 9.300000903, 9.700000946000001, 10.100000989000002, 10.500001032000002, 10.900001075, 11.300001118, 11.700001161000001, 12.100001204000002, 12.500001247000002, 12.90000129], "n": 408}, "frequentItems": null, "drift_from_ref": null, "isDiscrete": false, "featureStats": {"total_count": 408, "missing": 0, "distinct": 15.931375081243552, "min": 0.9, "max": 12.9, "range": 12.0, "quantile_statistics": {"fifth_percentile": 1.6, "iqr": 0.7999999999999998, "q1": 2.0, "median": 2.3, "q3": 2.8, "ninety_fifth_percentile": 5.5}, "descriptive_statistics": {"stddev": 1.2990000858665753, "coefficient_of_variation": 0.49437249664993493, "sum": 1072.05, "variance": 1.6874012230813702, "mean": 2.6275735294117646}}}, "free sulfur dioxide": {"histogram": {"start": 3.0, "end": 51.0000051, "width": 0, "counts": [32, 78, 21, 21, 36, 17, 26, 26, 30, 21, 4, 13, 12, 10, 10, 6, 5, 4, 9, 5, 4, 8, 2, 2, 3, 0, 1, 0, 1, 1], "max": 51.0, "min": 3.0, "bins": [3.0, 4.60000017, 6.200000340000001, 7.80000051, 9.400000680000002, 11.000000850000001, 12.60000102, 14.200001190000002, 15.800001360000001, 17.40000153, 19.000001700000002, 20.600001870000003, 22.20000204, 23.800002210000002, 25.400002380000004, 27.00000255, 28.600002720000003, 30.200002890000004, 31.80000306, 33.40000323, 35.000003400000004, 36.600003570000005, 38.20000374000001, 39.80000391, 41.40000408, 43.00000425, 44.600004420000005, 46.200004590000006, 47.80000476000001, 49.40000493, 51.0000051], "n": 408}, "frequentItems": null, "drift_from_ref": null, "isDiscrete": false, "featureStats": {"total_count": 408, "missing": 0, "distinct": 11.029412969947018, "min": 3.0, "max": 51.0, "range": 48.0, "quantile_statistics": {"fifth_percentile": 3.0, "iqr": 13.0, "q1": 6.0, "median": 13.0, "q3": 19.0, "ninety_fifth_percentile": 36.0}, "descriptive_statistics": {"stddev": 9.994223698460777, "coefficient_of_variation": 0.6774056431550788, "sum": 6019.5, "variance": 99.884507334875, "mean": 14.753676470588236}}}, "density": {"histogram": {"start": 0.99007, "end": 1.0032001003200002, "width": 0, "counts": [4, 4, 0, 10, 4, 11, 8, 32, 32, 37, 38, 49, 46, 25, 25, 18, 15, 8, 4, 8, 6, 6, 2, 4, 4, 2, 0, 2, 0, 4], "max": 1.0032, "min": 0.99007, "bins": [0.99007, 0.9905076700106666, 0.9909453400213334, 0.991383010032, 0.9918206800426667, 0.9922583500533334, 0.992696020064, 0.9931336900746667, 0.9935713600853334, 0.9940090300960001, 0.9944467001066667, 0.9948843701173334, 0.9953220401280001, 0.9957597101386667, 0.9961973801493335, 0.9966350501600001, 0.9970727201706667, 0.9975103901813335, 0.9979480601920001, 0.9983857302026667, 0.9988234002133335, 0.9992610702240001, 0.9996987402346668, 1.0001364102453334, 1.0005740802560001, 1.0010117502666669, 1.0014494202773334, 1.0018870902880002, 1.002324760298667, 1.0027624303093334, 1.0032001003200002], "n": 408}, "frequentItems": null, "drift_from_ref": null, "isDiscrete": false, "featureStats": {"total_count": 408, "missing": 0, "distinct": 55.88238444546564, "min": 0.99007, "max": 1.0032, "range": 0.013130000000000086, "quantile_statistics": {"fifth_percentile": 0.9922, "iqr": 0.0023599999999999177, "q1": 0.99394, "median": 0.99516, "q3": 0.9963, "ninety_fifth_percentile": 0.9996}, "descriptive_statistics": {"stddev": 0.0021784570136347352, "coefficient_of_variation": 0.002188682344428877, "sum": 406.09385999999995, "variance": 4.745674960254368e-06, "mean": 0.995328088235294}}}, "total sulfur dioxide": {"histogram": {"start": 6.0, "end": 289.0000289, "width": 0, "counts": [84, 92, 70, 48, 39, 14, 16, 11, 9, 10, 6, 3, 0, 0, 0, 2, 2, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2], "max": 289.0, "min": 6.0, "bins": [6.0, 15.433334296666667, 24.866668593333333, 34.30000289, 43.73333718666667, 53.16667148333333, 62.600005780000004, 72.03334007666666, 81.46667437333333, 90.90000867, 100.33334296666666, 109.76667726333334, 119.20001156000001, 128.63334585666666, 138.06668015333332, 147.50001445, 156.93334874666667, 166.36668304333332, 175.80001734, 185.23335163666667, 194.66668593333333, 204.10002023, 213.53335452666667, 222.96668882333333, 232.40002312000001, 241.83335741666667, 251.26669171333333, 260.70002601, 270.13336030666665, 279.56669460333336, 289.0000289], "n": 408}, "frequentItems": null, "drift_from_ref": null, "isDiscrete": false, "featureStats": {"total_count": 408, "missing": 0, "distinct": 22.303926553943704, "min": 6.0, "max": 289.0, "range": 283.0, "quantile_statistics": {"fifth_percentile": 10.0, "iqr": 29.0, "q1": 17.0, "median": 28.0, "q3": 46.0, "ninety_fifth_percentile": 96.0}, "descriptive_statistics": {"stddev": 31.68721099598923, "coefficient_of_variation": 0.8554477659209692, "sum": 15112.999999999998, "variance": 1004.0793407043408, "mean": 37.041666666666664}}}}, "properties": null};\n", | |
| " // Config handlebars and pass data to HBS template\n", | |
| " const source = document.getElementById("entry-template").innerHTML;\n", | |
| " const template = Handlebars.compile(source);\n", | |
| " const html = template(context);\n", | |
| " const target = document.getElementById("generated-html");\n", | |
| " target.innerHTML = html;\n", | |
| " }\n", | |
| "\n", | |
| " function initWebsiteScripts() {\n", | |
| " const $featureSearch = document.getElementById("wl__feature-search");\n", | |
| " const $tableBody = document.getElementById("table-body");\n", | |
| " const $discrete = document.getElementById("inferredDiscrete");\n", | |
| " const $nonDiscrete = document.getElementById("inferredNonDiscrete");\n", | |
| " const $unknown = document.getElementById("inferredUnknown");\n", | |
| "\n", | |
| " const activeTypes = {\n", | |
| " discrete: true,\n", | |
| " "non-discrete": true,\n", | |
| " unknown: true,\n", | |
| " };\n", | |
| "\n", | |
| " let searchString = "";\n", | |
| "\n", | |
| " function debounce(func, wait, immediate) {\n", | |
| " let timeout;\n", | |
| "\n", | |
| " return function () {\n", | |
| " const context = this;\n", | |
| " const args = arguments;\n", | |
| " const later = function () {\n", | |
| " timeout = null;\n", | |
| " if (!immediate) func.apply(context, args);\n", | |
| " };\n", | |
| "\n", | |
| " const callNow = immediate && !timeout;\n", | |
| " clearTimeout(timeout);\n", | |
| " timeout = setTimeout(later, wait);\n", | |
| " if (callNow) func.apply(context, args);\n", | |
| " };\n", | |
| " }\n", | |
| "\n", | |
| " function filterNotification() {\n", | |
| " const $notifCircleContainer = $(".notif-circle-container")\n", | |
| " const $boxes = $('.wl_filter-options>.form-check>input[name=checkbox]:checked');\n", | |
| " const item = Object.values($boxes).find(function(value) { return $(value)[0] === undefined});\n", | |
| " if (item === undefined) {\n", | |
| " $notifCircleContainer.removeClass("d-none")\n", | |
| " } else {\n", | |
| " $notifCircleContainer.addClass("d-none")\n", | |
| " }\n", | |
| " }\n", | |
| "\n", | |
| " function handleSearch() {\n", | |
| " const tableBodyChildren = $tableBody.children;\n", | |
| "\n", | |
| " for (let i = 0; i < tableBodyChildren.length; i++) {\n", | |
| " const type = tableBodyChildren[i].dataset.inferredType.toLowerCase();\n", | |
| " const name = tableBodyChildren[i].dataset.featureName.toLowerCase();\n", | |
| "\n", | |
| " if (activeTypes[type] && name.startsWith(searchString)) {\n", | |
| " tableBodyChildren[i].style.display = "";\n", | |
| " } else {\n", | |
| " tableBodyChildren[i].style.display = "none";\n", | |
| " }\n", | |
| " }\n", | |
| " }\n", | |
| "\n", | |
| " $featureSearch.addEventListener(\n", | |
| " "keyup",\n", | |
| " debounce((event) => {\n", | |
| " searchString = event.target.value.toLowerCase();\n", | |
| " handleSearch();\n", | |
| " }, 100),\n", | |
| " );\n", | |
| "\n", | |
| " $discrete.addEventListener("change", (event) => {\n", | |
| " if (event.currentTarget.checked) {\n", | |
| " activeTypes["discrete"] = true;\n", | |
| " } else {\n", | |
| " activeTypes["discrete"] = false;\n", | |
| " }\n", | |
| " handleSearch();\n", | |
| " filterNotification()\n", | |
| " });\n", | |
| "\n", | |
| " $nonDiscrete.addEventListener("change", (event) => {\n", | |
| " if (event.currentTarget.checked) {\n", | |
| " activeTypes["non-discrete"] = true;\n", | |
| " } else {\n", | |
| " activeTypes["non-discrete"] = false;\n", | |
| " }\n", | |
| " handleSearch();\n", | |
| " filterNotification()\n", | |
| " });\n", | |
| "\n", | |
| " $unknown.addEventListener("change", (event) => {\n", | |
| " if (event.currentTarget.checked) {\n", | |
| " activeTypes["unknown"] = true;\n", | |
| " } else {\n", | |
| " activeTypes["unknown"] = false;\n", | |
| " }\n", | |
| " handleSearch();\n", | |
| " filterNotification()\n", | |
| " });\n", | |
| "\n", | |
| " function checkCurrentProfile(item, referenceItem) {\n", | |
| " if (referenceProfile && Object.values(referenceProfile)) {\n", | |
| " return referenceItem\n", | |
| " } else {\n", | |
| " return item\n", | |
| " }\n", | |
| " }\n", | |
| "\n", | |
| " if(checkCurrentProfile(true, false)) {\n", | |
| " $(".svg-container").css("padding-bottom", "27%")\n", | |
| " $("#diff-from-ref").addClass("d-none")\n", | |
| " $(".diff-from-ref-table-cell").addClass("d-none")\n", | |
| " } else {\n", | |
| " $("#diff-from-ref").removeClass("d-none")\n", | |
| " $(".diff-from-ref-table-cell").removeClass("d-none")\n", | |
| " }\n", | |
| " }\n", | |
| "\n", | |
| " function checkedBoxes() {\n", | |
| " const $boxes = $('input[name=checkbox]:checked');\n", | |
| " const $notifCircleContainer = $(".notif-circle-container")\n", | |
| "\n", | |
| " if ($boxes.length) {\n", | |
| " $notifCircleContainer.removeClass("d-none")\n", | |
| " }\n", | |
| " }\n", | |
| "\n", | |
| " function openFilter() {\n", | |
| " const $filterOptions = $(".dropdown-container");\n", | |
| " const $notifCircleContainer = $(".notif-circle-container")\n", | |
| " const filterClass = $filterOptions.attr("class");\n", | |
| "\n", | |
| " if (filterClass.indexOf("d-none") > 0) {\n", | |
| " $notifCircleContainer.addClass("d-none")\n", | |
| " $filterOptions.removeClass("d-none");\n", | |
| " $(".filter-icon").addClass("d-none")\n", | |
| " $(".close-filter-icon").removeClass("d-none")\n", | |
| " } else {\n", | |
| " $filterOptions.addClass("d-none");\n", | |
| " $(".close-filter-icon").addClass("d-none")\n", | |
| " $(".filter-icon").removeClass("d-none")\n", | |
| " checkedBoxes()\n", | |
| " }\n", | |
| " }\n", | |
| "\n", | |
| " // Invoke functions -- keep in mind invokation order\n", | |
| " registerHandlebarHelperFunctions();\n", | |
| " initHandlebarsTemplate();\n", | |
| " initWebsiteScripts();\n", | |
| " </script>\n", | |
| "</html>\n", | |
| "\" width=100% height=1000px\n", | |
| " frameBorder=0></iframe>" | |
| ], | |
| "text/plain": [ | |
| "<IPython.core.display.HTML object>" | |
| ] | |
| }, | |
| "execution_count": 1, | |
| "metadata": {}, | |
| "output_type": "execute_result" | |
| } | |
| ], | |
| "source": [ | |
| "# Load the data\n", | |
| "import pandas as pd\n", | |
| "pd.options.mode.chained_assignment = None # Disabling false positive warning\n", | |
| "\n", | |
| "url = \"http://archive.ics.uci.edu/ml/machine-learning-databases/wine-quality/winequality-red.csv\"\n", | |
| "wine = pd.read_csv(url,sep=\";\")\n", | |
| "\n", | |
| "# Split the wines into two groups: \n", | |
| "# with alcohol below 11 as the reference sample\n", | |
| "cond_reference = (wine['alcohol']<=11)\n", | |
| "wine_reference = wine.loc[cond_reference]\n", | |
| "# with alcohol above 11 as the target dataset\n", | |
| "cond_target = (wine['alcohol']>11)\n", | |
| "wine_target = wine.loc[cond_target]\n", | |
| "\n", | |
| "# Add some missing values to `citric acid`, to see how this is reflected in profile visualizer\n", | |
| "ixs = wine.iloc[100:110].index\n", | |
| "wine.loc[ixs,'citric acid'] = None\n", | |
| "\n", | |
| "# Transform the numeric `quality` feature to a categorical feature, \n", | |
| "# where each wine is classified as Good (above 6.5) or Bad\n", | |
| "bins = (2, 6.5, 8)\n", | |
| "group_names = ['bad', 'good']\n", | |
| "\n", | |
| "wine_reference['quality'] = pd.cut(wine_reference['quality'], bins = bins, labels = group_names)\n", | |
| "wine_target['quality'] = pd.cut(wine_target['quality'], bins = bins, labels = group_names)\n", | |
| "\n", | |
| "# Profile the dataframes with whylogs\n", | |
| "import whylogs as why\n", | |
| "result = why.log(pandas=wine_target)\n", | |
| "# Create profile_views as arguments to feed into the NotebookProfileVisualizer\n", | |
| "prof_view = result.view()\n", | |
| "# Repeat for the reference profile\n", | |
| "result_ref = why.log(pandas=wine_reference)\n", | |
| "prof_view_ref = result_ref.view()\n", | |
| "\n", | |
| "# Instantiate NotebookProfileViewer\n", | |
| "from whylogs.viz import NotebookProfileVisualizer\n", | |
| "\n", | |
| "visualization = NotebookProfileVisualizer()\n", | |
| "# Set the target and reference profiles\n", | |
| "visualization.set_profiles(target_profile_view=prof_view, reference_profile_view=prof_view_ref)\n", | |
| "\n", | |
| "# Run a summary_drift_report\n", | |
| "visualization.summary_drift_report()" | |
| ] | |
| } | |
| ], | |
| "metadata": { | |
| "interpreter": { | |
| "hash": "498e653baf04937463e348bd994b2947df7aeb22ca9551fbd507161022670ceb" | |
| }, | |
| "kernelspec": { | |
| "display_name": "whylabs_env", | |
| "language": "python", | |
| "name": "whylabs_env" | |
| }, | |
| "language_info": { | |
| "codemirror_mode": { | |
| "name": "ipython", | |
| "version": 3 | |
| }, | |
| "file_extension": ".py", | |
| "mimetype": "text/x-python", | |
| "name": "python", | |
| "nbconvert_exporter": "python", | |
| "pygments_lexer": "ipython3", | |
| "version": "3.9.12" | |
| } | |
| }, | |
| "nbformat": 4, | |
| "nbformat_minor": 2 | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment