diff --git a/src/routes/en/docs/air-quality-api/+page.svelte b/src/routes/en/docs/air-quality-api/+page.svelte
index 25c09fce..b9853ad9 100644
--- a/src/routes/en/docs/air-quality-api/+page.svelte
+++ b/src/routes/en/docs/air-quality-api/+page.svelte
@@ -8,6 +8,7 @@
 	import AccordionItem from '$lib/Elements/AccordionItem.svelte';
 	import SveltyPicker from 'svelty-picker';
 	import { slide } from 'svelte/transition';
+	import { PlusLg, Trash } from 'svelte-bootstrap-icons';
 
 	const defaultParameter = {
 		hourly: [],
@@ -20,8 +21,8 @@
 	};
 
 	const params = urlHashStore({
-		latitude: 52.52,
-		longitude: 13.41,
+		latitude: [52.52],
+		longitude: [13.41],
 		...defaultParameter,
 		hourly: ['pm10', 'pm2_5']
 	});
@@ -82,9 +83,19 @@
 		]
 	];
 
-	function locationCallback(event: CustomEvent<GeoLocation>) {
-		$params.latitude = Number(event.detail.latitude.toFixed(4));
-		$params.longitude = Number(event.detail.longitude.toFixed(4));
+	function locationCallback(event: CustomEvent<GeoLocation>, index: number) {
+		const latitude = Number(event.detail.latitude.toFixed(4));
+		const longitude = Number(event.detail.longitude.toFixed(4));
+		$params.latitude = $params.latitude.toSpliced(index, 1, latitude);
+		$params.longitude = $params.longitude.toSpliced(index, 1, longitude);
+	}
+	function addLocation() {
+		$params.latitude = [...$params.latitude, NaN];
+		$params.longitude = [...$params.longitude, NaN];
+	}
+	function removeLocation(index: number) {
+		$params.latitude = $params.latitude.toSpliced(index, 1);
+		$params.longitude = $params.longitude.toSpliced(index, 1);
 	}
 </script>
 
@@ -100,39 +111,60 @@
 <form method="get" action="https://air-quality-api.open-meteo.com/v1/air-quality">
 	<div class="row">
 		<h2>Select Coordinates or City</h2>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="latitude"
-					id="latitude"
-					step="0.000001"
-					min="-90"
-					max="90"
-					bind:value={$params.latitude}
-				/>
-				<label for="latitude">Latitude</label>
+		{#each $params.latitude as _, index}
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="latitude"
+						id="latitude"
+						step="0.000001"
+						min="-90"
+						max="90"
+						bind:value={$params.latitude[index]}
+					/>
+					<label for="latitude">Latitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="longitude"
-					id="longitude"
-					step="0.000001"
-					min="-180"
-					max="180"
-					bind:value={$params.longitude}
-				/>
-				<label for="longitude">Longitude</label>
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="longitude"
+						id="longitude"
+						step="0.000001"
+						min="-180"
+						max="180"
+						bind:value={$params.longitude[index]}
+					/>
+					<label for="longitude">Longitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-6">
-			<LocationSearch on:location={locationCallback} />
-		</div>
+			<div class="col-md-5">
+				<LocationSearch on:location={(event) => locationCallback(event, index)} />
+			</div>
+			{#if index == 0}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={addLocation}
+						title="Add coordinates"><PlusLg /></button
+					>
+				</div>
+			{:else}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={() => removeLocation(index)}
+						title="Delete coordinates"><Trash /></button
+					>
+				</div>
+			{/if}
+		{/each}
 	</div>
 	<div class="row py-3 px-0">
 		<h2>Hourly Air Quality Variables</h2>
diff --git a/src/routes/en/docs/climate-api/+page.svelte b/src/routes/en/docs/climate-api/+page.svelte
index ac3236a3..2ac0e4cd 100644
--- a/src/routes/en/docs/climate-api/+page.svelte
+++ b/src/routes/en/docs/climate-api/+page.svelte
@@ -11,6 +11,7 @@
 	import SveltyPicker from 'svelty-picker';
 	import { slide } from 'svelte/transition';
 	import { onMount } from 'svelte';
+	import { PlusLg, Trash } from 'svelte-bootstrap-icons';
 
 	const defaultParameter = {
 		temperature_unit: 'celsius',
@@ -22,8 +23,8 @@
 	};
 
 	const params = urlHashStore({
-		latitude: 52.52,
-		longitude: 13.41,
+		latitude: [52.52],
+		longitude: [13.41],
 		start_date: '1950-01-01',
 		end_date: '2050-12-31',
 		models: [
@@ -103,9 +104,19 @@
 		]
 	];
 
-	function locationCallback(event: CustomEvent<GeoLocation>) {
-		$params.latitude = Number(event.detail.latitude.toFixed(4));
-		$params.longitude = Number(event.detail.longitude.toFixed(4));
+	function locationCallback(event: CustomEvent<GeoLocation>, index: number) {
+		const latitude = Number(event.detail.latitude.toFixed(4));
+		const longitude = Number(event.detail.longitude.toFixed(4));
+		$params.latitude = $params.latitude.toSpliced(index, 1, latitude);
+		$params.longitude = $params.longitude.toSpliced(index, 1, longitude);
+	}
+	function addLocation() {
+		$params.latitude = [...$params.latitude, NaN];
+		$params.longitude = [...$params.longitude, NaN];
+	}
+	function removeLocation(index: number) {
+		$params.latitude = $params.latitude.toSpliced(index, 1);
+		$params.longitude = $params.longitude.toSpliced(index, 1);
 	}
 </script>
 
@@ -126,39 +137,60 @@
 <form method="get" action="https://climate-api.open-meteo.com/v1/climate">
 	<div class="row">
 		<h2>Select Coordinates or City</h2>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="latitude"
-					id="latitude"
-					step="0.000001"
-					min="-90"
-					max="90"
-					bind:value={$params.latitude}
-				/>
-				<label for="latitude">Latitude</label>
+		{#each $params.latitude as _, index}
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="latitude"
+						id="latitude"
+						step="0.000001"
+						min="-90"
+						max="90"
+						bind:value={$params.latitude[index]}
+					/>
+					<label for="latitude">Latitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="longitude"
-					id="longitude"
-					step="0.000001"
-					min="-180"
-					max="180"
-					bind:value={$params.longitude}
-				/>
-				<label for="longitude">Longitude</label>
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="longitude"
+						id="longitude"
+						step="0.000001"
+						min="-180"
+						max="180"
+						bind:value={$params.longitude[index]}
+					/>
+					<label for="longitude">Longitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-6">
-			<LocationSearch on:location={locationCallback} />
-		</div>
+			<div class="col-md-5">
+				<LocationSearch on:location={(event) => locationCallback(event, index)} />
+			</div>
+			{#if index == 0}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={addLocation}
+						title="Add coordinates"><PlusLg /></button
+					>
+				</div>
+			{:else}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={() => removeLocation(index)}
+						title="Delete coordinates"><Trash /></button
+					>
+				</div>
+			{/if}
+		{/each}
 	</div>
 	<div class="row py-3 px-0">
 		<h2>Specify Time Interval</h2>
diff --git a/src/routes/en/docs/dwd-api/+page.svelte b/src/routes/en/docs/dwd-api/+page.svelte
index 981073f7..81b4a733 100644
--- a/src/routes/en/docs/dwd-api/+page.svelte
+++ b/src/routes/en/docs/dwd-api/+page.svelte
@@ -14,6 +14,7 @@
 	import AccordionItem from '$lib/Elements/AccordionItem.svelte';
 	import SveltyPicker from 'svelty-picker';
 	import { slide } from 'svelte/transition';
+	import { PlusLg, Trash } from 'svelte-bootstrap-icons';
 
 	const defaultParameter = {
 		hourly: [],
@@ -32,8 +33,8 @@
 	};
 
 	const params = urlHashStore({
-		latitude: 52.52,
-		longitude: 13.41,
+		latitude: [52.52],
+		longitude: [13.41],
 		...defaultParameter,
 		hourly: ['temperature_2m']
 	});
@@ -180,9 +181,19 @@
 		]
 	];
 
-	function locationCallback(event: CustomEvent<GeoLocation>) {
-		$params.latitude = Number(event.detail.latitude.toFixed(4));
-		$params.longitude = Number(event.detail.longitude.toFixed(4));
+	function locationCallback(event: CustomEvent<GeoLocation>, index: number) {
+		const latitude = Number(event.detail.latitude.toFixed(4));
+		const longitude = Number(event.detail.longitude.toFixed(4));
+		$params.latitude = $params.latitude.toSpliced(index, 1, latitude);
+		$params.longitude = $params.longitude.toSpliced(index, 1, longitude);
+	}
+	function addLocation() {
+		$params.latitude = [...$params.latitude, NaN];
+		$params.longitude = [...$params.longitude, NaN];
+	}
+	function removeLocation(index: number) {
+		$params.latitude = $params.latitude.toSpliced(index, 1);
+		$params.longitude = $params.longitude.toSpliced(index, 1);
 	}
 </script>
 
@@ -202,39 +213,60 @@
 <form method="get" action="https://api.open-meteo.com/v1/dwd-icon">
 	<div class="row">
 		<h2>Select Coordinates or City</h2>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="latitude"
-					id="latitude"
-					step="0.000001"
-					min="-90"
-					max="90"
-					bind:value={$params.latitude}
-				/>
-				<label for="latitude">Latitude</label>
+		{#each $params.latitude as _, index}
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="latitude"
+						id="latitude"
+						step="0.000001"
+						min="-90"
+						max="90"
+						bind:value={$params.latitude[index]}
+					/>
+					<label for="latitude">Latitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="longitude"
-					id="longitude"
-					step="0.000001"
-					min="-180"
-					max="180"
-					bind:value={$params.longitude}
-				/>
-				<label for="longitude">Longitude</label>
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="longitude"
+						id="longitude"
+						step="0.000001"
+						min="-180"
+						max="180"
+						bind:value={$params.longitude[index]}
+					/>
+					<label for="longitude">Longitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-6">
-			<LocationSearch on:location={locationCallback} />
-		</div>
+			<div class="col-md-5">
+				<LocationSearch on:location={(event) => locationCallback(event, index)} />
+			</div>
+			{#if index == 0}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={addLocation}
+						title="Add coordinates"><PlusLg /></button
+					>
+				</div>
+			{:else}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={() => removeLocation(index)}
+						title="Delete coordinates"><Trash /></button
+					>
+				</div>
+			{/if}
+		{/each}
 	</div>
 	<div class="row py-3 px-0">
 		<h2>Hourly Weather Variables</h2>
diff --git a/src/routes/en/docs/ecmwf-api/+page.svelte b/src/routes/en/docs/ecmwf-api/+page.svelte
index d24ad4c8..154472b4 100644
--- a/src/routes/en/docs/ecmwf-api/+page.svelte
+++ b/src/routes/en/docs/ecmwf-api/+page.svelte
@@ -14,6 +14,7 @@
 	import AccordionItem from '$lib/Elements/AccordionItem.svelte';
 	import SveltyPicker from 'svelty-picker';
 	import { slide } from 'svelte/transition';
+	import { PlusLg, Trash } from 'svelte-bootstrap-icons';
 
 	const defaultParameter = {
 		hourly: [],
@@ -27,8 +28,8 @@
 	};
 
 	const params = urlHashStore({
-		latitude: 52.52,
-		longitude: 13.41,
+		latitude: [52.52],
+		longitude: [13.41],
 		...defaultParameter,
 		hourly: ['temperature_2m']
 	});
@@ -89,9 +90,19 @@
 		]
 	];
 
-	function locationCallback(event: CustomEvent<GeoLocation>) {
-		$params.latitude = Number(event.detail.latitude.toFixed(4));
-		$params.longitude = Number(event.detail.longitude.toFixed(4));
+	function locationCallback(event: CustomEvent<GeoLocation>, index: number) {
+		const latitude = Number(event.detail.latitude.toFixed(4));
+		const longitude = Number(event.detail.longitude.toFixed(4));
+		$params.latitude = $params.latitude.toSpliced(index, 1, latitude);
+		$params.longitude = $params.longitude.toSpliced(index, 1, longitude);
+	}
+	function addLocation() {
+		$params.latitude = [...$params.latitude, NaN];
+		$params.longitude = [...$params.longitude, NaN];
+	}
+	function removeLocation(index: number) {
+		$params.latitude = $params.latitude.toSpliced(index, 1);
+		$params.longitude = $params.longitude.toSpliced(index, 1);
 	}
 </script>
 
@@ -112,39 +123,60 @@
 <form method="get" action="https://api.open-meteo.com/v1/ecmwf">
 	<div class="row">
 		<h2>Select Coordinates or City</h2>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="latitude"
-					id="latitude"
-					step="0.000001"
-					min="-90"
-					max="90"
-					bind:value={$params.latitude}
-				/>
-				<label for="latitude">Latitude</label>
+		{#each $params.latitude as _, index}
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="latitude"
+						id="latitude"
+						step="0.000001"
+						min="-90"
+						max="90"
+						bind:value={$params.latitude[index]}
+					/>
+					<label for="latitude">Latitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="longitude"
-					id="longitude"
-					step="0.000001"
-					min="-180"
-					max="180"
-					bind:value={$params.longitude}
-				/>
-				<label for="longitude">Longitude</label>
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="longitude"
+						id="longitude"
+						step="0.000001"
+						min="-180"
+						max="180"
+						bind:value={$params.longitude[index]}
+					/>
+					<label for="longitude">Longitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-6">
-			<LocationSearch on:location={locationCallback} />
-		</div>
+			<div class="col-md-5">
+				<LocationSearch on:location={(event) => locationCallback(event, index)} />
+			</div>
+			{#if index == 0}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={addLocation}
+						title="Add coordinates"><PlusLg /></button
+					>
+				</div>
+			{:else}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={() => removeLocation(index)}
+						title="Delete coordinates"><Trash /></button
+					>
+				</div>
+			{/if}
+		{/each}
 	</div>
 	<div class="row py-3 px-0">
 		<h2>3-Hourly Weather Variables</h2>
diff --git a/src/routes/en/docs/elevation-api/+page.svelte b/src/routes/en/docs/elevation-api/+page.svelte
index df1a679e..c5281799 100644
--- a/src/routes/en/docs/elevation-api/+page.svelte
+++ b/src/routes/en/docs/elevation-api/+page.svelte
@@ -1,164 +1,225 @@
-<svelte:head>
-    <title>Elevation API | Open-Meteo.com</title> 
-    <link rel="canonical" href="https://open-meteo.com/en/docs/elevation-api" />
-    <meta name="description" content="Get detailed elevation information for any set of coordinates using our digital elevation model. With impressive resolution up to 90 meters, gain valuable insights into terrain and elevation variations for different geographic points. Enhance your understanding and analysis of topography with our reliable elevation data.">
-
-</svelte:head>
-
 <script lang="ts">
-  import { onMount } from 'svelte';
+	import { onMount } from 'svelte';
 	import LicenseSelector from '../LicenseSelector.svelte';
-  import { api_key_preferences } from "$lib/stores"
-  import LocationSearch from "../LocationSearch.svelte";
-  import type { GeoLocation } from "$lib/stores";
-
-  let params = {
-    latitude: 52.52, 
-    longitude: 13.41
-  }
-
-  function locationCallback(event: CustomEvent<GeoLocation>) {
-      params.latitude = (Number)(event.detail.latitude.toFixed(4))
-      params.longitude = (Number)(event.detail.longitude.toFixed(4))
-  }
-
-  let base = "https://api.open-meteo.com/v1/elevation?"
-  $: switch ($api_key_preferences.use) {
-    case "commercial":
-      base = `https://customer-api.open-meteo.com/v1/elevation?apikey=${$api_key_preferences.apikey}&`
-      break
-    case "self_hosted":
-      base = `${$api_key_preferences.self_host_server}/v1/elevation?`
-      break
-    default:
-      base = "https://api.open-meteo.com/v1/elevation?"
-  }
- 
-  let response = `{"elevation":[38.0]}`
-  $: url = `${base}latitude=${params.latitude}&longitude=${params.longitude}`
-
-  async function submitForm() {
-      response = await (await fetch(url)).text();
-  }
-
-  function getPosition() {
-      if (!('geolocation' in navigator)) {
-        alert("GPS not available");
-        return;
-      }
-      navigator.geolocation.getCurrentPosition((position) => {
-          params.latitude = Number(position.coords.latitude.toFixed(2))
-          params.longitude = Number(position.coords.longitude.toFixed(2))
-          submitForm()
-      }, (error) => {
-        alert("An error occurred: " + error.message);
-      });
-  }
-
-  onMount(async () => {
-    await submitForm()
-  });
+	import { api_key_preferences } from '$lib/stores';
+	import LocationSearch from '../LocationSearch.svelte';
+	import type { GeoLocation } from '$lib/stores';
+	import { urlHashStore } from '$lib/url-hash-store';
+	import { PlusLg, Trash } from 'svelte-bootstrap-icons';
+
+	const params = urlHashStore({
+		latitude: [52.52],
+		longitude: [13.41]
+	});
+
+	function locationCallback(event: CustomEvent<GeoLocation>, index: number) {
+		const latitude = Number(event.detail.latitude.toFixed(4));
+		const longitude = Number(event.detail.longitude.toFixed(4));
+		$params.latitude = $params.latitude.toSpliced(index, 1, latitude);
+		$params.longitude = $params.longitude.toSpliced(index, 1, longitude);
+	}
+	function addLocation() {
+		$params.latitude = [...$params.latitude, NaN];
+		$params.longitude = [...$params.longitude, NaN];
+	}
+	function removeLocation(index: number) {
+		$params.latitude = $params.latitude.toSpliced(index, 1);
+		$params.longitude = $params.longitude.toSpliced(index, 1);
+	}
+
+	let base = 'https://api.open-meteo.com/v1/elevation?';
+	$: switch ($api_key_preferences.use) {
+		case 'commercial':
+			base = `https://customer-api.open-meteo.com/v1/elevation?apikey=${$api_key_preferences.apikey}&`;
+			break;
+		case 'self_hosted':
+			base = `${$api_key_preferences.self_host_server}/v1/elevation?`;
+			break;
+		default:
+			base = 'https://api.open-meteo.com/v1/elevation?';
+	}
+
+	let response = `{"elevation":[38.0]}`;
+	$: url = `${base}latitude=${$params.latitude}&longitude=${$params.longitude}`;
+
+	async function submitForm() {
+		response = await (await fetch(url)).text();
+	}
+
+	onMount(async () => {
+		await submitForm();
+	});
 </script>
 
+<svelte:head>
+	<title>Elevation API | Open-Meteo.com</title>
+	<link rel="canonical" href="https://open-meteo.com/en/docs/elevation-api" />
+	<meta
+		name="description"
+		content="Get detailed elevation information for any set of coordinates using our digital elevation model. With impressive resolution up to 90 meters, gain valuable insights into terrain and elevation variations for different geographic points. Enhance your understanding and analysis of topography with our reliable elevation data."
+	/>
+</svelte:head>
 
-  <div class="alert alert-primary" role="alert">
-    Get more information on how weather forecasts are improved with elevation models in our <a
-      href="https://openmeteo.substack.com/p/87a094f1-325d-497a-8a9d-4d16b794fd15" target="_blank">blog article</a>.
-  </div>
-
-  <form id="elevation_form" method="get" target="container" action="https://api.open-meteo.com/v1/elevation">
-    <div class="row">
-      <h2>Select Coordinates or City</h2>
-      <div class="col-md-3">
-        <div class="form-floating">
-          <input type="number" class="form-control" name="latitude" id="latitude" step="0.000001" min="-90" max="90" bind:value={params.latitude}>
-          <label for="latitude">Latitude</label>
-        </div>
-      </div>
-      <div class="col-md-3">
-        <div class="form-floating">
-          <input type="number" class="form-control" name="longitude" id="longitude" step="0.000001" min="-180" max="180" bind:value={params.longitude}>
-          <label for="longitude">Longitude</label>
-        </div>
-      </div>
-      <div class="col-md-6">
-        <LocationSearch on:location={locationCallback}></LocationSearch>
-      </div>
-    </div>
-
-    <LicenseSelector></LicenseSelector>
-
-    <div class="col-12 mb-3">
-      <button type="submit" class="btn btn-primary" on:click|preventDefault={submitForm}>Preview</button>
-    </div>
-  </form>
-
-  <div class="col-12 mb-3">
-    <div class="form-control" style="height: 50px; width: 100%;">{response}</div>
-  </div>
-
-  <div class="col-12">
-    <label for="api_url" class="form-label">API URL (<a id="api_url_link" target="_blank" href="{url}">Open in new
-        tab</a>)</label>
-    <input type="text" class="form-control" id="api_url" readonly value="{url}">
-    <div id="emailHelp" class="form-text">You can copy this API URL into your application</div>
-  </div>
-
-  <div class="col-12 py-5">
-    <h2 id="api-documentation">API Documentation</h2>
-    <p>The API endpoint <mark>/v1/elevation</mark> accepts one or multiple geographical coordinate and returns the
-      terrain elevation for those points.</p>
-    <p>Data is based on the <a href="https://spacedata.copernicus.eu/collections/copernicus-digital-elevation-model">Copernicus DEM 2021 release GLO-90</a> with 90 meters resolution. The GLO-90 dataset is
-      available worldwide with a free license.</p>
-    <p>All URL parameters are listed below:</p>
-    <div class="table-responsive">
-      <table class="table">
-        <thead>
-          <tr>
-            <th scope="col">Parameter</th>
-            <th scope="col">Format</th>
-            <th scope="col">Required</th>
-            <th scope="col">Default</th>
-            <th scope="col">Description</th>
-          </tr>
-        </thead>
-        <tbody>
-          <tr>
-            <th scope="row">latitude<br />longitude</th>
-            <td>Floating point array</td>
-            <td>Yes</td>
-            <td></td>
-            <td>
-              Geographical WGS84 coordinates of the location.
-              Multiple coordinates can be coma <mark>,</mark> separated.
-              Up to 100 coordinates can be requested at once.
-              Example for <a href="https://api.open-meteo.com/v1/elevation?latitude=52.52,48.85&longitude=13.41,2.35"
-                target="_blank">multiple coordinates</a>.
-            </td>
-          </tr>
-          <tr>
-            <th scope="row">apikey</th>
-            <td>String</td>
-            <td>No</td>
-            <td />
-            <td
-              >Only required to commercial use to access reserved API resources for customers. The
-              server URL requires the prefix <mark>customer-</mark>. See
-              <a href="/en/pricing" title="Pricing information to use the weather API commercially"
-                >pricing</a
-              > for more information.</td
-            >
-          </tr>
-        </tbody>
-      </table>
-    </div>
-    <p>Additional optional URL parameters will be added. For API stability, no required parameters will be added in the
-      future!</p>
-
-    <h3 class="mt-5">JSON Return Object</h3>
-    <p>On success a JSON object is returned with just one attribute <mark>elevation</mark>. It is always an array, even
-      if only one coordinate is requested.</p>
-    <pre>
+<div class="alert alert-primary" role="alert">
+	Get more information on how weather forecasts are improved with elevation models in our <a
+		href="https://openmeteo.substack.com/p/87a094f1-325d-497a-8a9d-4d16b794fd15"
+		target="_blank">blog article</a
+	>.
+</div>
+
+<form
+	id="elevation_form"
+	method="get"
+	target="container"
+	action="https://api.open-meteo.com/v1/elevation"
+>
+	<div class="row">
+		<h2>Select Coordinates or City</h2>
+		{#each $params.latitude as _, index}
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="latitude"
+						id="latitude"
+						step="0.000001"
+						min="-90"
+						max="90"
+						bind:value={$params.latitude[index]}
+					/>
+					<label for="latitude">Latitude</label>
+				</div>
+			</div>
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="longitude"
+						id="longitude"
+						step="0.000001"
+						min="-180"
+						max="180"
+						bind:value={$params.longitude[index]}
+					/>
+					<label for="longitude">Longitude</label>
+				</div>
+			</div>
+			<div class="col-md-5">
+				<LocationSearch on:location={(event) => locationCallback(event, index)} />
+			</div>
+			{#if index == 0}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={addLocation}
+						title="Add coordinates"><PlusLg /></button
+					>
+				</div>
+			{:else}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={() => removeLocation(index)}
+						title="Delete coordinates"><Trash /></button
+					>
+				</div>
+			{/if}
+		{/each}
+	</div>
+
+	<LicenseSelector />
+
+	<div class="col-12 mb-3">
+		<button type="submit" class="btn btn-primary" on:click|preventDefault={submitForm}
+			>Preview</button
+		>
+	</div>
+</form>
+
+<div class="col-12 mb-3">
+	<div class="form-control" style="height: 50px; width: 100%;">{response}</div>
+</div>
+
+<div class="col-12">
+	<label for="api_url" class="form-label"
+		>API URL (<a id="api_url_link" target="_blank" href={url}>Open in new tab</a>)</label
+	>
+	<input type="text" class="form-control" id="api_url" readonly value={url} />
+	<div id="emailHelp" class="form-text">You can copy this API URL into your application</div>
+</div>
+
+<div class="col-12 py-5">
+	<h2 id="api-documentation">API Documentation</h2>
+	<p>
+		The API endpoint <mark>/v1/elevation</mark> accepts one or multiple geographical coordinate and returns
+		the terrain elevation for those points.
+	</p>
+	<p>
+		Data is based on the <a
+			href="https://spacedata.copernicus.eu/collections/copernicus-digital-elevation-model"
+			>Copernicus DEM 2021 release GLO-90</a
+		> with 90 meters resolution. The GLO-90 dataset is available worldwide with a free license.
+	</p>
+	<p>All URL parameters are listed below:</p>
+	<div class="table-responsive">
+		<table class="table">
+			<thead>
+				<tr>
+					<th scope="col">Parameter</th>
+					<th scope="col">Format</th>
+					<th scope="col">Required</th>
+					<th scope="col">Default</th>
+					<th scope="col">Description</th>
+				</tr>
+			</thead>
+			<tbody>
+				<tr>
+					<th scope="row">latitude<br />longitude</th>
+					<td>Floating point array</td>
+					<td>Yes</td>
+					<td />
+					<td>
+						Geographical WGS84 coordinates of the location. Multiple coordinates can be coma <mark
+							>,</mark
+						>
+						separated. Up to 100 coordinates can be requested at once. Example for
+						<a
+							href="https://api.open-meteo.com/v1/elevation?latitude=52.52,48.85&longitude=13.41,2.35"
+							target="_blank">multiple coordinates</a
+						>.
+					</td>
+				</tr>
+				<tr>
+					<th scope="row">apikey</th>
+					<td>String</td>
+					<td>No</td>
+					<td />
+					<td
+						>Only required to commercial use to access reserved API resources for customers. The
+						server URL requires the prefix <mark>customer-</mark>. See
+						<a href="/en/pricing" title="Pricing information to use the weather API commercially"
+							>pricing</a
+						> for more information.</td
+					>
+				</tr>
+			</tbody>
+		</table>
+	</div>
+	<p>
+		Additional optional URL parameters will be added. For API stability, no required parameters will
+		be added in the future!
+	</p>
+
+	<h3 class="mt-5">JSON Return Object</h3>
+	<p>
+		On success a JSON object is returned with just one attribute <mark>elevation</mark>. It is
+		always an array, even if only one coordinate is requested.
+	</p>
+	<pre>
       <code>
 {`
   "elevation": [38.0]
@@ -166,10 +227,12 @@
       </code>
     </pre>
 
-    <h3 class="mt-5">Errors</h3>
-    <p>In case an error occurs, for example a URL parameter is not correctly specified, a JSON error object is returned
-      with a HTTP 400 status code.</p>
-    <pre>
+	<h3 class="mt-5">Errors</h3>
+	<p>
+		In case an error occurs, for example a URL parameter is not correctly specified, a JSON error
+		object is returned with a HTTP 400 status code.
+	</p>
+	<pre>
       <code>
 {`
   "error":true,
@@ -177,15 +240,15 @@
 `}
       </code>
     </pre>
-  </div>
+</div>
 
-  <h2 id="citation">Citation & Acknowledgement</h2>
-  <pre>
+<h2 id="citation">Citation & Acknowledgement</h2>
+<pre>
 ESA - EUsers, who, in their research, use the Copernicus DEM, are requested to use the following DOI when citing the data source in their publications: 
 
 https://doi.org/10.5270/ESA-c5d3d65
   </pre>
-  <p>All users of Open-Meteo data must provide a clear attribution to the Copernicus program as well as a reference to
-    Open-Meteo.</p>
-
-
+<p>
+	All users of Open-Meteo data must provide a clear attribution to the Copernicus program as well as
+	a reference to Open-Meteo.
+</p>
diff --git a/src/routes/en/docs/ensemble-api/+page.svelte b/src/routes/en/docs/ensemble-api/+page.svelte
index 629e7386..cf60102e 100644
--- a/src/routes/en/docs/ensemble-api/+page.svelte
+++ b/src/routes/en/docs/ensemble-api/+page.svelte
@@ -8,6 +8,7 @@
 	import AccordionItem from '$lib/Elements/AccordionItem.svelte';
 	import SveltyPicker from 'svelty-picker';
 	import { slide } from 'svelte/transition';
+	import { PlusLg, Trash } from 'svelte-bootstrap-icons';
 
 	const defaultParameter = {
 		hourly: [],
@@ -26,8 +27,8 @@
 	};
 
 	const params = urlHashStore({
-		latitude: 52.52,
-		longitude: 13.41,
+		latitude: [52.52],
+		longitude: [13.41],
 		...defaultParameter,
 		hourly: ['temperature_2m'],
 		models: ['icon_seamless']
@@ -312,9 +313,19 @@
 		[{ name: 'gem_global', label: 'GEM Global Ensemble' }]
 	];
 
-	function locationCallback(event: CustomEvent<GeoLocation>) {
-		$params.latitude = Number(event.detail.latitude.toFixed(4));
-		$params.longitude = Number(event.detail.longitude.toFixed(4));
+	function locationCallback(event: CustomEvent<GeoLocation>, index: number) {
+		const latitude = Number(event.detail.latitude.toFixed(4));
+		const longitude = Number(event.detail.longitude.toFixed(4));
+		$params.latitude = $params.latitude.toSpliced(index, 1, latitude);
+		$params.longitude = $params.longitude.toSpliced(index, 1, longitude);
+	}
+	function addLocation() {
+		$params.latitude = [...$params.latitude, NaN];
+		$params.longitude = [...$params.longitude, NaN];
+	}
+	function removeLocation(index: number) {
+		$params.latitude = $params.latitude.toSpliced(index, 1);
+		$params.longitude = $params.longitude.toSpliced(index, 1);
 	}
 </script>
 
@@ -334,39 +345,60 @@
 <form method="get" action="https://ensemble-api.open-meteo.com/v1/ensemble">
 	<div class="row">
 		<h2>Select Coordinates or City</h2>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="latitude"
-					id="latitude"
-					step="0.000001"
-					min="-90"
-					max="90"
-					bind:value={$params.latitude}
-				/>
-				<label for="latitude">Latitude</label>
+		{#each $params.latitude as _, index}
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="latitude"
+						id="latitude"
+						step="0.000001"
+						min="-90"
+						max="90"
+						bind:value={$params.latitude[index]}
+					/>
+					<label for="latitude">Latitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="longitude"
-					id="longitude"
-					step="0.000001"
-					min="-180"
-					max="180"
-					bind:value={$params.longitude}
-				/>
-				<label for="longitude">Longitude</label>
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="longitude"
+						id="longitude"
+						step="0.000001"
+						min="-180"
+						max="180"
+						bind:value={$params.longitude[index]}
+					/>
+					<label for="longitude">Longitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-6">
-			<LocationSearch on:location={locationCallback} />
-		</div>
+			<div class="col-md-5">
+				<LocationSearch on:location={(event) => locationCallback(event, index)} />
+			</div>
+			{#if index == 0}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={addLocation}
+						title="Add coordinates"><PlusLg /></button
+					>
+				</div>
+			{:else}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={() => removeLocation(index)}
+						title="Delete coordinates"><Trash /></button
+					>
+				</div>
+			{/if}
+		{/each}
 	</div>
 
 	<div class="row py-3 px-0">
diff --git a/src/routes/en/docs/flood-api/+page.svelte b/src/routes/en/docs/flood-api/+page.svelte
index e788052b..c61d69c1 100644
--- a/src/routes/en/docs/flood-api/+page.svelte
+++ b/src/routes/en/docs/flood-api/+page.svelte
@@ -8,6 +8,7 @@
 	import AccordionItem from '$lib/Elements/AccordionItem.svelte';
 	import SveltyPicker from 'svelty-picker';
 	import { slide } from 'svelte/transition';
+	import { PlusLg, Trash } from 'svelte-bootstrap-icons';
 
 	const defaultParameter = {
 		daily: [],
@@ -21,8 +22,8 @@
 	};
 
 	const params = urlHashStore({
-		latitude: 59.91,
-		longitude: 10.75,
+		latitude: [59.91],
+		longitude: [10.75],
 		...defaultParameter,
 		daily: ['river_discharge']
 	});
@@ -60,9 +61,19 @@
 		]
 	];
 
-	function locationCallback(event: CustomEvent<GeoLocation>) {
-		$params.latitude = Number(event.detail.latitude.toFixed(4));
-		$params.longitude = Number(event.detail.longitude.toFixed(4));
+	function locationCallback(event: CustomEvent<GeoLocation>, index: number) {
+		const latitude = Number(event.detail.latitude.toFixed(4));
+		const longitude = Number(event.detail.longitude.toFixed(4));
+		$params.latitude = $params.latitude.toSpliced(index, 1, latitude);
+		$params.longitude = $params.longitude.toSpliced(index, 1, longitude);
+	}
+	function addLocation() {
+		$params.latitude = [...$params.latitude, NaN];
+		$params.longitude = [...$params.longitude, NaN];
+	}
+	function removeLocation(index: number) {
+		$params.latitude = $params.latitude.toSpliced(index, 1);
+		$params.longitude = $params.longitude.toSpliced(index, 1);
 	}
 </script>
 
@@ -78,39 +89,60 @@
 <form method="get" action="https://flood-api.open-meteo.com/v1/flood">
 	<div class="row">
 		<h2>Select Coordinates or City</h2>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="latitude"
-					id="latitude"
-					step="0.000001"
-					min="-90"
-					max="90"
-					bind:value={$params.latitude}
-				/>
-				<label for="latitude">Latitude</label>
+		{#each $params.latitude as _, index}
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="latitude"
+						id="latitude"
+						step="0.000001"
+						min="-90"
+						max="90"
+						bind:value={$params.latitude[index]}
+					/>
+					<label for="latitude">Latitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="longitude"
-					id="longitude"
-					step="0.000001"
-					min="-180"
-					max="180"
-					bind:value={$params.longitude}
-				/>
-				<label for="longitude">Longitude</label>
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="longitude"
+						id="longitude"
+						step="0.000001"
+						min="-180"
+						max="180"
+						bind:value={$params.longitude[index]}
+					/>
+					<label for="longitude">Longitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-6">
-			<LocationSearch on:location={locationCallback} />
-		</div>
+			<div class="col-md-5">
+				<LocationSearch on:location={(event) => locationCallback(event, index)} />
+			</div>
+			{#if index == 0}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={addLocation}
+						title="Add coordinates"><PlusLg /></button
+					>
+				</div>
+			{:else}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={() => removeLocation(index)}
+						title="Delete coordinates"><Trash /></button
+					>
+				</div>
+			{/if}
+		{/each}
 	</div>
 	<div class="row py-3 px-0">
 		<h2>Daily Weather Variables</h2>
diff --git a/src/routes/en/docs/gem-api/+page.svelte b/src/routes/en/docs/gem-api/+page.svelte
index 0a0f77a0..ca36f367 100644
--- a/src/routes/en/docs/gem-api/+page.svelte
+++ b/src/routes/en/docs/gem-api/+page.svelte
@@ -14,6 +14,8 @@
 	import AccordionItem from '$lib/Elements/AccordionItem.svelte';
 	import SveltyPicker from 'svelty-picker';
 	import { slide } from 'svelte/transition';
+	import { PlusLg, Trash } from 'svelte-bootstrap-icons';
+
 
 	const defaultParameter = {
 		hourly: [],
@@ -31,8 +33,8 @@
 	};
 
 	const params = urlHashStore({
-		latitude: 52.52,
-		longitude: 13.41,
+		latitude: [52.52],
+		longitude: [13.41],
 		...defaultParameter,
 		hourly: ['temperature_2m']
 	});
@@ -146,9 +148,19 @@
 		]
 	];
 
-	function locationCallback(event: CustomEvent<GeoLocation>) {
-		$params.latitude = Number(event.detail.latitude.toFixed(4));
-		$params.longitude = Number(event.detail.longitude.toFixed(4));
+	function locationCallback(event: CustomEvent<GeoLocation>, index: number) {
+		const latitude = Number(event.detail.latitude.toFixed(4));
+		const longitude = Number(event.detail.longitude.toFixed(4));
+		$params.latitude = $params.latitude.toSpliced(index, 1, latitude);
+		$params.longitude = $params.longitude.toSpliced(index, 1, longitude);
+	}
+	function addLocation() {
+		$params.latitude = [...$params.latitude, NaN];
+		$params.longitude = [...$params.longitude, NaN];
+	}
+	function removeLocation(index: number) {
+		$params.latitude = $params.latitude.toSpliced(index, 1);
+		$params.longitude = $params.longitude.toSpliced(index, 1);
 	}
 </script>
 
@@ -166,39 +178,60 @@
 <form method="get" action="https://api.open-meteo.com/v1/gem">
 	<div class="row">
 		<h2>Select Coordinates or City</h2>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="latitude"
-					id="latitude"
-					step="0.000001"
-					min="-90"
-					max="90"
-					bind:value={$params.latitude}
-				/>
-				<label for="latitude">Latitude</label>
+		{#each $params.latitude as _, index}
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="latitude"
+						id="latitude"
+						step="0.000001"
+						min="-90"
+						max="90"
+						bind:value={$params.latitude[index]}
+					/>
+					<label for="latitude">Latitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="longitude"
-					id="longitude"
-					step="0.000001"
-					min="-180"
-					max="180"
-					bind:value={$params.longitude}
-				/>
-				<label for="longitude">Longitude</label>
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="longitude"
+						id="longitude"
+						step="0.000001"
+						min="-180"
+						max="180"
+						bind:value={$params.longitude[index]}
+					/>
+					<label for="longitude">Longitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-6">
-			<LocationSearch on:location={locationCallback} />
-		</div>
+			<div class="col-md-5">
+				<LocationSearch on:location={(event) => locationCallback(event, index)} />
+			</div>
+			{#if index == 0}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={addLocation}
+						title="Add coordinates"><PlusLg /></button
+					>
+				</div>
+			{:else}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={() => removeLocation(index)}
+						title="Delete coordinates"><Trash /></button
+					>
+				</div>
+			{/if}
+		{/each}
 	</div>
 	<div class="row py-3 px-0">
 		<h2>Hourly Weather Variables</h2>
diff --git a/src/routes/en/docs/gfs-api/+page.svelte b/src/routes/en/docs/gfs-api/+page.svelte
index e7b74332..e03427ff 100644
--- a/src/routes/en/docs/gfs-api/+page.svelte
+++ b/src/routes/en/docs/gfs-api/+page.svelte
@@ -14,6 +14,7 @@
 	import AccordionItem from '$lib/Elements/AccordionItem.svelte';
 	import SveltyPicker from 'svelty-picker';
 	import { slide } from 'svelte/transition';
+	import { PlusLg, Trash } from 'svelte-bootstrap-icons';
 
 	const defaultParameter = {
 		hourly: [],
@@ -32,8 +33,8 @@
 	};
 
 	const params = urlHashStore({
-		latitude: 52.52,
-		longitude: 13.41,
+		latitude: [52.52],
+		longitude: [13.41],
 		...defaultParameter,
 		hourly: ['temperature_2m']
 	});
@@ -167,9 +168,19 @@
 		]
 	];
 
-	function locationCallback(event: CustomEvent<GeoLocation>) {
-		$params.latitude = Number(event.detail.latitude.toFixed(4));
-		$params.longitude = Number(event.detail.longitude.toFixed(4));
+	function locationCallback(event: CustomEvent<GeoLocation>, index: number) {
+		const latitude = Number(event.detail.latitude.toFixed(4));
+		const longitude = Number(event.detail.longitude.toFixed(4));
+		$params.latitude = $params.latitude.toSpliced(index, 1, latitude);
+		$params.longitude = $params.longitude.toSpliced(index, 1, longitude);
+	}
+	function addLocation() {
+		$params.latitude = [...$params.latitude, NaN];
+		$params.longitude = [...$params.longitude, NaN];
+	}
+	function removeLocation(index: number) {
+		$params.latitude = $params.latitude.toSpliced(index, 1);
+		$params.longitude = $params.longitude.toSpliced(index, 1);
 	}
 </script>
 
@@ -188,39 +199,60 @@
 <form method="get" action="https://api.open-meteo.com/v1/gfs">
 	<div class="row">
 		<h2>Select Coordinates or City</h2>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="latitude"
-					id="latitude"
-					step="0.000001"
-					min="-90"
-					max="90"
-					bind:value={$params.latitude}
-				/>
-				<label for="latitude">Latitude</label>
+		{#each $params.latitude as _, index}
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="latitude"
+						id="latitude"
+						step="0.000001"
+						min="-90"
+						max="90"
+						bind:value={$params.latitude[index]}
+					/>
+					<label for="latitude">Latitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="longitude"
-					id="longitude"
-					step="0.000001"
-					min="-180"
-					max="180"
-					bind:value={$params.longitude}
-				/>
-				<label for="longitude">Longitude</label>
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="longitude"
+						id="longitude"
+						step="0.000001"
+						min="-180"
+						max="180"
+						bind:value={$params.longitude[index]}
+					/>
+					<label for="longitude">Longitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-6">
-			<LocationSearch on:location={locationCallback} />
-		</div>
+			<div class="col-md-5">
+				<LocationSearch on:location={(event) => locationCallback(event, index)} />
+			</div>
+			{#if index == 0}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={addLocation}
+						title="Add coordinates"><PlusLg /></button
+					>
+				</div>
+			{:else}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={() => removeLocation(index)}
+						title="Delete coordinates"><Trash /></button
+					>
+				</div>
+			{/if}
+		{/each}
 	</div>
 	<div class="row py-3 px-0">
 		<h2>Hourly Weather Variables</h2>
diff --git a/src/routes/en/docs/historical-weather-api/+page.svelte b/src/routes/en/docs/historical-weather-api/+page.svelte
index 76b8ed8e..542bfd45 100644
--- a/src/routes/en/docs/historical-weather-api/+page.svelte
+++ b/src/routes/en/docs/historical-weather-api/+page.svelte
@@ -11,7 +11,7 @@
 	import SveltyPicker from 'svelty-picker';
 	import { slide } from 'svelte/transition';
 	import { onMount } from 'svelte';
-	import { reset } from '__sveltekit/paths';
+	import { PlusLg, Trash } from 'svelte-bootstrap-icons';
 
 	var d = new Date();
 	d.setDate(d.getDate() - 5);
@@ -33,8 +33,8 @@
 	};
 
 	const params = urlHashStore({
-		latitude: 52.52,
-		longitude: 13.41,
+		latitude: [52.52],
+		longitude: [13.41],
 		start_date: startDateDefault,
 		end_date: endDateDefault,
 		...defaultParameter,
@@ -172,9 +172,19 @@
 		models.push([{ name: 'ecmwf_ifs', label: 'ECMWF IFS', caption: '9 km, Global' }]);
 	}
 
-	function locationCallback(event: CustomEvent<GeoLocation>) {
-		$params.latitude = Number(event.detail.latitude.toFixed(4));
-		$params.longitude = Number(event.detail.longitude.toFixed(4));
+	function locationCallback(event: CustomEvent<GeoLocation>, index: number) {
+		const latitude = Number(event.detail.latitude.toFixed(4));
+		const longitude = Number(event.detail.longitude.toFixed(4));
+		$params.latitude = $params.latitude.toSpliced(index, 1, latitude);
+		$params.longitude = $params.longitude.toSpliced(index, 1, longitude);
+	}
+	function addLocation() {
+		$params.latitude = [...$params.latitude, NaN];
+		$params.longitude = [...$params.longitude, NaN];
+	}
+	function removeLocation(index: number) {
+		$params.latitude = $params.latitude.toSpliced(index, 1);
+		$params.longitude = $params.longitude.toSpliced(index, 1);
 	}
 </script>
 
@@ -198,39 +208,60 @@
 <form method="get" action="https://archive-api.open-meteo.com/v1/archive">
 	<div class="row">
 		<h2>Select Coordinates or City</h2>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="latitude"
-					id="latitude"
-					step="0.000001"
-					min="-90"
-					max="90"
-					bind:value={$params.latitude}
-				/>
-				<label for="latitude">Latitude</label>
+		{#each $params.latitude as _, index}
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="latitude"
+						id="latitude"
+						step="0.000001"
+						min="-90"
+						max="90"
+						bind:value={$params.latitude[index]}
+					/>
+					<label for="latitude">Latitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="longitude"
-					id="longitude"
-					step="0.000001"
-					min="-180"
-					max="180"
-					bind:value={$params.longitude}
-				/>
-				<label for="longitude">Longitude</label>
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="longitude"
+						id="longitude"
+						step="0.000001"
+						min="-180"
+						max="180"
+						bind:value={$params.longitude[index]}
+					/>
+					<label for="longitude">Longitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-6">
-			<LocationSearch on:location={locationCallback} />
-		</div>
+			<div class="col-md-5">
+				<LocationSearch on:location={(event) => locationCallback(event, index)} />
+			</div>
+			{#if index == 0}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={addLocation}
+						title="Add coordinates"><PlusLg /></button
+					>
+				</div>
+			{:else}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={() => removeLocation(index)}
+						title="Delete coordinates"><Trash /></button
+					>
+				</div>
+			{/if}
+		{/each}
 	</div>
 	<div class="row py-3 px-0">
 		<h2>Specify Time Interval</h2>
diff --git a/src/routes/en/docs/jma-api/+page.svelte b/src/routes/en/docs/jma-api/+page.svelte
index ead9fd0a..cf6e5726 100644
--- a/src/routes/en/docs/jma-api/+page.svelte
+++ b/src/routes/en/docs/jma-api/+page.svelte
@@ -14,6 +14,7 @@
 	import AccordionItem from '$lib/Elements/AccordionItem.svelte';
 	import SveltyPicker from 'svelty-picker';
 	import { slide } from 'svelte/transition';
+	import { PlusLg, Trash } from 'svelte-bootstrap-icons';
 
 	const defaultParameter = {
 		hourly: [],
@@ -30,8 +31,8 @@
 	};
 
 	const params = urlHashStore({
-		latitude: 52.52,
-		longitude: 13.41,
+		latitude: [52.52],
+		longitude: [13.41],
 		...defaultParameter,
 		hourly: ['temperature_2m']
 	});
@@ -124,9 +125,19 @@
 		]
 	];
 
-	function locationCallback(event: CustomEvent<GeoLocation>) {
-		$params.latitude = Number(event.detail.latitude.toFixed(4));
-		$params.longitude = Number(event.detail.longitude.toFixed(4));
+	function locationCallback(event: CustomEvent<GeoLocation>, index: number) {
+		const latitude = Number(event.detail.latitude.toFixed(4));
+		const longitude = Number(event.detail.longitude.toFixed(4));
+		$params.latitude = $params.latitude.toSpliced(index, 1, latitude);
+		$params.longitude = $params.longitude.toSpliced(index, 1, longitude);
+	}
+	function addLocation() {
+		$params.latitude = [...$params.latitude, NaN];
+		$params.longitude = [...$params.longitude, NaN];
+	}
+	function removeLocation(index: number) {
+		$params.latitude = $params.latitude.toSpliced(index, 1);
+		$params.longitude = $params.longitude.toSpliced(index, 1);
 	}
 </script>
 
@@ -143,39 +154,60 @@
 <form method="get" action="https://api.open-meteo.com/v1/jma">
 	<div class="row">
 		<h2>Select Coordinates or City</h2>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="latitude"
-					id="latitude"
-					step="0.000001"
-					min="-90"
-					max="90"
-					bind:value={$params.latitude}
-				/>
-				<label for="latitude">Latitude</label>
+		{#each $params.latitude as _, index}
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="latitude"
+						id="latitude"
+						step="0.000001"
+						min="-90"
+						max="90"
+						bind:value={$params.latitude[index]}
+					/>
+					<label for="latitude">Latitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="longitude"
-					id="longitude"
-					step="0.000001"
-					min="-180"
-					max="180"
-					bind:value={$params.longitude}
-				/>
-				<label for="longitude">Longitude</label>
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="longitude"
+						id="longitude"
+						step="0.000001"
+						min="-180"
+						max="180"
+						bind:value={$params.longitude[index]}
+					/>
+					<label for="longitude">Longitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-6">
-			<LocationSearch on:location={locationCallback} />
-		</div>
+			<div class="col-md-5">
+				<LocationSearch on:location={(event) => locationCallback(event, index)} />
+			</div>
+			{#if index == 0}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={addLocation}
+						title="Add coordinates"><PlusLg /></button
+					>
+				</div>
+			{:else}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={() => removeLocation(index)}
+						title="Delete coordinates"><Trash /></button
+					>
+				</div>
+			{/if}
+		{/each}
 	</div>
 	<div class="row py-3 px-0">
 		<h2>Hourly Weather Variables</h2>
diff --git a/src/routes/en/docs/marine-weather-api/+page.svelte b/src/routes/en/docs/marine-weather-api/+page.svelte
index 68c18d12..116a1f4c 100644
--- a/src/routes/en/docs/marine-weather-api/+page.svelte
+++ b/src/routes/en/docs/marine-weather-api/+page.svelte
@@ -1,19 +1,12 @@
 <script lang="ts">
 	import LicenseSelector from '../LicenseSelector.svelte';
-	import PressureLevelsHelpTable from '../PressureLevelsHelpTable.svelte';
 	import LocationSearch from '../LocationSearch.svelte';
 	import type { GeoLocation } from '$lib/stores';
 	import ResultPreview from '../ResultPreview.svelte';
 	import { urlHashStore } from '$lib/url-hash-store';
-	import {
-		altitudeAboveSeaLevelMeters,
-		countPressureVariables,
-		countVariables,
-		sliceIntoChunks
-	} from '$lib/meteo';
-	import AccordionItem from '$lib/Elements/AccordionItem.svelte';
 	import SveltyPicker from 'svelty-picker';
 	import { slide } from 'svelte/transition';
+	import { PlusLg, Trash } from 'svelte-bootstrap-icons';
 
 	const defaultParameter = {
 		hourly: [],
@@ -27,8 +20,8 @@
 	};
 
 	const params = urlHashStore({
-		latitude: 54.3213,
-		longitude: 10.1348,
+		latitude: [54.3213],
+		longitude: [10.1348],
 		...defaultParameter,
 		hourly: ['wave_height']
 	});
@@ -79,9 +72,19 @@
 		]
 	];
 
-	function locationCallback(event: CustomEvent<GeoLocation>) {
-		$params.latitude = Number(event.detail.latitude.toFixed(4));
-		$params.longitude = Number(event.detail.longitude.toFixed(4));
+	function locationCallback(event: CustomEvent<GeoLocation>, index: number) {
+		const latitude = Number(event.detail.latitude.toFixed(4));
+		const longitude = Number(event.detail.longitude.toFixed(4));
+		$params.latitude = $params.latitude.toSpliced(index, 1, latitude);
+		$params.longitude = $params.longitude.toSpliced(index, 1, longitude);
+	}
+	function addLocation() {
+		$params.latitude = [...$params.latitude, NaN];
+		$params.longitude = [...$params.longitude, NaN];
+	}
+	function removeLocation(index: number) {
+		$params.latitude = $params.latitude.toSpliced(index, 1);
+		$params.longitude = $params.longitude.toSpliced(index, 1);
 	}
 </script>
 
@@ -97,39 +100,60 @@
 <form method="get" action="https://marine-api.open-meteo.com/v1/marine">
 	<div class="row">
 		<h2>Select Coordinates or City</h2>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="latitude"
-					id="latitude"
-					step="0.000001"
-					min="-90"
-					max="90"
-					bind:value={$params.latitude}
-				/>
-				<label for="latitude">Latitude</label>
+		{#each $params.latitude as _, index}
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="latitude"
+						id="latitude"
+						step="0.000001"
+						min="-90"
+						max="90"
+						bind:value={$params.latitude[index]}
+					/>
+					<label for="latitude">Latitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="longitude"
-					id="longitude"
-					step="0.000001"
-					min="-180"
-					max="180"
-					bind:value={$params.longitude}
-				/>
-				<label for="longitude">Longitude</label>
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="longitude"
+						id="longitude"
+						step="0.000001"
+						min="-180"
+						max="180"
+						bind:value={$params.longitude[index]}
+					/>
+					<label for="longitude">Longitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-6">
-			<LocationSearch on:location={locationCallback} />
-		</div>
+			<div class="col-md-5">
+				<LocationSearch on:location={(event) => locationCallback(event, index)} />
+			</div>
+			{#if index == 0}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={addLocation}
+						title="Add coordinates"><PlusLg /></button
+					>
+				</div>
+			{:else}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={() => removeLocation(index)}
+						title="Delete coordinates"><Trash /></button
+					>
+				</div>
+			{/if}
+		{/each}
 	</div>
 	<div class="row py-3 px-0">
 		<h2>Hourly Marine Variables</h2>
diff --git a/src/routes/en/docs/meteofrance-api/+page.svelte b/src/routes/en/docs/meteofrance-api/+page.svelte
index e5b0d065..669480b2 100644
--- a/src/routes/en/docs/meteofrance-api/+page.svelte
+++ b/src/routes/en/docs/meteofrance-api/+page.svelte
@@ -14,6 +14,7 @@
 	import AccordionItem from '$lib/Elements/AccordionItem.svelte';
 	import SveltyPicker from 'svelty-picker';
 	import { slide } from 'svelte/transition';
+	import { PlusLg, Trash } from 'svelte-bootstrap-icons';
 
 	const defaultParameter = {
 		hourly: [],
@@ -31,8 +32,8 @@
 	};
 
 	const params = urlHashStore({
-		latitude: 52.52,
-		longitude: 13.41,
+		latitude: [52.52],
+		longitude: [13.41],
 		...defaultParameter,
 		hourly: ['temperature_2m']
 	});
@@ -167,9 +168,19 @@
 		]
 	];
 
-	function locationCallback(event: CustomEvent<GeoLocation>) {
-		$params.latitude = Number(event.detail.latitude.toFixed(4));
-		$params.longitude = Number(event.detail.longitude.toFixed(4));
+	function locationCallback(event: CustomEvent<GeoLocation>, index: number) {
+		const latitude = Number(event.detail.latitude.toFixed(4));
+		const longitude = Number(event.detail.longitude.toFixed(4));
+		$params.latitude = $params.latitude.toSpliced(index, 1, latitude);
+		$params.longitude = $params.longitude.toSpliced(index, 1, longitude);
+	}
+	function addLocation() {
+		$params.latitude = [...$params.latitude, NaN];
+		$params.longitude = [...$params.longitude, NaN];
+	}
+	function removeLocation(index: number) {
+		$params.latitude = $params.latitude.toSpliced(index, 1);
+		$params.longitude = $params.longitude.toSpliced(index, 1);
 	}
 </script>
 
@@ -188,39 +199,60 @@
 <form method="get" action="https://api.open-meteo.com/v1/meteofrance">
 	<div class="row">
 		<h2>Select Coordinates or City</h2>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="latitude"
-					id="latitude"
-					step="0.000001"
-					min="-90"
-					max="90"
-					bind:value={$params.latitude}
-				/>
-				<label for="latitude">Latitude</label>
+		{#each $params.latitude as _, index}
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="latitude"
+						id="latitude"
+						step="0.000001"
+						min="-90"
+						max="90"
+						bind:value={$params.latitude[index]}
+					/>
+					<label for="latitude">Latitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="longitude"
-					id="longitude"
-					step="0.000001"
-					min="-180"
-					max="180"
-					bind:value={$params.longitude}
-				/>
-				<label for="longitude">Longitude</label>
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="longitude"
+						id="longitude"
+						step="0.000001"
+						min="-180"
+						max="180"
+						bind:value={$params.longitude[index]}
+					/>
+					<label for="longitude">Longitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-6">
-			<LocationSearch on:location={locationCallback} />
-		</div>
+			<div class="col-md-5">
+				<LocationSearch on:location={(event) => locationCallback(event, index)} />
+			</div>
+			{#if index == 0}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={addLocation}
+						title="Add coordinates"><PlusLg /></button
+					>
+				</div>
+			{:else}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={() => removeLocation(index)}
+						title="Delete coordinates"><Trash /></button
+					>
+				</div>
+			{/if}
+		{/each}
 	</div>
 	<div class="row py-3 px-0">
 		<h2>Hourly Weather Variables</h2>
diff --git a/src/routes/en/docs/metno-api/+page.svelte b/src/routes/en/docs/metno-api/+page.svelte
index 5c7139ee..16a0804e 100644
--- a/src/routes/en/docs/metno-api/+page.svelte
+++ b/src/routes/en/docs/metno-api/+page.svelte
@@ -8,6 +8,7 @@
 	import AccordionItem from '$lib/Elements/AccordionItem.svelte';
 	import SveltyPicker from 'svelty-picker';
 	import { slide } from 'svelte/transition';
+	import { PlusLg, Trash } from 'svelte-bootstrap-icons';
 
 	const defaultParameter = {
 		hourly: [],
@@ -23,8 +24,8 @@
 	};
 
 	const params = urlHashStore({
-		latitude: 59.91,
-		longitude: 10.75,
+		latitude: [59.91],
+		longitude: [10.75],
 		...defaultParameter,
 		hourly: ['temperature_2m']
 	});
@@ -81,9 +82,19 @@
 		]
 	];
 
-	function locationCallback(event: CustomEvent<GeoLocation>) {
-		$params.latitude = Number(event.detail.latitude.toFixed(4));
-		$params.longitude = Number(event.detail.longitude.toFixed(4));
+	function locationCallback(event: CustomEvent<GeoLocation>, index: number) {
+		const latitude = Number(event.detail.latitude.toFixed(4));
+		const longitude = Number(event.detail.longitude.toFixed(4));
+		$params.latitude = $params.latitude.toSpliced(index, 1, latitude);
+		$params.longitude = $params.longitude.toSpliced(index, 1, longitude);
+	}
+	function addLocation() {
+		$params.latitude = [...$params.latitude, NaN];
+		$params.longitude = [...$params.longitude, NaN];
+	}
+	function removeLocation(index: number) {
+		$params.latitude = $params.latitude.toSpliced(index, 1);
+		$params.longitude = $params.longitude.toSpliced(index, 1);
 	}
 </script>
 
@@ -102,39 +113,60 @@
 <form method="get" action="https://api.open-meteo.com/v1/metno">
 	<div class="row">
 		<h2>Select Coordinates or City</h2>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="latitude"
-					id="latitude"
-					step="0.000001"
-					min="-90"
-					max="90"
-					bind:value={$params.latitude}
-				/>
-				<label for="latitude">Latitude</label>
+		{#each $params.latitude as _, index}
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="latitude"
+						id="latitude"
+						step="0.000001"
+						min="-90"
+						max="90"
+						bind:value={$params.latitude[index]}
+					/>
+					<label for="latitude">Latitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="longitude"
-					id="longitude"
-					step="0.000001"
-					min="-180"
-					max="180"
-					bind:value={$params.longitude}
-				/>
-				<label for="longitude">Longitude</label>
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="longitude"
+						id="longitude"
+						step="0.000001"
+						min="-180"
+						max="180"
+						bind:value={$params.longitude[index]}
+					/>
+					<label for="longitude">Longitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-6">
-			<LocationSearch on:location={locationCallback} />
-		</div>
+			<div class="col-md-5">
+				<LocationSearch on:location={(event) => locationCallback(event, index)} />
+			</div>
+			{#if index == 0}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={addLocation}
+						title="Add coordinates"><PlusLg /></button
+					>
+				</div>
+			{:else}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={() => removeLocation(index)}
+						title="Delete coordinates"><Trash /></button
+					>
+				</div>
+			{/if}
+		{/each}
 	</div>
 	<div class="row py-3 px-0">
 		<h2>Hourly Weather Variables</h2>
diff --git a/src/routes/en/docs/seasonal-forecast-api/+page.svelte b/src/routes/en/docs/seasonal-forecast-api/+page.svelte
index b94ba9ce..79711b06 100644
--- a/src/routes/en/docs/seasonal-forecast-api/+page.svelte
+++ b/src/routes/en/docs/seasonal-forecast-api/+page.svelte
@@ -6,7 +6,8 @@
 	import { urlHashStore } from '$lib/url-hash-store';
 	import SveltyPicker from 'svelty-picker';
 	import { slide } from 'svelte/transition';
-
+	import { PlusLg, Trash } from 'svelte-bootstrap-icons';
+	
 	const defaultParameter = {
 		six_hourly: [],
 		daily: [],
@@ -23,10 +24,10 @@
 	};
 
 	const params = urlHashStore({
-		latitude: 52.52,
-		longitude: 13.41,
+		latitude: [52.52],
+		longitude: [13.41],
 		...defaultParameter,
-    daily: ['temperature_2m_max']
+    	daily: ['temperature_2m_max']
 	});
 
 	$: endDateInvalid = $params.start_date != null && $params.end_date == null;
@@ -76,9 +77,19 @@
 		]
 	];
 
-	function locationCallback(event: CustomEvent<GeoLocation>) {
-		$params.latitude = Number(event.detail.latitude.toFixed(4));
-		$params.longitude = Number(event.detail.longitude.toFixed(4));
+	function locationCallback(event: CustomEvent<GeoLocation>, index: number) {
+		const latitude = Number(event.detail.latitude.toFixed(4));
+		const longitude = Number(event.detail.longitude.toFixed(4));
+		$params.latitude = $params.latitude.toSpliced(index, 1, latitude);
+		$params.longitude = $params.longitude.toSpliced(index, 1, longitude);
+	}
+	function addLocation() {
+		$params.latitude = [...$params.latitude, NaN];
+		$params.longitude = [...$params.longitude, NaN];
+	}
+	function removeLocation(index: number) {
+		$params.latitude = $params.latitude.toSpliced(index, 1);
+		$params.longitude = $params.longitude.toSpliced(index, 1);
 	}
 </script>
 
@@ -92,39 +103,60 @@
 <form method="get" action="https://seasonal-api.open-meteo.com/v1/seasonal">
 	<div class="row">
 		<h2>Select Coordinates or City</h2>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="latitude"
-					id="latitude"
-					step="0.000001"
-					min="-90"
-					max="90"
-					bind:value={$params.latitude}
-				/>
-				<label for="latitude">Latitude</label>
+		{#each $params.latitude as _, index}
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="latitude"
+						id="latitude"
+						step="0.000001"
+						min="-90"
+						max="90"
+						bind:value={$params.latitude[index]}
+					/>
+					<label for="latitude">Latitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-3">
-			<div class="form-floating mb-3">
-				<input
-					type="number"
-					class="form-control"
-					name="longitude"
-					id="longitude"
-					step="0.000001"
-					min="-180"
-					max="180"
-					bind:value={$params.longitude}
-				/>
-				<label for="longitude">Longitude</label>
+			<div class="col-md-3">
+				<div class="form-floating mb-3">
+					<input
+						type="number"
+						class="form-control"
+						name="longitude"
+						id="longitude"
+						step="0.000001"
+						min="-180"
+						max="180"
+						bind:value={$params.longitude[index]}
+					/>
+					<label for="longitude">Longitude</label>
+				</div>
 			</div>
-		</div>
-		<div class="col-md-6">
-			<LocationSearch on:location={locationCallback} />
-		</div>
+			<div class="col-md-5">
+				<LocationSearch on:location={(event) => locationCallback(event, index)} />
+			</div>
+			{#if index == 0}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={addLocation}
+						title="Add coordinates"><PlusLg /></button
+					>
+				</div>
+			{:else}
+				<div class="col-md-1">
+					<button
+						type="button"
+						class="btn btn-outline-secondary w-100 p-3"
+						on:click={() => removeLocation(index)}
+						title="Delete coordinates"><Trash /></button
+					>
+				</div>
+			{/if}
+		{/each}
 	</div>
 	<div class="row py-3 px-0">
 		<h2>6-Hourly Weather Variables</h2>