gpx.studio/website/src/lib/docs/vi/files-and-stats.mdx

---
title: Files and statistics
---

<script lang="ts">
    import { ChartNoAxesColumn } from '@lucide/svelte';
    import DocsNote from '$lib/components/docs/DocsNote.svelte';
    import ElevationProfile from '$lib/components/elevation-profile/ElevationProfile.svelte';
    import GPXStatistics from '$lib/components/GPXStatistics.svelte';
    import { exampleStatistics } from '$lib/data/example';
    import { writable } from 'svelte/store';

    let statistics = writable(exampleStatistics);
    let slicedStatistics = writable(undefined);
    let hoveredPoint = writable(null);
    let additionalDatasets = writable(['speed', 'atemp']);
    let elevationFill = writable(undefined);
</script>

# { title }

## File list

Once you have [opened](./menu/file) files, they will be shown as tabs in the file list located at the bottom of the map.
You can reorder them by dragging and dropping the tabs.
And when many files are open, you can scroll through the list of tabs to navigate between them.

<DocsNote>

When using a mouse, you need to hold <kbd>Shift</kbd> to scroll horizontally.

</DocsNote>

### File selection

By clicking on a tab, you can switch between the files to inspect their statistics, and apply [edit actions](./menu/edit) and [tools](./toolbar) to them.
By holding the <kbd>Ctrl/Cmd</kbd> key, you can add files to the selection or remove them, and by holding <kbd>Shift</kbd>, you can select a range of files.
Most of the [edit actions](./menu/edit) and [tools](./toolbar) can be applied to multiple files at once.

<DocsNote>

You can also navigate through the files using the arrow keys on your keyboard, and use <kbd>Shift</kbd> to add files to the selection.

</DocsNote>

### Edit actions

By right-clicking on a file tab, you can access the same actions as in the [edit menu](./menu/edit).

### Tree layout

As mentioned in the [view options section](./menu/view), you can switch to a tree layout for the files list.
This layout is ideal for managing a large number of open files, as it organizes them into a vertical list on the right side of the map.
In addition, the file tree view enables you to inspect the [tracks, segments, and points of interest](./gpx) contained inside the files through collapsible sections.

You can also apply [edit actions](./menu/edit) and [tools](./toolbar) to internal file items.
Furthermore, you can drag and drop the inner items to reorder them, or move them in the hierarchy or even to another file.

<DocsNote>

The size of the file list can be adjusted by dragging the separator between the map and the file list.

</DocsNote>

## Elevation profile and statistics

At the bottom of the interface, you can find the elevation profile and statistics for the current selection.

<DocsNote>

The size of the elevation profile can be adjusted by dragging the separator between the map and the elevation profile.

</DocsNote>

### Interactive statistics

When hovering over the elevation profile, a tooltip will show statistics at the cursor position.

To get the statistics for a specific section of the elevation profile, you can drag a selection rectangle on the profile.
Click on the profile to reset the selection.

You can also use the mouse wheel to zoom in and out on the elevation profile, and move left and right by dragging the profile while holding the <kbd>Shift</kbd> key.

<div class="h-48 w-full">
    <ElevationProfile
        {statistics}
        {slicedStatistics}
        {hoveredPoint}
        {additionalDatasets}
        {elevationFill}
    />
</div>
<div class="flex flex-col items-center w-full">
    <GPXStatistics
        {statistics}
        {slicedStatistics}
        orientation={'horizontal'}
    />
</div>

### Additional data

Using the <kbd><ChartNoAxesColumn size="16" class="inline-block" style="margin-bottom: 2px"/></kbd> button at the bottom-right of the elevation profile, you can optionally color the elevation profile by:

- **slope** information computed from the elevation data, or
- **surface** or **category** data coming from <a href="https://www.openstreetmap.org/" target="_blank">OpenStreetMap</a>'s <a href="https://wiki.openstreetmap.org/wiki/Key:surface" target="_blank">surface</a> and <a href="https://wiki.openstreetmap.org/wiki/Key:highway" target="_blank">highway</a> tags.
  This is only available for files created with **gpx.studio**.

If your selection includes it, you can also visualize: **speed**, **heart rate**, **cadence**, **temperature** and **power** data on the elevation profile.