.. DO NOT EDIT.
.. THIS FILE WAS AUTOMATICALLY GENERATED BY SPHINX-GALLERY.
.. TO MAKE CHANGES, EDIT THE SOURCE PYTHON FILE:
.. "gallery/ms_bokeh/plot_peakmap_marginals_ms_bokeh.py"
.. LINE NUMBERS ARE GIVEN BELOW.

.. only:: html

    .. note::
        :class: sphx-glr-download-link-note

        :ref:`Go to the end <sphx_glr_download_gallery_ms_bokeh_plot_peakmap_marginals_ms_bokeh.py>`
        to download the full example code. or to run this example in your browser via Binder

.. rst-class:: sphx-glr-example-title

.. _sphx_glr_gallery_ms_bokeh_plot_peakmap_marginals_ms_bokeh.py:


PeakMap ms_bokeh
================

This example plots a peakmap with marginals by setting `add_marginals=True`
A chromatogram is shown along the x-axis and a spectrum is shown along the y-axis.

.. GENERATED FROM PYTHON SOURCE LINES 8-29


.. bokeh-plot::
    :source-position: none
    
    from bokeh.plotting import show
    
    import pandas as pd
    import requests
    from io import StringIO
    
    pd.options.plotting.backend = "ms_bokeh"
    
    # download the file for example plotting
    url = "https://github.com/OpenMS/pyopenms_viz/releases/download/v0.1.5/ionMobilityTestFeatureDf.tsv"
    response = requests.get(url)
    response.raise_for_status()  # Check for any HTTP errors
    df = pd.read_csv(StringIO(response.text), sep="\t")
    
    df.plot(
        kind="peakmap",
        x="rt",
        y="mz",
        z="int",
        add_marginals=True,
        aggregate_duplicates=True,
    )
    

.. rst-class:: sphx-glr-script-out

 .. code-block:: none

    /home/runner/work/pyopenms_viz/pyopenms_viz/pyopenms_viz/_bokeh/core.py:594: UserWarning:


    You are attempting to set `plot.legend.orientation` on a plot that has zero legends added, this will have no effect.

    Before legend properties can be set, you must add a Legend explicitly, or call a glyph method with a legend parameter set.




.. raw:: html

    <div class="output_subarea output_html rendered_html output_result">
    <div style="display: table;"><div style="display: table-row;"><div style="display: table-cell;"><b title="bokeh.models.plots.GridPlot">GridPlot</b>(</div><div style="display: table-cell;">id&nbsp;=&nbsp;'p1226', <span id="p1240" style="cursor: pointer;">&hellip;)</span></div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">align&nbsp;=&nbsp;'auto',</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">aspect_ratio&nbsp;=&nbsp;None,</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">children&nbsp;=&nbsp;[(figure(id='p1115', ...), 0, 1), (figure(id='p1162', ...), 1, 0), (figure(id='p1066', ...), 1, 1)],</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">cols&nbsp;=&nbsp;None,</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">context_menu&nbsp;=&nbsp;None,</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">css_classes&nbsp;=&nbsp;[],</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">css_variables&nbsp;=&nbsp;{},</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">disabled&nbsp;=&nbsp;False,</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">elements&nbsp;=&nbsp;[],</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">flow_mode&nbsp;=&nbsp;'block',</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">height&nbsp;=&nbsp;None,</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">height_policy&nbsp;=&nbsp;'auto',</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">js_event_callbacks&nbsp;=&nbsp;{},</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">js_property_callbacks&nbsp;=&nbsp;{},</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">margin&nbsp;=&nbsp;None,</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">max_height&nbsp;=&nbsp;None,</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">max_width&nbsp;=&nbsp;None,</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">min_height&nbsp;=&nbsp;None,</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">min_width&nbsp;=&nbsp;None,</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">name&nbsp;=&nbsp;None,</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">resizable&nbsp;=&nbsp;False,</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">rows&nbsp;=&nbsp;None,</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">sizing_mode&nbsp;=&nbsp;None,</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">spacing&nbsp;=&nbsp;0,</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">styles&nbsp;=&nbsp;{},</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">stylesheets&nbsp;=&nbsp;[],</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">subscribed_events&nbsp;=&nbsp;PropertyValueSet(),</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">syncable&nbsp;=&nbsp;True,</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">tags&nbsp;=&nbsp;[],</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">toolbar&nbsp;=&nbsp;Toolbar(id='p1225', ...),</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">toolbar_location&nbsp;=&nbsp;'above',</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">visible&nbsp;=&nbsp;True,</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">width&nbsp;=&nbsp;None,</div></div><div class="p1239" style="display: none;"><div style="display: table-cell;"></div><div style="display: table-cell;">width_policy&nbsp;=&nbsp;'auto')</div></div></div>
    <script>
    (function() {
      let expanded = false;
      const ellipsis = document.getElementById("p1240");
      ellipsis.addEventListener("click", function() {
        const rows = document.getElementsByClassName("p1239");
        for (let i = 0; i < rows.length; i++) {
          const el = rows[i];
          el.style.display = expanded ? "none" : "table-row";
        }
        ellipsis.innerHTML = expanded ? "&hellip;)" : "&lsaquo;&lsaquo;&lsaquo;";
        expanded = !expanded;
      });
    })();
    </script>

    </div>
    <br />
    <br />



|

.. code-block:: Python


    import pandas as pd
    import requests
    from io import StringIO

    pd.options.plotting.backend = "ms_bokeh"

    # download the file for example plotting
    url = "https://github.com/OpenMS/pyopenms_viz/releases/download/v0.1.5/ionMobilityTestFeatureDf.tsv"
    response = requests.get(url)
    response.raise_for_status()  # Check for any HTTP errors
    df = pd.read_csv(StringIO(response.text), sep="\t")

    df.plot(
        kind="peakmap",
        x="rt",
        y="mz",
        z="int",
        add_marginals=True,
        aggregate_duplicates=True,
    )


.. rst-class:: sphx-glr-timing

   **Total running time of the script:** (0 minutes 0.266 seconds)


.. _sphx_glr_download_gallery_ms_bokeh_plot_peakmap_marginals_ms_bokeh.py:

.. only:: html

  .. container:: sphx-glr-footer sphx-glr-footer-example

    .. container:: binder-badge

      .. image:: images/binder_badge_logo.svg
        :target: https://notebooks.gesis.org/binder/v2/gh/OpenMS/pyopenms_viz/gh_pages?filepath=notebooks/gallery/ms_bokeh/plot_peakmap_marginals_ms_bokeh.ipynb
        :alt: Launch binder
        :width: 150 px

    .. container:: sphx-glr-download sphx-glr-download-jupyter

      :download:`Download Jupyter notebook: plot_peakmap_marginals_ms_bokeh.ipynb <plot_peakmap_marginals_ms_bokeh.ipynb>`

    .. container:: sphx-glr-download sphx-glr-download-python

      :download:`Download Python source code: plot_peakmap_marginals_ms_bokeh.py <plot_peakmap_marginals_ms_bokeh.py>`

    .. container:: sphx-glr-download sphx-glr-download-zip

      :download:`Download zipped: plot_peakmap_marginals_ms_bokeh.zip <plot_peakmap_marginals_ms_bokeh.zip>`


.. only:: html

 .. rst-class:: sphx-glr-signature

    `Gallery generated by Sphinx-Gallery <https://sphinx-gallery.github.io>`_