diff --git a/app/README.md b/app/README.md
new file mode 100644
index 0000000..5613fc8
--- /dev/null
+++ b/app/README.md
@@ -0,0 +1,4 @@
+# Install
+
+* First go to the `/js` directory in the root of the PMTiles repository and `npm install`
+* `npm run dev` to start the app on port 3000
\ No newline at end of file
diff --git a/app/src/App.tsx b/app/src/App.tsx
index a94753d..494b351 100644
--- a/app/src/App.tsx
+++ b/app/src/App.tsx
@@ -59,6 +59,7 @@ function App() {
 
   let [errorDisplay, setErrorDisplay] = useState<string | undefined>();
   let [file, setFile] = useState<PMTiles | undefined>();
+  let [mapHashPassed, setMapHashPassed] = useState<boolean>(false);
 
   // initial load
   useEffect(() => {
@@ -67,6 +68,9 @@ function App() {
       let initialValue = new PMTiles(loadUrl);
       setFile(initialValue);
     }
+    if (location.hash.includes("map")) {
+      setMapHashPassed(true);
+    }
   }, []);
 
   useEffect(() => {
@@ -110,7 +114,11 @@ function App() {
           </GithubA>
         </GithubLink>
       </Header>
-      {file ? <Loader file={file} /> : <Start setFile={setFile} />}
+      {file ? (
+        <Loader file={file} mapHashPassed={mapHashPassed} />
+      ) : (
+        <Start setFile={setFile} />
+      )}
       <DialogPrimitive.Root open={errorDisplay !== undefined}>
         <DialogPrimitive.Portal>
           <StyledOverlay />
diff --git a/app/src/Loader.tsx b/app/src/Loader.tsx
index b4be520..53e6958 100644
--- a/app/src/Loader.tsx
+++ b/app/src/Loader.tsx
@@ -70,12 +70,14 @@ const ToolbarLink = StyledLink;
 const ToolbarToggleGroup = StyledToggleGroup;
 const ToolbarToggleItem = StyledToggleItem;
 
-function Loader(props: { file: PMTiles }) {
+function Loader(props: { file: PMTiles; mapHashPassed: boolean }) {
   let [tab, setTab] = useState("maplibre");
 
   let view;
   if (tab === "maplibre") {
-    view = <MaplibreMap file={props.file} />;
+    view = (
+      <MaplibreMap file={props.file} mapHashPassed={props.mapHashPassed} />
+    );
   } else if (tab === "inspector") {
     view = <Inspector file={props.file} />;
   } else {
diff --git a/app/src/MaplibreMap.tsx b/app/src/MaplibreMap.tsx
index 1d03e32..5bea633 100644
--- a/app/src/MaplibreMap.tsx
+++ b/app/src/MaplibreMap.tsx
@@ -319,7 +319,7 @@ const vectorStyle = async (file: PMTiles): Promise<any> => {
   };
 };
 
-function MaplibreMap(props: { file: PMTiles }) {
+function MaplibreMap(props: { file: PMTiles; mapHashPassed: boolean }) {
   let mapContainerRef = useRef<HTMLDivElement>(null);
   let [hamburgerOpen, setHamburgerOpen] = useState<boolean>(true);
   let [showAttributes, setShowAttributes] = useState<boolean>(false);
@@ -437,11 +437,7 @@ function MaplibreMap(props: { file: PMTiles }) {
       if (mapRef.current) {
         let map = mapRef.current;
         let header = await props.file.getHeader();
-        if (
-          map.getCenter().lng === INITIAL_LNG &&
-          map.getCenter().lat == INITIAL_LAT &&
-          map.getZoom() === INITIAL_ZOOM
-        ) {
+        if (!props.mapHashPassed) {
           // the map hash was not passed, so auto-detect the initial viewport based on metadata
           map.fitBounds(
             [