Client - do not display elevation chart when no elevation
This commit is contained in:
		| @@ -34,7 +34,7 @@ | |||||||
|             {{ $t('workouts.NO_DATA_CLEANING') }} |             {{ $t('workouts.NO_DATA_CLEANING') }} | ||||||
|           </div> |           </div> | ||||||
|  |  | ||||||
|           <div class="elevation-start"> |           <div class="elevation-start" v-if="hasElevation"> | ||||||
|             <label> |             <label> | ||||||
|               <input |               <input | ||||||
|                 type="checkbox" |                 type="checkbox" | ||||||
| @@ -82,6 +82,9 @@ | |||||||
|   const datasets: ComputedRef<IWorkoutChartData> = computed(() => |   const datasets: ComputedRef<IWorkoutChartData> = computed(() => | ||||||
|     getDatasets(props.workoutData.chartData, t, props.authUser.imperial_units) |     getDatasets(props.workoutData.chartData, t, props.authUser.imperial_units) | ||||||
|   ) |   ) | ||||||
|  |   const hasElevation = computed( | ||||||
|  |     () => datasets.value && datasets.value.datasets.elevation.data.length > 0 | ||||||
|  |   ) | ||||||
|   const fromKmUnit = getUnitTo('km') |   const fromKmUnit = getUnitTo('km') | ||||||
|   const fromMUnit = getUnitTo('m') |   const fromMUnit = getUnitTo('m') | ||||||
|   const chartData: ComputedRef<ChartData<'line'>> = computed(() => ({ |   const chartData: ComputedRef<ChartData<'line'>> = computed(() => ({ | ||||||
| @@ -141,6 +144,7 @@ | |||||||
|       }, |       }, | ||||||
|       yElevation: { |       yElevation: { | ||||||
|         beginAtZero: beginElevationAtZero.value, |         beginAtZero: beginElevationAtZero.value, | ||||||
|  |         display: hasElevation.value, | ||||||
|         grid: { |         grid: { | ||||||
|           drawOnChartArea: false, |           drawOnChartArea: false, | ||||||
|         }, |         }, | ||||||
| @@ -194,6 +198,7 @@ | |||||||
|       }, |       }, | ||||||
|       htmlLegend: { |       htmlLegend: { | ||||||
|         containerID: 'chart-legend', |         containerID: 'chart-legend', | ||||||
|  |         displayElevation: hasElevation.value, | ||||||
|       }, |       }, | ||||||
|     }, |     }, | ||||||
|   })) |   })) | ||||||
|   | |||||||
| @@ -30,6 +30,12 @@ export const htmlLegendPlugin = { | |||||||
|       : [] |       : [] | ||||||
|  |  | ||||||
|     legendItems.forEach((item: LegendItem) => { |     legendItems.forEach((item: LegendItem) => { | ||||||
|  |       if ( | ||||||
|  |         !chart.config.options?.scales?.yElevation?.display && | ||||||
|  |         item.datasetIndex === 1 // elevation | ||||||
|  |       ) { | ||||||
|  |         return | ||||||
|  |       } | ||||||
|       const li = document.createElement('li') |       const li = document.createElement('li') | ||||||
|       li.onclick = () => { |       li.onclick = () => { | ||||||
|         if (item.datasetIndex !== undefined) { |         if (item.datasetIndex !== undefined) { | ||||||
|   | |||||||
| @@ -143,7 +143,7 @@ export type TWorkoutsPayload = TPaginationPayload & { | |||||||
| export interface IWorkoutApiChartData { | export interface IWorkoutApiChartData { | ||||||
|   distance: number |   distance: number | ||||||
|   duration: number |   duration: number | ||||||
|   elevation: number |   elevation?: number | ||||||
|   latitude: number |   latitude: number | ||||||
|   longitude: number |   longitude: number | ||||||
|   speed: number |   speed: number | ||||||
|   | |||||||
| @@ -43,9 +43,11 @@ export const getDatasets = ( | |||||||
|     datasets.speed.data.push( |     datasets.speed.data.push( | ||||||
|       convertStatsDistance('km', data.speed, useImperialUnits) |       convertStatsDistance('km', data.speed, useImperialUnits) | ||||||
|     ) |     ) | ||||||
|  |     if (data.elevation !== undefined) { | ||||||
|       datasets.elevation.data.push( |       datasets.elevation.data.push( | ||||||
|         convertStatsDistance('m', data.elevation, useImperialUnits) |         convertStatsDistance('m', data.elevation, useImperialUnits) | ||||||
|       ) |       ) | ||||||
|  |     } | ||||||
|     coordinates.push({ latitude: data.latitude, longitude: data.longitude }) |     coordinates.push({ latitude: data.latitude, longitude: data.longitude }) | ||||||
|   }) |   }) | ||||||
|  |  | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user