Minimap Навигация по сайту

Question

Я пытаюсь создать сайт, который будет структурирован как игра «сокровищ-квест»: пользователь будет перемещаться между страницами, как в этих книгах, где вы являетесь героем, и можете прыгать между страницами.

Так что это всего лишь вопрос ссылок, которые приведут к странице.

Но то, что я хотел бы сделать, это создать мини-карту, которая покажет пользователю, где он может идти дальше, но прежде всего покажет ему, какие пути он уже сделал!

Я думал о том, чтобы использовать файлы cookie, чтобы хранить информацию о посещенных страницах, а затем загружать определенный SVG, показывающий правильные пути в соответствии с этими данными.

Bu, так как я никогда не использовал файлы cookie раньше (и Javascript в значительной степени неизвестен мне), я хотел знать, может ли это быть правильным решением, или если есть лучший вариант для меня.

Я приложил быстрый рисунок того, что я хочу добиться, чтобы прояснить этот вопрос:

Большое спасибо заранее, я бы очень ценю вашу помощь!

Answer 1

Использование локального хранилища было бы целесообразным. Всякий раз, когда вы хотите сохранить что-то, доступное со всего веб-сайта, и сохраняется даже при закрытии браузера, вы должны использовать локальное хранилище.

Чистый путь будет держать эту информацию в виде массива JSON:

// Populate this array each time you visit a page 
var pages = ['page1', 'page2']; 
// Store them as a stringified array 
localStorage.setItem("pagesVisited", JSON.stringify(pages)); 

Затем, когда вам нужно, чтобы достичь этой информации, анализировать его:

var pagesObject = JSON.parse(localStorage.getItem("pagesVisited")); 

Таким образом, вы всегда будете есть объект, который запоминает, что происходит на каждой странице.