side-bar.html

{% if page.url contains "/python/v3/ipython-notebooks/gallery" %}
{% assign ipython_notebooks_gallery = true %}
{% elsif page.url contains "dashboards" %}
{% assign dashboards = true %}
{% elsif page.url contains "python" %}
{% assign language = "python" %}
{% elsif page.url contains "javascript" %}
{% assign language = "plotly_js" %}
{% elsif page.url contains "ggplot2" %}
{% assign language = "ggplot2" %}
{% elsif page.url contains "matlab" %}
{% assign language = "matlab" %}
{% elsif page.url contains "julia" %}
{% assign language = "julia" %}
{% elsif page.url contains "nodejs" %}
{% assign language = "nodejs" %}
{% elsif page.url contains "r/" %}
{% assign language = "r" %}
{% elsif page.url contains "scala/" %}
{% assign language = "scala" %}
{% endif %}

{% assign display_as = page.display_as %}

{% assign pages_list = site.posts | where:"language", language %}

{%- for page in pages_list -%}
{% if page.display_as == "chart_type" or page.display_as == "basic" %}
{% assign basic = true %}
{% elsif page.display_as == "file_settings" %}
{% assign file_settings = true %}
{% elsif page.display_as == "statistical" %}
{% assign statistical = true %}
{% elsif page.display_as == "scientific" %}
{% assign scientific = true %}
{% elsif page.display_as == "maps" %}
{% assign maps = true %}
{% elsif page.display_as == "financial_analysis" or page.display_as == "financial" %}
{% assign financial = true %}
{% elsif page.display_as == "3d_charts" %}
{% assign 3d_charts = true %}
{% elsif page.display_as == "ai_ml" %}
{% assign ai_ml = true %}
{% elsif page.display_as == "bio" %}
{% assign bio = true %}
{% elsif page.display_as == "advanced_charts"%}
{% assign advanced_charts = true %}
{% elsif page.display_as == "multiple_axes" %}
{% assign multiple_axes = true %}
{% elsif page.display_as == "controls" %}
{% assign controls = true %}
{% elsif page.display_as == "animations" %}
{% assign animations = true %}
{% elsif page.display_as == "streaming" %}
{% assign streaming = true %}
{% elsif page.display_as == "chart_events" %}
{% assign chart_events = true %}
{% elsif page.display_as == "style_opt" %}
{% assign style_opt = true %}
{% elsif page.display_as == "layout_opt" %}
{% assign layout_opt = true %}
{% elsif page.display_as == "tutorial" %}
{% assign tutorial = true %}
{% elsif page.display_as == "get_request" %}
{% assign get_request = true %}
{% elsif page.display_as == "report_generation" %}
{% assign report_generation = true %}
{% elsif page.display_as == "databases" %}
{% assign databases = true %}
{% elsif page.display_as == "chart_studio" %}
{% assign chart_studio = true %}
{% elsif page.display_as == "advanced_opt" %}
{% assign advanced_opt = true %}

<!-- START OF GGPLOT CUSTOM LAYOUT -->
{% elsif page.display_as == "aesthetics" %}
{% assign aesthetics = true %}
{% elsif page.display_as == "geoms" %}
{% assign geoms = true %}
{% elsif page.display_as == "faceting" %}
{% assign faceting = true %}
{% elsif page.display_as == "other" %}
{% assign other = true %}
{% elsif page.display_as == "theme" %}
{% assign theme = true %}
<!-- END OF GGPLOT CUSTOM LAYOUT -->
{% endif %}
{%- endfor -%}

{% assign langue = page.language %}
{% if page.permalink contains 'javascript' %}
{% assign langue = 'javascript' %}
{% endif %}

<aside class="--sidebar-container">
    <div class="--sidebar-fixed reference" data-spy="affix" id="where">
        <div class="brand">
            <a href="/graphing-libraries/"><img src="/all_static/images/graphing_library.svg" style="height: 30px;"></a>
        </div>
        {% if page.permalink contains "javascript/" or page.permalink contains "python/" or page.permalink contains "r/" or page.permalink contains "julia/" or page.permalink contains "ggplot2/" %}
        <button id="modal-button" type="button" data-toggle="modal" data-target="#myModal">
            <input id="modal-input" style="border-radius: 5px; width: 100%;" type="text" placeholder="   Search..."
                readonly />
        </button>
        {% endif %}

        {%if page.page_type == "reference" %}

        {% include layouts/reference-side-nav.html %}

        {% else %}

        <details style="color: white;margin-top: 20px;" {% if page.layout == "langindex" %} open {%endif %}>
            <summary>Quick Reference</summary>
            <nav class="--sidebar-body watch" id="where">
                <ul class="--sidebar-list" style="margin-left: 15px;">
                    <!-- Getting Started -->
                    <li class="--sidebar-item">
                        <a href="/{{ langue }}/getting-started" class="js-splash--navigation-item">Getting Started</a>
                    </li>

                    {% if page.language == "r" or page.language == "python" or page.language == "plotly_js" or page.language == "ggplot2" or page.language == "matlab"%}
                    <li class="--sidebar-item">
                        <a href="/{{ langue }}/is-plotly-free" class="js-splash--navigation-item">Is Plotly Free?</a>
                    </li>
                    {% endif %}

                    <!-- Reference Pages -->
                    {% if page.language == "plotly_js" or page.language == "r" or page.language == "python" or
                    page.language == "matlab" or page.language == "julia" %}
                    <li class="--sidebar-item">
                        <a href="/{{ langue }}/reference/index/" class="js-splash--navigation-item">Figure Reference</a>
                    </li>
                    {% endif %}

                    <!-- Python Specific -->

                    {% if page.language == "python" %}
                    <li class="--sidebar-item">
                        <a href="/python-api-reference" class="js-splash--navigation-item">API Reference</a>
                    </li>
                    <li class="--sidebar-item">
                        <a href="https://dash.plotly.com/tutorial" class="js-splash--navigation-item">Dash</a>
                    </li>
                    {% endif %}

                    <!-- JS Specific -->
                    {% if page.language == "plotly_js" %}
                    <li class="--sidebar-item">
                        <a href="/javascript/plotlyjs-function-reference/" class="js-splash--navigation-item">Function
                            Reference</a>
                    </li>
                    <li class="--sidebar-item">
                        <a href="/javascript/plotlyjs-events" class="js-splash--navigation-item">Event Reference</a>
                    </li>
                    <li class="--sidebar-item">
                        <a href="/javascript/configuration-options/" class="js-splash--navigation-item">Configuration
                            Options</a>
                    </li>
                    {% endif %}

                    <!-- R Specific -->
                    {% if page.language == "r"%}
                    <li class="--sidebar-item">
                        <a href="/ggplot2/" class="js-splash--navigation-item">ggplot2 integration</a>
                    </li>
                    <li class="--sidebar-item">
                        <a href="https://plotly.com/dash" class="js-splash--navigation-item">Dash for R</a>
                    </li>
                    {% endif %}

                    <!-- Python/v3 Index Page Specific -->
                    {% if page.permalink == "/python/v3/" %}
                    <li class="--sidebar-item">
                        <a href="/ipython-notebooks/" class="js-splash--navigation-item">IPython Notebooks</a>
                    </li>
                    {% endif %}

                    <!-- User Guides -->
                    {% if page.language == "matlab" or page.language == "scala" %}
                    <li class="--sidebar-item">
                        <a href="/{{ page.language }}/user-guide/" class="js-splash--navigation-item">User Guide</a>
                    </li>
                    {% endif %}

                    <!-- Github Links -->

                    {% if page.language == 'python' %}
                    <li class="--sidebar-item">
                        <a target="_blank" href="https://github.com/plotly/plotly.py"
                            class="js-splash--navigation-item">GitHub</a>
                    </li>

                    {% elsif page.language == 'matlab' %}
                    <li class="--sidebar-item">
                        <a target="_blank" href="https://github.com/plotly/plotly-graphing-library-for-matlab"
                            class="js-splash--navigation-item">GitHub</a>
                    </li>

                    {% elsif page.language == 'julia' %}
                    <li class="--sidebar-item">
                        <a target="_blank" href="https://github.com/JuliaPlots/PlotlyJS.jl"
                            class="js-splash--navigation-item">GitHub</a>
                    </li>

                    {% elsif page.language == 'nodejs' %}
                    <li class="--sidebar-item">
                        <a target="_blank" href="https://github.com/plotly/plotly-nodejs"
                            class="js-splash--navigation-item">GitHub</a>
                    </li>

                    {% elsif page.language == 'r' or page.language == 'ggplot2' %}
                    <li class="--sidebar-item">
                        <a target="_blank" href="https://github.com/plotly/plotly.R"
                            class="js-splash--navigation-item">GitHub</a>
                    </li>

                    {% elsif page.language == 'plotly_js' %}
                    <li class="--sidebar-item">
                        <a target="_blank" href="https://github.com/plotly/plotly.js/"
                            class="js-splash--navigation-item">GitHub</a>
                    </li>

                    {% elsif page.language == 'fsharp' %}
                    <li class="--sidebar-item">
                        <a target="_blank" href="https://github.com/plotly/plotly.net"
                            class="js-splash--navigation-item">GitHub</a>
                    </li>

                    {% elsif page.language == 'csharp' %}
                    <li class="--sidebar-item">
                        <a target="_blank" href="https://github.com/plotly/plotly.net"
                            class="js-splash--navigation-item">GitHub</a>
                    </li>

                    {% else %}
                    <li class="--sidebar-item">
                        <a target="_blank" href="https://github.com/plotly/"
                            class="js-splash--navigation-item">GitHub</a>
                    </li>

                    {% endif %}
                    <li class="--sidebar-item">
                        <a target="_blank" href="http://community.plotly.com/"
                            class="js-splash--navigation-item">community.plotly.com</a>
                    </li>

                </ul>
            </nav>
        </details>

        {% if page.layout == "langindex" %}

        <!-- Examples start -->
        <details style="color: white;margin-top: 20px;" open>
            <summary>Examples</summary>
            <nav class="--sidebar-body watch" id="where">
                <ul class="--sidebar-list" style="margin-left: 15px;">
                    {% if file_settings == true %}
                    <li class="--sidebar-item">
                        <a href="/{{langue}}/plotly-fundamentals/" class="js-splash--navigation-item">Fundamentals</a>
                    </li>
                    {% endif %}

                    {% if basic == true %}
                    <li class="--sidebar-item">
                        <a href="/{{langue}}/basic-charts/" class="js-splash--navigation-item">Basic Charts</a>
                    </li>
                    {% endif %}

                    {% if statistical == true %}
                    <li class="--sidebar-item">
                        <a href="/{{langue}}/statistical-charts/" class="js-splash--navigation-item">Statistical
                            Charts</a>
                    </li>
                    {% endif %}

                    {% if scientific == true %}
                    <li class="--sidebar-item">
                        <a href="/{{langue}}/scientific-charts/" class="js-splash--navigation-item">Scientific
                            Charts</a>
                    </li>
                    {% endif %}

                    {% if financial == true %}
                    <li class="--sidebar-item">
                        <a href="/{{langue}}/financial-charts/" class="js-splash--navigation-item">Financial Charts</a>
                    </li>
                    {% endif %}

                    {% if maps == true %}
                    <li class="--sidebar-item">
                        <a href="/{{langue}}/maps/" class="js-splash--navigation-item">Maps</a>
                    </li>
                    {% endif %}

                    {% if ai_ml == true %}
                    <li class="--sidebar-item">
                        <a href="/{{langue}}/ai-ml/" class="js-splash--navigation-item">AI and ML</a>
                    </li>
                    {% endif %}

                    {% if bio == true %}
                    <li class="--sidebar-item">
                        <a href="/{{langue}}/bio/" class="js-splash--navigation-item">Visualizing Biological Data</a>
                    </li>
                    {% endif %}

                    {% if 3d_charts == true %}
                    <li class="--sidebar-item">
                        <a href="/{{langue}}/3d-charts/" class="js-splash--navigation-item">3D Charts</a>
                    </li>
                    {% endif %}

                    {% if multiple_axes == true %}
                    <li class="--sidebar-item">
                        <a href="/{{langue}}/subplot-charts/" class="js-splash--navigation-item">Subplots</a>
                    </li>
                    {% endif %}

                    {% if language == "plotly_js"%}
                    <li class="--sidebar-item">
                        <a href="/{{langue}}/#chart-events" class="js-splash--navigation-item">Chart Events</a>
                    </li>
                    {% endif %}

                    {% if animations == true %}
                    <li class="--sidebar-item">
                        <a href="/{{langue}}/#animations" class="js-splash--navigation-item">Animations</a>
                    </li>
                    {% endif %}

                    {% if advanced_opt == true %}
                    <li class="--sidebar-item">
                        <a href="/{{langue}}/#advanced-options" class="js-splash--navigation-item">Advanced</a>
                    </li>
                    {% endif %}

                    {% if databases == true %}
                    <li class="--sidebar-item">
                        <a href="/{{langue}}/#databases" class="js-splash--navigation-item">Connecting to Databases</a>
                    </li>
                    {% endif %}

                    {% if report_generation == true %}
                    <li class="--sidebar-item">
                        <a href="/{{langue}}/#report-generation" class="js-splash--navigation-item">Report
                            Generation</a>
                    </li>
                    {% endif %}

                    {% if style_opt == true %}
                    <li class="--sidebar-item">
                        <a href="/{{langue}}/#style-options" class="js-splash--navigation-item">Style Options</a>
                    </li>
                    {% endif %}

                    {% if layout_opt == true %}
                    <li class="--sidebar-item">
                        <a href="/{{langue}}/#layout-options" class="js-splash--navigation-item">Layout Options</a>
                    </li>
                    {% endif %}

                    {% if tutorial == true %}
                    <li class="--sidebar-item">
                        <a href="/{{langue}}/#tutorial" class="js-splash--navigation-item">Tutorial</a>
                    </li>
                    {% endif %}

                    {% if get_request == true %}
                    <li class="--sidebar-item">
                        <a href="/{{langue}}/#static-image-export" class="js-splash--navigation-item">Image Export &amp;
                            Retrieving Plots</a>
                    </li>
                    {% endif %}


                    <!-- START OF GGPLOT CUSTOM LAYOUT -->
                    {% if aesthetics == true %}
                    <li class="--sidebar-item">
                        <a href="#aes" class="js-splash--navigation-item">Aesthetics</a>
                    </li>
                    {% endif %}

                    {% if geoms == true %}
                    <li class="--sidebar-item">
                        <a href="#geoms" class="js-splash--navigation-item">Geoms</a>
                    </li>
                    {% endif %}

                    {% if faceting == true %}
                    <li class="--sidebar-item">
                        <a href="#faceting" class="js-splash--navigation-item">Faceting</a>
                    </li>
                    {% endif %}

                    {% if other == true %}
                    <li class="--sidebar-item">
                        <a href="#other" class="js-splash--navigation-item">Other</a>
                    </li>
                    {% endif %}

                    {% if theme == true %}
                    <li class="--sidebar-item">
                        <a href="#theme" class="js-splash--navigation-item">Theme</a>
                    </li>
                    {% endif %}
                    <!-- END OF GGPLOT CUSTOM LAYOUT -->

                    {% if general_examples == true %}
                    <li class="--sidebar-item">
                        <a href="#general-examples" class="js-splash--navigation-item">General Examples</a>
                    </li>
                    {% endif %}

                    {% if real_dataset == true %}
                    <li class="--sidebar-item">
                        <a href="#real_dataset" class="js-splash--navigation-item">Examples based on real world
                            dataset</a>
                    </li>
                    {% endif %}

                    {% if biclustering == true %}
                    <li class="--sidebar-item">
                        <a href="#biclustering" class="js-splash--navigation-item">Biclustering</a>
                    </li>
                    {% endif %}

                    {% if calibration == true %}
                    <li class="--sidebar-item">
                        <a href="#calibration" class="js-splash--navigation-item">Calibration</a>
                    </li>
                    {% endif %}

                    {% if classification == true %}
                    <li class="--sidebar-item">
                        <a href="#classification" class="js-splash--navigation-item">Classification</a>
                    </li>
                    {% endif %}

                    {% if clustering == true %}
                    <li class="--sidebar-item">
                        <a href="#clustering" class="js-splash--navigation-item">Clustering</a>
                    </li>
                    {% endif %}

                    {% if covariance_estimation == true %}
                    <li class="--sidebar-item">
                        <a href="#covariance_estimation" class="js-splash--navigation-item">Covariance Estimation</a>
                    </li>
                    {% endif %}

                    {% if cross_decomposition == true %}
                    <li class="--sidebar-item">
                        <a href="#cross_decomposition " class="js-splash--navigation-item">Cross Decomposition</a>
                    </li>
                    {% endif %}

                    {% if dataset == true %}
                    <li class="--sidebar-item">
                        <a href="#dataset " class="js-splash--navigation-item">Dataset Examples</a>
                    </li>
                    {% endif %}

                    {% if decomposition == true %}
                    <li class="--sidebar-item">
                        <a href="#decomposition " class="js-splash--navigation-item">Decomposition</a>
                    </li>
                    {% endif %}


                    {% if ensemble_methods == true %}
                    <li class="--sidebar-item">
                        <a href="#ensemble_methods " class="js-splash--navigation-item">Ensemble Methods</a>
                    </li>
                    {% endif %}

                    {% if tutorial_exercises == true %}
                    <li class="--sidebar-item">
                        <a href="#tutorial_exercises " class="js-splash--navigation-item">Tutorial Exercises</a>
                    </li>
                    {% endif %}

                    {% if feature_selection == true %}
                    <li class="--sidebar-item">
                        <a href="#feature_selection " class="js-splash--navigation-item">Feature Selection</a>
                    </li>
                    {% endif %}

                    {% if gaussian-process == true %}
                    <li class="--sidebar-item">
                        <a href="#gaussian-process " class="js-splash--navigation-item">Gaussian Process for Machine
                            Learning</a>
                    </li>
                    {% endif %}

                    {% if linear_models == true %}
                    <li class="--sidebar-item">
                        <a href="#linear_models " class="js-splash--navigation-item">Generalized Linear Models</a>
                    </li>
                    {% endif %}

                    {% if manifold_learning == true %}
                    <li class="--sidebar-item">
                        <a href="#manifold_learning " class="js-splash--navigation-item">Manifold Learning</a>
                    </li>
                    {% endif %}

                    {% if gaussian_mixture == true %}
                    <li class="--sidebar-item">
                        <a href="#gaussian_mixture" class="js-splash--navigation-item">Gaussian Mixture Models</a>
                    </li>
                    {% endif %}

                    {% if model_selection == true %}
                    <li class="--sidebar-item">
                        <a href="#model_selection" class="js-splash--navigation-item">Model Selection</a>
                    </li>
                    {% endif %}

                    {% if nearest_neighbors == true %}
                    <li class="--sidebar-item">
                        <a href="#nearest_neighbors " class="js-splash--navigation-item">Nearest Neighbors</a>
                    </li>
                    {% endif %}

                    {% if neural_networks == true %}
                    <li class="--sidebar-item">
                        <a href="#neural_networks " class="js-splash--navigation-item">Neural Networks</a>
                    </li>
                    {% endif %}

                    {% if preprocessing == true %}
                    <li class="--sidebar-item">
                        <a href="#preprocessing " class="js-splash--navigation-item">Preprocessing</a>
                    </li>
                    {% endif %}

                    {% if semi_supervised == true %}
                    <li class="--sidebar-item">
                        <a href="#semi_supervised " class="js-splash--navigation-item">Semi Supervised
                            Classification</a>
                    </li>
                    {% endif %}

                    {% if vector_machines == true %}
                    <li class="--sidebar-item">
                        <a href="#vector_machines" class="js-splash--navigation-item">Support Vector Machines</a>
                    </li>
                    {% endif %}

                    {% if decision_trees == true %}
                    <li class="--sidebar-item">
                        <a href="#decision_trees" class="js-splash--navigation-item">Decision Trees</a>
                    </li>
                    {% endif %}

                    {% if text_documents == true %}
                    <li class="--sidebar-item">
                        <a href="#text_documents" class="js-splash--navigation-item">Working with Text Documents</a>
                    </li>
                    {% endif %}
                    {% if dashboards %}
                    <!--override for dashboards index page -->
                    <li class="--sidebar-item">
                        <a href="#industry" class="js-splash--navigation-item">By Industry</a>
                    </li>
                    <li class="--sidebar-item">
                        <a href="#language" class="js-splash--navigation-item">By Data Science Language</a>
                    </li>
                    {% endif %}

                    {% if ipython_notebooks_gallery %}
                    <!--override for IPython Gallery  -->
                    <li class="--sidebar-item">
                        <a href="#notebook-basics" class="js-splash--navigation-item">Plotly Basics</a>
                    </li>
                    <li class="--sidebar-item">
                        <a href="#science-and-engineering" class="js-splash--navigation-item">Science and
                            Engineering</a>
                    </li>
                    <li class="--sidebar-item">
                        <a href="#civic-data" class="js-splash--navigation-item">Civic Data</a>
                    </li>
                    <li class="--sidebar-item">
                        <a href="#finance" class="js-splash--navigation-item">Finance</a>
                    </li>
                    {% endif %}
                </ul>
            </nav>
        </details>
        {% else %}

        <details style="color: white;margin-top: 20px;" open>
            <summary>On This Page</summary>
            <nav class="--sidebar-body watch" id="where">
            <ul class="--sidebar-list" id="nav_header_insertion_list"></ul>
            </nav>
        </details>

        {% endif %}
        {% endif %}
    </div>

    {% include layouts/webinar_plug.html %}

</aside>