tutorial/common/tuto-common02-shapash-webapp.ipynb

{
 "cells": [
  {
   "cell_type": "markdown",
   "id": "e0428e7d",
   "metadata": {},
   "source": [
    "# Use Shapash Webapp with Eurybia\n"
   ]
  },
  {
   "cell_type": "markdown",
   "id": "a38202ed",
   "metadata": {},
   "source": [
    "**With this tutorial, you will**\n",
    "learn to use Eurybia and the Shapash webapp to understand your datadrift classifier<br />\n",
    "\n",
    "Contents:\n",
    "- Build a model to deploy\n",
    "- Do data validation between learning dataset and production dataset\n",
    "- Generate Report \n",
    "- Run Webapp\n",
    "\n",
    "\n",
    "Data from Kaggle [Titanic](https://www.kaggle.com/c/titanic)<br />"
   ]
  },
  {
   "cell_type": "markdown",
   "id": "8e317052",
   "metadata": {},
   "source": [
    "**Requirements notice** : the following tutorial may use third party modules not included in Eurybia.  \n",
    "You can find them all in one file [on our Github repository](https://github.com/MAIF/eurybia/blob/master/requirements.dev.txt) or you can manually install those you are missing, if any."
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 3,
   "id": "17e0ebcd",
   "metadata": {},
   "outputs": [],
   "source": [
    "import pandas as pd\n",
    "from category_encoders import OrdinalEncoder\n",
    "import catboost\n",
    "from eurybia.core.smartdrift import SmartDrift\n",
    "from sklearn.model_selection import train_test_split"
   ]
  },
  {
   "cell_type": "markdown",
   "id": "bec988d5",
   "metadata": {},
   "source": [
    "## Building Supervized Model\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 4,
   "id": "53ab6c7e",
   "metadata": {},
   "outputs": [],
   "source": [
    "from eurybia.data.data_loader import data_loading"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 5,
   "id": "6e06664a",
   "metadata": {},
   "outputs": [],
   "source": [
    "titan_df = data_loading('titanic')"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 6,
   "id": "3dc1a8aa",
   "metadata": {},
   "outputs": [],
   "source": [
    "features = ['Pclass', 'Age', 'Embarked', 'Sex', 'SibSp', 'Parch', 'Fare']\n",
    "features_to_encode = ['Pclass', 'Embarked', 'Sex']"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "6e36c91f",
   "metadata": {},
   "outputs": [],
   "source": [
    "encoder = OrdinalEncoder(cols=features_to_encode)\n",
    "encoder.fit(titan_df[features], verbose=False) "
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 8,
   "id": "76bff26a",
   "metadata": {},
   "outputs": [],
   "source": [
    "titan_df_encoded = encoder.transform(titan_df[features])"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 9,
   "id": "eb1a6d0c",
   "metadata": {},
   "outputs": [],
   "source": [
    "X_train, X_test, y_train, y_test = train_test_split(\n",
    "    titan_df_encoded,\n",
    "    titan_df['Survived'].to_frame(),\n",
    "    test_size=0.2,\n",
    "    random_state=11\n",
    ")"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 10,
   "id": "02e96d8b",
   "metadata": {},
   "outputs": [],
   "source": [
    "i=0\n",
    "indice_cat  = []\n",
    "for feature in titan_df_encoded:\n",
    "    if feature in features_to_encode:\n",
    "        indice_cat.append(i)\n",
    "    i=i+1"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 11,
   "id": "cbe55ad2",
   "metadata": {},
   "outputs": [],
   "source": [
    "model = catboost.CatBoostClassifier(loss_function= \"Logloss\", eval_metric=\"Logloss\",\n",
    "        learning_rate=0.143852,\n",
    "        iterations=500,\n",
    "        l2_leaf_reg=15,\n",
    "        max_depth = 4)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 12,
   "id": "920f68e7",
   "metadata": {},
   "outputs": [],
   "source": [
    "train_pool_cat = catboost.Pool(data=X_train, label= y_train, cat_features = indice_cat)\n",
    "test_pool_cat = catboost.Pool(data=X_test, label=y_test, cat_features = indice_cat) "
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 13,
   "id": "6bc34d41",
   "metadata": {},
   "outputs": [],
   "source": [
    "model.fit(train_pool_cat, eval_set=test_pool_cat, silent=True)\n",
    "y_pred = model.predict(X_test)"
   ]
  },
  {
   "cell_type": "markdown",
   "id": "afa288f0",
   "metadata": {},
   "source": [
    "## Creating a fake dataset as a production dataset\n",
    "\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 14,
   "id": "7b5bdd9a",
   "metadata": {},
   "outputs": [],
   "source": [
    "import random"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 15,
   "id": "c324e6a0",
   "metadata": {},
   "outputs": [],
   "source": [
    "df_production = titan_df.copy()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 16,
   "id": "3dc18f14",
   "metadata": {},
   "outputs": [],
   "source": [
    "df_production['Age'] = df_production['Age'].apply(lambda x: random.randrange(10, 76)).astype(float)\n",
    "df_production['Fare'] = df_production['Fare'].apply(lambda x: random.randrange(1, 100)).astype(float)\n",
    "list_sex= [\"male\", \"female\"]\n",
    "df_production['Sex'] = df_production['Sex'].apply(lambda x: random.choice(list_sex))"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 17,
   "id": "61d65879",
   "metadata": {},
   "outputs": [],
   "source": [
    "df_baseline = titan_df[features]\n",
    "df_current = df_production[features]"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 18,
   "id": "ec99ad68",
   "metadata": {},
   "outputs": [
    {
     "data": {
      "text/html": [
       "<div>\n",
       "<style scoped>\n",
       "    .dataframe tbody tr th:only-of-type {\n",
       "        vertical-align: middle;\n",
       "    }\n",
       "\n",
       "    .dataframe tbody tr th {\n",
       "        vertical-align: top;\n",
       "    }\n",
       "\n",
       "    .dataframe thead th {\n",
       "        text-align: right;\n",
       "    }\n",
       "</style>\n",
       "<table border=\"1\" class=\"dataframe\">\n",
       "  <thead>\n",
       "    <tr style=\"text-align: right;\">\n",
       "      <th></th>\n",
       "      <th>Pclass</th>\n",
       "      <th>Age</th>\n",
       "      <th>Embarked</th>\n",
       "      <th>Sex</th>\n",
       "      <th>SibSp</th>\n",
       "      <th>Parch</th>\n",
       "      <th>Fare</th>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>PassengerId</th>\n",
       "      <th></th>\n",
       "      <th></th>\n",
       "      <th></th>\n",
       "      <th></th>\n",
       "      <th></th>\n",
       "      <th></th>\n",
       "      <th></th>\n",
       "    </tr>\n",
       "  </thead>\n",
       "  <tbody>\n",
       "    <tr>\n",
       "      <th>1</th>\n",
       "      <td>Third class</td>\n",
       "      <td>19.0</td>\n",
       "      <td>Southampton</td>\n",
       "      <td>female</td>\n",
       "      <td>1</td>\n",
       "      <td>0</td>\n",
       "      <td>41.0</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>2</th>\n",
       "      <td>First class</td>\n",
       "      <td>40.0</td>\n",
       "      <td>Cherbourg</td>\n",
       "      <td>male</td>\n",
       "      <td>1</td>\n",
       "      <td>0</td>\n",
       "      <td>52.0</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>3</th>\n",
       "      <td>Third class</td>\n",
       "      <td>40.0</td>\n",
       "      <td>Southampton</td>\n",
       "      <td>female</td>\n",
       "      <td>0</td>\n",
       "      <td>0</td>\n",
       "      <td>81.0</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>4</th>\n",
       "      <td>First class</td>\n",
       "      <td>53.0</td>\n",
       "      <td>Southampton</td>\n",
       "      <td>male</td>\n",
       "      <td>1</td>\n",
       "      <td>0</td>\n",
       "      <td>15.0</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>5</th>\n",
       "      <td>Third class</td>\n",
       "      <td>46.0</td>\n",
       "      <td>Southampton</td>\n",
       "      <td>male</td>\n",
       "      <td>0</td>\n",
       "      <td>0</td>\n",
       "      <td>69.0</td>\n",
       "    </tr>\n",
       "  </tbody>\n",
       "</table>\n",
       "</div>"
      ],
      "text/plain": [
       "                  Pclass   Age     Embarked     Sex  SibSp  Parch  Fare\n",
       "PassengerId                                                            \n",
       "1            Third class  19.0  Southampton  female      1      0  41.0\n",
       "2            First class  40.0    Cherbourg    male      1      0  52.0\n",
       "3            Third class  40.0  Southampton  female      0      0  81.0\n",
       "4            First class  53.0  Southampton    male      1      0  15.0\n",
       "5            Third class  46.0  Southampton    male      0      0  69.0"
      ]
     },
     "execution_count": 18,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "df_current.head()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 19,
   "id": "176e8de1",
   "metadata": {},
   "outputs": [
    {
     "data": {
      "text/html": [
       "<div>\n",
       "<style scoped>\n",
       "    .dataframe tbody tr th:only-of-type {\n",
       "        vertical-align: middle;\n",
       "    }\n",
       "\n",
       "    .dataframe tbody tr th {\n",
       "        vertical-align: top;\n",
       "    }\n",
       "\n",
       "    .dataframe thead th {\n",
       "        text-align: right;\n",
       "    }\n",
       "</style>\n",
       "<table border=\"1\" class=\"dataframe\">\n",
       "  <thead>\n",
       "    <tr style=\"text-align: right;\">\n",
       "      <th></th>\n",
       "      <th>Pclass</th>\n",
       "      <th>Age</th>\n",
       "      <th>Embarked</th>\n",
       "      <th>Sex</th>\n",
       "      <th>SibSp</th>\n",
       "      <th>Parch</th>\n",
       "      <th>Fare</th>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>PassengerId</th>\n",
       "      <th></th>\n",
       "      <th></th>\n",
       "      <th></th>\n",
       "      <th></th>\n",
       "      <th></th>\n",
       "      <th></th>\n",
       "      <th></th>\n",
       "    </tr>\n",
       "  </thead>\n",
       "  <tbody>\n",
       "    <tr>\n",
       "      <th>1</th>\n",
       "      <td>Third class</td>\n",
       "      <td>22.0</td>\n",
       "      <td>Southampton</td>\n",
       "      <td>male</td>\n",
       "      <td>1</td>\n",
       "      <td>0</td>\n",
       "      <td>7.25</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>2</th>\n",
       "      <td>First class</td>\n",
       "      <td>38.0</td>\n",
       "      <td>Cherbourg</td>\n",
       "      <td>female</td>\n",
       "      <td>1</td>\n",
       "      <td>0</td>\n",
       "      <td>71.28</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>3</th>\n",
       "      <td>Third class</td>\n",
       "      <td>26.0</td>\n",
       "      <td>Southampton</td>\n",
       "      <td>female</td>\n",
       "      <td>0</td>\n",
       "      <td>0</td>\n",
       "      <td>7.92</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>4</th>\n",
       "      <td>First class</td>\n",
       "      <td>35.0</td>\n",
       "      <td>Southampton</td>\n",
       "      <td>female</td>\n",
       "      <td>1</td>\n",
       "      <td>0</td>\n",
       "      <td>53.10</td>\n",
       "    </tr>\n",
       "    <tr>\n",
       "      <th>5</th>\n",
       "      <td>Third class</td>\n",
       "      <td>35.0</td>\n",
       "      <td>Southampton</td>\n",
       "      <td>male</td>\n",
       "      <td>0</td>\n",
       "      <td>0</td>\n",
       "      <td>8.05</td>\n",
       "    </tr>\n",
       "  </tbody>\n",
       "</table>\n",
       "</div>"
      ],
      "text/plain": [
       "                  Pclass   Age     Embarked     Sex  SibSp  Parch   Fare\n",
       "PassengerId                                                             \n",
       "1            Third class  22.0  Southampton    male      1      0   7.25\n",
       "2            First class  38.0    Cherbourg  female      1      0  71.28\n",
       "3            Third class  26.0  Southampton  female      0      0   7.92\n",
       "4            First class  35.0  Southampton  female      1      0  53.10\n",
       "5            Third class  35.0  Southampton    male      0      0   8.05"
      ]
     },
     "execution_count": 19,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "df_baseline.head()"
   ]
  },
  {
   "cell_type": "markdown",
   "id": "f58587d7",
   "metadata": {},
   "source": [
    "## Use Eurybia for data validation"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 20,
   "id": "7fff0997",
   "metadata": {},
   "outputs": [],
   "source": [
    "from eurybia import SmartDrift"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 21,
   "id": "202f0930",
   "metadata": {},
   "outputs": [],
   "source": [
    "sd = SmartDrift(df_current=df_current, df_baseline=df_baseline, deployed_model=model, encoding=encoder)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 22,
   "id": "eae66775",
   "metadata": {},
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "CPU times: user 35.9 s, sys: 5.03 s, total: 40.9 s\n",
      "Wall time: 1.97 s\n"
     ]
    }
   ],
   "source": [
    "%time sd.compile(full_validation=True)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 24,
   "id": "b09782dc",
   "metadata": {},
   "outputs": [
    {
     "data": {
      "text/markdown": [
       "Report saved to ./report_titanic.html. To upload and share your report, create a free Datapane account by running `!datapane signup`."
      ],
      "text/plain": [
       "<IPython.core.display.Markdown object>"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    }
   ],
   "source": [
    "sd.generate_report(    \n",
    "    output_file='report_titanic.html',    \n",
    "    title_story=\"Data validation\",\n",
    "    title_description=\"\"\"Titanic Data validation\"\"\"   \n",
    "    )"
   ]
  },
  {
   "cell_type": "markdown",
   "id": "5f3e9edc",
   "metadata": {},
   "source": [
    "## Launch WebApp Shapash from SmartDrift"
   ]
  },
  {
   "cell_type": "markdown",
   "id": "945db78a",
   "metadata": {},
   "source": [
    "After compile step, you can launch a WebApp Shapash directly from your object SmartDrift. It allows you to access several dynamic plots that will help you to understand where drift has been detected in your data. <br/>\n",
    "For information on Shapash Webapp : (https://github.com/MAIF/shapash)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "7ac7db48",
   "metadata": {},
   "outputs": [],
   "source": [
    "app = sd.xpl.run_app(title_story='Eurybia datadrift classifier')"
   ]
  },
  {
   "cell_type": "markdown",
   "id": "7e4051a4",
   "metadata": {},
   "source": [
    "**Stop the WebApp after using it**"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "66b73619",
   "metadata": {},
   "outputs": [],
   "source": [
    "app.kill()"
   ]
  }
 ],
 "metadata": {
  "kernelspec": {
   "display_name": "dev_eurybia",
   "language": "python",
   "name": "dev_eurybia"
  },
  "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"
  },
  "toc": {
   "base_numbering": 1,
   "nav_menu": {},
   "number_sections": true,
   "sideBar": true,
   "skip_h1_title": false,
   "title_cell": "Table of Contents",
   "title_sidebar": "Contents",
   "toc_cell": false,
   "toc_position": {},
   "toc_section_display": true,
   "toc_window_display": false
  }
 },
 "nbformat": 4,
 "nbformat_minor": 5
}