{% extends "global/Page.html" %}
{% load staticfiles otree %}

{% block title %}
    Understanding Check - 1/3
{% endblock %}

{% block content %}

<style>
table#t01, table#t01 thead, table#t01 td, table#t01 tr{
    border: 1px solid black;
    font-size:93%
}
div.a {
    text-indent:201px;
}

</style>

<h5>Statements</h5>
<ol>
    <li>In this example, starting from the "base value" (104.7), all feature importance are added up and "push" the output value to the position it
eventually is to be found (103).</li>
    <li>In this example, the three features with the largest impact in "pushing" the output value (no matter if higher or lower) and the feature
        "5_days_ago" added have no impact on the "output value" as they cancel each other out (add up to 0).</li>
    <li>The impact of the features "Avg_total" and "1_month_ago" (-0.6 and 0.5 in this example) will always be the same for
        other predictions made by the ML algorithm.</li>
</ol>

<table class="table", id="t01">
                <thead>
                <small>(Put your mouse over a feature to see its description)</small></thead>
                <tr>
                    <td>
                        <div style="float:left;text-align:left;"><span title="Average of all previous data points">Avg_total </span>= 104.2</div>
                        <div style="float:right;text-align:right;"><b>-0.6</b></div>
                    </td>
                    <td>
                        <div style="float:left;text-align:left;"><span title="Average of all previous data points which have the same month value as the upcoming forecast to
                    be made (e.g. all historical data points in January, no matter which year)">Avg_month = 80.2</span></div>
                        <div style="float:right;text-align:right;"><b>-2.8</b></div>
                    </td>
                    <td>
                        <div style="float:left;text-align:left;"><span title="Actual demand value 1 day ago">1_day_ago = 104</span></div>
                        <div style="float:right;text-align:right;"><b>0.1</b></div>
                    </td>
                    <td>
                        <div style="float:left;text-align:left;"><span title="Actual demand value 4 days ago">4_days_ago = 108</span></div>
                        <div style="float:right;text-align:right;"><b>0.3</b></div>
                    </td>
                    <td>
                        <div style="float:left;text-align:left;"><span title="Actual demand value 1 week ago">1_week_ago = 106</span></div>
                        <div style="float:right;text-align:right;"><b>1.0</b></div>
                    </td>
                </tr>
                <tr>
                    <td>
                        <div style="float:left;text-align:left;"><span title="Average of all previous data points which have the same year value as the upcoming forecast to
                    be made (e.g. all data points of 2017)">Avg_year = 87.3</span></div>
                        <div style="float:right;text-align:right;"><b>1.0</b></div>
                    </td>
                    <td>
                        <div style="float:left;text-align:left;"><span title="Average of all previous data points which have the same week value as the upcoming forecast to
                    be made (e.g. all data points of calender week 42, no matter which year)">Avg_week = 79.6</span></div>
                        <div style="float:right;text-align:right;"><b>-3.7</b></div>
                    </td>
                    <td>
                        <div style="float:left;text-align:left;"><span title="Actual demand value 2 days ago">2_days_ago = 74</span></div>
                        <div style="float:right;text-align:right;"><b>-1.3</b></div>
                    </td>
                    <td>
                        <div style="float:left;text-align:left;"><span title="Actual demand value 5 days ago">5_days_ago = 79</span></div>
                        <div style="float:right;text-align:right;"><b>0.4</b></div>
                    </td>
                    <td>
                        <div style="float:left;text-align:left;"><span title="Actual demand value 1 month (4*7 days) ago">1_month_ago = 100</span></div>
                        <div style="float:right;text-align:right;"><b>0.5</b></div>
                    </td>
                </tr>
                <tr>
                    <td>
                        <div style="float:left;text-align:left;"><span title="Average of all previous data points which have the same quarter value as the upcoming forecast to
                    be made (e.g. all data points in first quarter, no matter which year)">Avg_quarter = 82.7</span></div>
                        <div style="float:right;text-align:right;"><b>-0.6</b></div>
                    </td>
                    <td>
                        <div style="float:left;text-align:left;"><span title="Average of all previous data points which have the same weekday value as the upcoming forecast to
                    be made (e.g. all data points on a Monday, no matter which week, month, quarter or year)">Avg_weekday = 116.4</span></div>
                        <div style="float:right;text-align:right;"><b>7.3</b></div>
                    </td>
                    <td>
                        <div style="float:left;text-align:left;"><span title="Actual demand value 3 days ago">3_days_ago = 78</span></div>
                        <div style="float:right;text-align:right;"><b>-0.1</b></div>
                    </td>
                    <td>
                        <div style="float:left;text-align:left;"><span title="Actual demand value 6 days ago">6_days_ago = 133</span></div>
                        <div style="float:right;text-align:right;"><b>0.5</b></div>
                    </td>
                    <td>
                        <div style="float:left;text-align:left;"><span title="Actual demand value 1 year (52*7 days) ago">1_year_ago = 90</span></div>
                        <div style="float:right;text-align:right;"><b>-4.0</b></div>
                    </td>
                </tr>

</table>
    Output = 104.7 (base value) + (-0.6) + (1.0) + (-0.6)
             + (-2.8) + (-3.7) + (7.3) + (0.1)
             + (-1.3)
    <div class="a">+ (-0.1) + (0.3) + (0.4)
             + (0.5) + (1.0) + (0.5) + (-4.0)
        &#8776 <b>103</b></div><br/>

{% formfield player.x1 %}

    {% next_button %}


{% endblock %}