diff --git a/UI/BigComponents/RightControls.ts b/UI/BigComponents/RightControls.ts
index ec2723210..3de47a3ee 100644
--- a/UI/BigComponents/RightControls.ts
+++ b/UI/BigComponents/RightControls.ts
@@ -4,9 +4,7 @@ import MapControlButton from "../MapControlButton";
 import GeoLocationHandler from "../../Logic/Actors/GeoLocationHandler";
 import Svg from "../../Svg";
 import MapState from "../../Logic/State/MapState";
-import {VariableUiElement} from "../Base/VariableUIElement";
 import LevelSelector from "../Input/LevelSelector";
-import {UIEventSource} from "../../Logic/UIEventSource";
 import FeaturePipeline from "../../Logic/FeatureSource/FeaturePipeline";
 import {Utils} from "../../Utils";
 
@@ -50,6 +48,7 @@ export default class RightControls extends Combine {
             const allElements = state.featurePipeline.GetAllFeaturesAndMetaWithin(bbox);
             const allLevelsRaw: string[] = [].concat(...allElements.map(allElements => allElements.features.map(f => <string>f.properties["level"])))
             const allLevels = [].concat(...allLevelsRaw.map(l => LevelSelector.LevelsParser(l)))
+            allLevels.sort((a,b) => a < b ? -1 : 1)
             return Utils.Dedup(allLevels)
         })
         const levelSelect = new LevelSelector(levelsInView)
diff --git a/UI/Input/LevelSelector.ts b/UI/Input/LevelSelector.ts
index 82e945809..2c5e6a4cf 100644
--- a/UI/Input/LevelSelector.ts
+++ b/UI/Input/LevelSelector.ts
@@ -1,60 +1,59 @@
 import {InputElement} from "./InputElement";
-import {Store, UIEventSource} from "../../Logic/UIEventSource";
+import {Store, Stores, UIEventSource} from "../../Logic/UIEventSource";
 import Combine from "../Base/Combine";
 import Slider from "./Slider";
 import {ClickableToggle} from "./Toggle";
 import {FixedUiElement} from "../Base/FixedUiElement";
 import {Utils} from "../../Utils";
+import {VariableUiElement} from "../Base/VariableUIElement";
 
-export default class LevelSelector extends Combine implements InputElement<string>{
-    
-    private readonly _value : UIEventSource<string>;
-    
-    constructor(currentLevels: Store<string[]>, options?:{
+export default class LevelSelector extends VariableUiElement implements InputElement<string> {
+
+    private readonly _value: UIEventSource<string>;
+
+    constructor(currentLevels: Store<string[]>, options?: {
         value?: UIEventSource<string>
     }) {
+        const value = options?.value ?? new UIEventSource<string>(undefined)
+        super(Stores.ListStabilized(currentLevels).map(levels => {
+            let slider = new Slider(0, levels.length - 1, {vertical: true});
+            slider.SetClass("flex m-1 elevatorslider mb-0 mt-8").SetStyle("height: " + 2.5 * levels.length + "rem ")
+            const toggleClass = "flex border-2 border-blue-500 w-10 h-10 place-content-center items-center"
+            const values = levels.map((data, i) => new ClickableToggle(
+                new FixedUiElement(data).SetClass("active bg-subtle " + toggleClass), new FixedUiElement(data).SetClass(toggleClass), slider.GetValue().sync(
+                    (sliderVal) => {
+                        return sliderVal === i
+                    },
+                    [],
+                    (isSelected) => {
+                        return isSelected ? i : slider.GetValue().data
+                    }
+                ))
+                .ToggleOnClick()
+                .SetClass("flex flex-column ml-5 bg-slate-200 w-10 h-10 valuesContainer"))
 
-        const testData = ["-1", "0", "0.5", "1", "1.5", "2"]
-        let slider = new Slider(0, testData.length - 1, {vertical: true});
-        slider.SetClass("flex m-1 elevatorslider mb-0 mt-8").SetStyle("height: "+2.5*testData.length+"rem ")
-        const toggleClass = "flex border-2 border-blue-500 w-10 h-10 place-content-center items-center"
-        const values = testData.map((data, i) => new ClickableToggle(
-            new FixedUiElement(data).SetClass("active bg-subtle " + toggleClass), new FixedUiElement(data).SetClass(toggleClass), slider.GetValue().sync(
-                (sliderVal) => {
-                    return sliderVal === i
-                },
-                [],
-                (isSelected) => {
-                    return isSelected ? i : slider.GetValue().data
+            const combine = new Combine([new Combine(values).SetClass("mt-8"), slider])
+            combine.SetClass("flex flex-row h-14");
+
+            slider.GetValue().addCallbackAndRun(i => {
+                if (currentLevels?.data === undefined) {
+                    return
                 }
-            ))
-            .ToggleOnClick()
-            .SetClass("flex flex-column ml-5 bg-slate-200 w-10 h-10 valuesContainer"))
+                value.setData(currentLevels?.data[i]);
+            })
+            value.addCallback(level => {
+                const i = currentLevels?.data?.findIndex(l => l === level)
+                slider.GetValue().setData(i)
+            })
+            return combine
+        }))
 
-        super([new Combine(values.reverse()).SetClass("mt-8"), slider])
-        this.SetClass("flex flex-row h-14");
-        
-        const value = this._value = options?.value ?? new UIEventSource<string>(undefined)
-        slider.GetValue().addCallbackAndRun(i => {
-            if(currentLevels?.data === undefined){
-                return
-            }
-            value.setData(currentLevels?.data[i]);
-        })
-        value.addCallback(level => {
-            const i = currentLevels?.data?.findIndex(l => l === level)
-            slider.GetValue().setData(i)
-        })
     }
 
     GetValue(): UIEventSource<string> {
         return this._value;
     }
 
-    protected InnerConstructElement(): HTMLElement {
-        return undefined;
-    }
-
     IsValid(t: string): boolean {
         return false;
     }
@@ -62,7 +61,7 @@ export default class LevelSelector extends Combine implements InputElement<strin
 
     /**
      * Parses a level specifier to the various available levels
-     * 
+     *
      * LevelSelector.LevelsParser("0") // => ["0"]
      * LevelSelector.LevelsParser("1") // => ["1"]
      * LevelSelector.LevelsParser("0;2") // => ["0","2"]
@@ -74,21 +73,21 @@ export default class LevelSelector extends Combine implements InputElement<strin
         spec = [].concat(...spec.map(s => s.split(";")))
         spec = [].concat(...spec.map(s => {
             s = s.trim()
-            if(s.indexOf("-") < 0){
+            if (s.indexOf("-") < 0) {
                 return s
             }
             const [start, end] = s.split("-").map(s => Number(s.trim()))
-            if(isNaN(start) || isNaN(end)){
+            if (isNaN(start) || isNaN(end)) {
                 return undefined
             }
             const values = []
             for (let i = start; i <= end; i++) {
-                values.push(i+"")
+                values.push(i + "")
             }
             return values
         }))
         return Utils.NoNull(spec);
     }
-    
-    
+
+
 }
\ No newline at end of file