Graph.html

<!DOCTYPE html>

<head>
    <meta charset="utf-8">

    <title></title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="styles.css">
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/chart.js@2.8.0"></script>

</head>

<body>


    <div id="app">


        <div class="dash Wrapper">

            <!-- menu  -->
            <div class="menu">
                <!-- menu Title  -->
                <h2 class="menuTitle">The Online Diary</h2>
                <!-- Hamburger menu button with javascript method showMenu() -->
                <a href="javascript:void(0);" v-on:click="showMenu()" class="icon" onclick="myFunction()">
                    <i class="fa fa-bars"></i>
                </a>
                <!-- items in menu nav -->
                <div id="menuItems">
                    <li><i class="fas fa-search"></i><input class="search" type="text" placeholder="Search"></a></li>
                    <li><i class="fas fa-home"></i><a href="index.html">Home</a></li>
                    <li><i class="fas fa-book-open"></i><a href="All.html">All Entries</a></li>
                    <li><i class="fas fa-chart-line"></i><a href="Graph.html">Graphs</a></li>
                    <li><i class="fas fa-address-book"></i><a href="Contact.html">Contact</a></li>
                </div>
            </div>

            <div class="main">
                <h1>Emotional Graph</h1>
                <canvas id="myChart"></canvas>
            </div>
            <div class="graph">

                
            </div>
        </div>
    </div>
    <script src="/my.js"></script>

    <script>

    </script>

</body>

</html>