mainlang_documentation_eg.html

{% assign language = page.language %}

{% if page.language == "plotly_js" %}
    {% assign language = "javascript" %}
{% endif %}

{% assign num_examples = 5 %}

{% comment %}First, check which sections this page should contain checking all of the posts{% endcomment %}
{%- for page in languagelist -%}
    {% if page.layout != "langindex" %}
        {% if page.display_as == "file_settings" %}
            {% assign file_settings = true %}
        {% elsif page.display_as == "chart_type" or page.display_as == "basic" %}
            {% assign chart_type = true %}
        {% elsif page.display_as == "statistical" %}
            {% assign statistical = true %}
        {% elsif page.display_as == "scientific" %}
            {% assign scientific = true %}
        {% elsif page.display_as == "advanced_charts" %}
            {% assign advanced_charts = true %}
        {% elsif page.display_as == "maps" %}
            {% assign maps = true %}
        {% elsif page.display_as == "financial" %}
            {% assign financial = true %}
        {% elsif page.display_as == "3d_charts" %}
            {% assign 3d_charts = true %}
        {% elsif page.display_as == "multiple_axes" %}
            {% assign multiple_axes = true %}
        {% elsif page.display_as == "transforms" %}
            {% assign transforms = true %}
        {% elsif page.display_as == "controls" %}
            {% assign controls = true %}
        {% elsif page.display_as == "animations" %}
            {% assign animations = true %}
        {% elsif page.display_as == "chart_events" %}
            {% assign chart_events = true %}
        {% elsif page.display_as == "advanced_opt" %}
            {% assign advanced_opt = true %}
        {% elsif page.display_as == "ai_ml" %}
            {% assign ai_ml = true %}
        {% elsif page.display_as == "bio" %}
            {% assign bio = true %}
        {% endif %}
    {% endif %}
{%- endfor -%}

{% comment %} these are the pages that don't have images to show {% endcomment %}
{%- for page in languagelist -%}
    {% if page.display_as == "layout_opt" %}
        {% assign layout_options = true %}
    {% elsif page.display_as == "style_opt" %}
        {% assign style_options = true %}
    {% endif %}
{%- endfor -%}

{% include both/py4_note.html %}


{% if file_settings %}
<section class="--tutorial-section">
    <header class="--section-header">
        <a href="#fundamentals" name="fundamentals" id="fundamentals">Fundamentals</a>

        {% assign forloop_idx = 0 %}
        {%- for page in languagelist -%}
            {% if page.display_as == "file_settings" and page.layout != "langindex" %}
                {% assign forloop_idx = forloop_idx | plus:1 %}
            {% endif %}
        {%- endfor -%}

        {% if forloop_idx > num_examples %}
        <a href="/{{language}}/plotly-fundamentals" class="langindexlink">More Fundamentals &raquo;</a>
        {% endif %}
    </header>
    <section class="--grid">
        <ul class="--grid-list">

            {% assign forloop_idx = 0 %}

            {%- for page in languagelist -%}
                {% if page.display_as == "file_settings" and page.layout != "langindex" and forloop_idx < num_examples  %}
                    {% assign forloop_idx = forloop_idx | plus:1 %}
                    {% include layouts/grid-item.html %}
                {% endif %}
            {%- endfor -%}

        </ul>
    </section>
</section>
{% endif %}






{% if chart_type %}
<section class="--tutorial-section">
    <header class="--section-header">
        <a href="#basic-charts" id="basic-charts">Basic Charts</a>

        {% assign forloop_idx = 0 %}
        {%- for page in languagelist -%}
            {% if page.display_as == "chart_type" or page.display_as == "basic" and page.layout != "langindex" %}
                {% assign forloop_idx = forloop_idx | plus:1 %}
            {% endif %}
        {%- endfor -%}

        {% if forloop_idx > num_examples %}
        <a href="/{{language}}/basic-charts/" class="langindexlink">More Basic Charts &raquo;</a>
        {% endif %}
    </header>
    <section class="--grid">
        <ul class="--grid-list">

            {% assign forloop_idx = 0 %}

            {%- for page in languagelist -%}

                {% assign category_elligible = false %}

                {% if page.display_as == "chart_type" or page.display_as == "basic"  %}
                    {% assign category_elligible = true %}
                {% endif %}

                {% if category_elligible and page.layout != "langindex" and forloop_idx < num_examples  %}
                    {% assign forloop_idx = forloop_idx | plus:1 %}
                    {% include layouts/grid-item.html %}
                {% endif %}
            {%- endfor -%}
        </ul>
    </section>
</section>
{% endif %}

{% if statistical %}
<section class="--tutorial-section">
    <header class="--section-header">
        <a href="#statistical-charts" id="statistical-charts">Statistical Charts</a>

        {% assign forloop_idx = 0 %}
        {%- for page in languagelist -%}
            {% if page.display_as == "statistical" and page.layout != "langindex" %}
                {% assign forloop_idx = forloop_idx | plus:1 %}
            {% endif %}
        {%- endfor -%}

        {% if forloop_idx > num_examples %}
        <a href="/{{language}}/statistical-charts/" class="langindexlink">More Statistical Charts &raquo;</a>
        {% endif %}
    </header>
    <section class="--grid">
        <ul class="--grid-list">

            {% assign forloop_idx = 0 %}

            {%- for page in languagelist -%}
                {% if page.display_as == "statistical" and page.layout != "langindex" and forloop_idx < num_examples  %}
                    {% assign forloop_idx = forloop_idx | plus:1 %}
                    {% include layouts/grid-item.html %}
                {% endif %}
            {%- endfor -%}

        </ul>
    </section>
</section>
{% endif %}

{% if scientific %}
<section class="--tutorial-section" id="scientific-charts">
    <header class="--section-header">
        <a href="#scientific-charts">Scientific Charts</a>

        {% assign forloop_idx = 0 %}
        {%- for page in languagelist -%}
            {% if page.display_as == "scientific" and page.layout != "langindex" %}
                {% assign forloop_idx = forloop_idx | plus:1 %}
            {% endif %}
        {%- endfor -%}

        {% if forloop_idx > num_examples %}
        <a href="/{{language}}/scientific-charts/" class="langindexlink">More Scientific Charts &raquo;</a>
        {% endif %}
    </header>
    <section class="--grid">
        <ul class="--grid-list">

            {% assign forloop_idx = 0 %}

            {%- for page in languagelist -%}
                {% if page.display_as == "scientific" and page.layout != "langindex" and forloop_idx < num_examples  %}
                    {% assign forloop_idx = forloop_idx | plus:1 %}
                    {% include layouts/grid-item.html %}
                {% endif %}
            {%- endfor -%}

        </ul>
    </section>
</section>
{% endif %}

{% if financial %}
<section class="--tutorial-section" id="financial-charts">
    <header class="--section-header">
        <a href="#financial-charts">Financial Charts</a>

        {% assign forloop_idx = 0 %}
        {%- for page in languagelist -%}
            {% if page.display_as == "financial" and page.layout != "langindex" %}
                {% assign forloop_idx = forloop_idx | plus:1 %}
            {% endif %}
        {%- endfor -%}

        {% if forloop_idx > num_examples %}
        <a href="/{{language}}/financial-charts/" class="langindexlink">More Financial Charts &raquo;</a>
        {% endif %}
    </header>
    <section class="--grid">
        <ul class="--grid-list">

            {% assign forloop_idx = 0 %}

            {%- for page in languagelist -%}
                {% if page.display_as == "financial" and page.layout != "langindex" and forloop_idx < num_examples  %}
                    {% assign forloop_idx = forloop_idx | plus:1 %}
                    {% include layouts/grid-item.html %}
                {% endif %}
            {%- endfor -%}

        </ul>
    </section>
</section>
{% endif %}

{% if maps %}
<section class="--tutorial-section" id="maps">
    <header class="--section-header">
        <a href="#maps">Maps</a>

        {% assign forloop_idx = 0 %}
        {%- for page in languagelist -%}
            {% if page.display_as == "maps" and page.layout != "langindex" %}
                {% assign forloop_idx = forloop_idx | plus:1 %}
            {% endif %}
        {%- endfor -%}

        {% if forloop_idx > num_examples %}
        <a href="/{{language}}/maps/" class="langindexlink">More Maps &raquo;</a>
        {% endif %}
    </header>
    <section class="--grid">
        <ul class="--grid-list">

            {% assign forloop_idx = 0 %}

            {%- for page in languagelist -%}
                {% if page.display_as == "maps" and page.layout != "langindex" and forloop_idx < num_examples  %}
                    {% assign forloop_idx = forloop_idx | plus:1 %}
                    {% include layouts/grid-item.html %}
                {% endif %}
            {%- endfor -%}

        </ul>
    </section>
</section>
{% endif %}

{% if ai_ml %}
<section class="--tutorial-section">
    <header class="--section-header">
        <a href="#ai_ml" name="ai_ml" id="ai_ml">Artificial Intelligence and Machine Learning</a>

        {% assign forloop_idx = 0 %}
        {%- for page in languagelist -%}
            {% if page.display_as == "ai_ml" and page.layout != "langindex" %}
                {% assign forloop_idx = forloop_idx | plus:1 %}
            {% endif %}
        {%- endfor -%}

        {% if forloop_idx > num_examples %}
        <a href="/{{language}}/ai-ml/" class="langindexlink">More AI and ML &raquo;</a>
        {% endif %}
    </header>
    <section class="--grid">
        <ul class="--grid-list">

            {% assign forloop_idx = 0 %}

            {%- for page in languagelist -%}
                {% if page.display_as == "ai_ml" and page.layout != "langindex" and forloop_idx < num_examples  %}
                    {% assign forloop_idx = forloop_idx | plus:1 %}
                    {% include layouts/grid-item.html %}
                {% endif %}
            {%- endfor -%}

        </ul>
    </section>
</section>
{% endif %}



{% if bio %}
<section class="--tutorial-section">
    <header class="--section-header"><a href="#bio" name="bio" id="bio">Bioinformatics</a>
        <a href="/{{language}}/bio/" class="langindexlink">More Bioinformatics &raquo;</a>
    </header>
    <section class="--grid">
        <ul class="--grid-list">
            {%- for page in languagelist -%}
            {% if page.display_as == "bio" and page.order < num_examples %}


            {% include layouts/grid-item.html %}
            {% endif %}
            {%- endfor -%}
        </ul>
        <a href="/{{language}}/bio/" class="langindexlink-mobile">More Bioinformatics &raquo;</a>
    </section>
</section>
{% endif %}
{% if 3d_charts %}
<section class="--tutorial-section" id="3d-charts">
    <header class="--section-header">
        <a href="#3d-charts">3D Charts</a>

        {% assign forloop_idx = 0 %}
        {%- for page in languagelist -%}
            {% if page.display_as == "3d_charts" and page.layout != "langindex" %}
                {% assign forloop_idx = forloop_idx | plus:1 %}
            {% endif %}
        {%- endfor -%}

        {% if forloop_idx > num_examples %}
        <a href="/{{language}}/3d-charts/" class="langindexlink">More 3D Charts &raquo;</a>
        {% endif %}
    </header>
    <section class="--grid">
        <ul class="--grid-list">

            {% assign forloop_idx = 0 %}

            {%- for page in languagelist -%}
                {% if page.display_as == "3d_charts" and page.layout != "langindex" and forloop_idx < num_examples  %}
                    {% assign forloop_idx = forloop_idx | plus:1 %}
                    {% include layouts/grid-item.html %}
                {% endif %}
            {%- endfor -%}

        </ul>
    </section>
</section>
{% endif %}

{% if multiple_axes %}
<section class="--tutorial-section" id="multiple-axes-subplots-and-insets">
    <header class="--section-header">
        <a href="#subplot-charts" name="subplot-charts" id="subplot-charts">Subplots</a>

        {% assign forloop_idx = 0 %}
        {%- for page in languagelist -%}
            {% if page.display_as == "multiple_axes" and page.layout != "langindex" %}
                {% assign forloop_idx = forloop_idx | plus:1 %}
            {% endif %}
        {%- endfor -%}

        {% if forloop_idx > num_examples %}
        <a href="/{{language}}/subplot-charts/" class="langindexlink">More Subplots &raquo;</a>
        {% endif %}
    </header>
    <section class="--grid">
        <ul class="--grid-list">

            {% assign forloop_idx = 0 %}

            {%- for page in languagelist -%}
                {% if page.display_as == "multiple_axes" and page.layout != "langindex" and forloop_idx < num_examples  %}
                    {% assign forloop_idx = forloop_idx | plus:1 %}
                    {% include layouts/grid-item.html %}
                {% endif %}
            {%- endfor -%}

        </ul>
    </section>
</section>
{% endif %}

{% if chart_events and page.language =="python" %}
<section class="--tutorial-section" id="chart-events">
    <header class="--section-header">
        <a href="#jupyter-widgets" id="jupyter-widgets">Jupyter Widgets Interaction</a>

        {% assign forloop_idx = 0 %}
        {%- for page in languagelist -%}
            {% if page.display_as == "chart_events" and page.layout != "langindex" %}
                {% assign forloop_idx = forloop_idx | plus:1 %}
            {% endif %}
        {%- endfor -%}

        {% if forloop_idx > num_examples %}
        <a href="/{{language}}/chart-events/" class="langindexlink">More Chart Events &raquo;</a>
        {% endif %}
    </header>
    <section class="--grid">
        <ul class="--grid-list">

            {% assign forloop_idx = 0 %}

            {%- for page in languagelist -%}
                {% if page.display_as == "chart_events" and page.layout != "langindex" and forloop_idx < num_examples  %}
                    {% assign forloop_idx = forloop_idx | plus:1 %}
                    {% include layouts/grid-item.html %}
                {% endif %}
            {%- endfor -%}

        </ul>
    </section>
</section>
{% endif %}

{% if chart_events and page.language =="r" %}
<section class="--tutorial-section" id="custom-interaction">
    <header class="--section-header">
        <a href="#custom-interaction">Custom Interaction With JavaScript</a>

        {% assign forloop_idx = 0 %}
        {%- for page in languagelist -%}
            {% if page.display_as == "chart_events" and page.layout != "langindex" %}
                {% assign forloop_idx = forloop_idx | plus:1 %}
            {% endif %}
        {%- endfor -%}

        {% if forloop_idx > num_examples %}
        <a href="/{{language}}/chart-events/" class="langindexlink">More Chart Events &raquo;</a>
        {% endif %}
    </header>
    <section class="--grid">
        <ul class="--grid-list">

            {% assign forloop_idx = 0 %}

            {%- for page in languagelist -%}
                {% if page.display_as == "chart_events" and page.layout != "langindex" and forloop_idx < num_examples  %}
                    {% assign forloop_idx = forloop_idx | plus:1 %}
                    {% include layouts/grid-item.html %}
                {% endif %}
            {%- endfor -%}

        </ul>
    </section>
</section>
{% endif %}

{% if chart_events and page.language == 'plotly_js' %}
<section class="--tutorial-section" id="custom-chart-events">
    <header class="--section-header">
        <a href="#custom-chart-events">Custom Chart Events</a>

        {% assign forloop_idx = 0 %}
        {%- for page in languagelist -%}
            {% if page.display_as == "chart_events" and page.layout != "langindex" %}
                {% assign forloop_idx = forloop_idx | plus:1 %}
            {% endif %}
        {%- endfor -%}

        {% if forloop_idx > num_examples %}
        <a href="/{{language}}/chart-events/" class="langindexlink">More Chart Events &raquo;</a>
        {% endif %}
    </header>
    <section class="--grid">
        <ul class="--grid-list">

            {% assign forloop_idx = 0 %}

            {%- for page in languagelist -%}
                {% if page.display_as == "chart_events" and page.layout != "langindex" and forloop_idx < num_examples  %}
                    {% assign forloop_idx = forloop_idx | plus:1 %}
                    {% include layouts/grid-item.html %}
                {% endif %}
            {%- endfor -%}

        </ul>
    </section>
</section>
{% endif %}

{% if transforms %}
<section class="--tutorial-section">
    <header class="--section-header">
        <a href="#transforms" name="transforms" id="transforms">Transforms</a>

        {% assign forloop_idx = 0 %}
        {%- for page in languagelist -%}
            {% if page.display_as == "transforms" and page.layout != "langindex" %}
                {% assign forloop_idx = forloop_idx | plus:1 %}
            {% endif %}
        {%- endfor -%}

        {% if forloop_idx > num_examples %}
        <a href="/{{language}}/transforms/" class="langindexlink">More Transforms &raquo;</a>
        {% endif %}
    </header>
    <section class="--grid">
        <ul class="--grid-list">

            {% assign forloop_idx = 0 %}

            {%- for page in languagelist -%}
                {% if page.display_as == "transforms" and page.layout != "langindex" and forloop_idx < num_examples  %}
                    {% assign forloop_idx = forloop_idx | plus:1 %}
                    {% include layouts/grid-item.html %}
                {% endif %}
            {%- endfor -%}

        </ul>
    </section>
</section>
{% endif %}

{% if controls %}
<section class="--tutorial-section" id="controls">
    <header class="--section-header">
        <a href="#controls">Add Custom Controls</a>

        {% assign forloop_idx = 0 %}
        {%- for page in languagelist -%}
            {% if page.display_as == "controls" and page.layout != "langindex" %}
                {% assign forloop_idx = forloop_idx | plus:1 %}
            {% endif %}
        {%- endfor -%}

        {% if forloop_idx > num_examples %}
        <a href="/{{language}}/controls/" class="langindexlink">More Controls &raquo;</a>
        {% endif %}
    </header>
    <section class="--grid">
        <ul class="--grid-list">

            {% assign forloop_idx = 0 %}

            {%- for page in languagelist -%}
                {% if page.display_as == "controls" and page.layout != "langindex" and forloop_idx < num_examples  %}
                    {% assign forloop_idx = forloop_idx | plus:1 %}
                    {% include layouts/grid-item.html %}
                {% endif %}
            {%- endfor -%}

        </ul>
    </section>
</section>
{% endif %}

{% if animations %}
<section class="--tutorial-section" id="animations">
    <header class="--section-header">
        <a href="#animations">Animations</a>

        {% assign forloop_idx = 0 %}
        {%- for page in languagelist -%}
            {% if page.display_as == "animations" and page.layout != "langindex" %}
                {% assign forloop_idx = forloop_idx | plus:1 %}
            {% endif %}
        {%- endfor -%}

        {% if forloop_idx > num_examples %}
        <a href="/{{language}}/animations/" class="langindexlink">More Animations &raquo;</a>
        {% endif %}
    </header>
    <section class="--grid">
        <ul class="--grid-list">

            {% assign forloop_idx = 0 %}

            {%- for page in languagelist -%}
                {% if page.display_as == "animations" and page.layout != "langindex" and forloop_idx < num_examples  %}
                    {% assign forloop_idx = forloop_idx | plus:1 %}
                    {% include layouts/grid-item.html %}
                {% endif %}
            {%- endfor -%}

        </ul>
    </section>
</section>
{% endif %}

{% if financial_analysis %}
<section class="--tutorial-section" id="financial-analysis">
    <header class="--section-header">
        <a href="#financial-analysis">Financial Analysis</a>

        {% assign forloop_idx = 0 %}
        {%- for page in languagelist -%}
            {% if page.display_as == "financial_analysis" and page.layout != "langindex" %}
                {% assign forloop_idx = forloop_idx | plus:1 %}
            {% endif %}
        {%- endfor -%}

        {% if forloop_idx > num_examples %}
        <a href="/{{language}}/financial-analysis/" class="langindexlink">More Financial Analysis &raquo;</a>
        {% endif %}
    </header>
    <section class="--grid">
        <ul class="--grid-list">

            {% assign forloop_idx = 0 %}

            {%- for page in languagelist -%}
                {% if page.display_as == "financial_analysis" and page.layout != "langindex" and forloop_idx < num_examples  %}
                    {% assign forloop_idx = forloop_idx | plus:1 %}
                    {% include layouts/grid-item.html %}
                {% endif %}
            {%- endfor -%}

        </ul>
    </section>
</section>
{% endif %}

{% if advanced_opt %}
<section class="--tutorial-section no-image" id="advanced-options">
    <header class="--section-header">
        <a href="#advanced-options">Advanced</a>
    </header>
    <section class="--grid">
        <ul class="--grid-list">

            {% assign forloop_idx = 0 %}

            {%- for page in languagelist -%}
                {% if page.display_as == "advanced_opt" and page.layout != "langindex" and forloop_idx < num_examples  %}
                    {% assign forloop_idx = forloop_idx | plus:1 %}
                    <li class="--grid-item">
                        <a href="{% if page.permalink contains 'http' %}{{page.permalink}}{% else %}/{{page.permalink}}{% endif %}">
                            <div class="--item-meta"><span>{{page.name}}</span></div>
                        </a>
                    </li>
                {% endif %}
            {%- endfor -%}

        </ul>
    </section>
</section>
{% endif %}

{% if style_options %}
<section class="--tutorial-section no-image" id="style-options">
    <header class="--section-header">
        <a href="#style-options">Style Options</a>
    </header>
    <section class="--grid">
        <ul class="--grid-list">

            {% assign forloop_idx = 0 %}

            {%- for page in languagelist -%}
                {% if page.display_as == "style_opt" and page.layout != "langindex" and forloop_idx < num_examples  %}
                    {% assign forloop_idx = forloop_idx | plus:1 %}
                    <li class="--grid-item">
                        <a href="{% if page.permalink contains 'http' %}{{page.permalink}}{% else %}/{{page.permalink}}{% endif %}">
                            <div class="--item-meta"><span>{{page.name}}</span></div>
                        </a>
                    </li>
                {% endif %}
            {%- endfor -%}

        </ul>
    </section>
</section>
{% endif %}

{% if layout_options %}
<section class="--tutorial-section no-image" id="layout-options">
    <header class="--section-header">
        <a href="#layout-options">Layout Options</a>
    </header>
    <section class="--grid">
        <ul class="--grid-list">

            {% assign forloop_idx = 0 %}

            {%- for page in languagelist -%}
                {% if page.display_as == "layout_opt" and page.layout != "langindex" and forloop_idx < num_examples  %}
                    {% assign forloop_idx = forloop_idx | plus:1 %}
                    <li class="--grid-item">
                        <a href="{% if page.permalink contains 'http' %}{{page.permalink}}{% else %}/{{page.permalink}}{% endif %}">
                            <div class="--item-meta"><span>{{page.name}}</span></div>
                        </a>
                    </li>
                {% endif %}
            {%- endfor -%}

        </ul>
    </section>
</section>
{% endif %}