why the other chart doesnt appear?

I want to make 2 charts, it is "gender chart" and "fakultas chart", but when I try to code like this, just one chart that appeared, what should I do so that all chart will be appearing?

my code is like this

JAVASCRIPT CODE

$(document).ready(function(){
    $.ajax({
        url: "http://localhost/chartjs/data.php",
        method: "GET",
        success: function(data) {
            console.log(data);
            var Gender = [];
            var jumlah = [];
            var Fakultas = [];
            var jumlah_orang = [];

            for(var i in data)
            {
                //Gender.push("Gender " + data[i].JenisKelaminID);
                if(data[i].JenisKelaminID == 1)
                {
                    Gender.push("Men");
                } 
                else if(data[i].JenisKelaminID == 2)
                {
                    Gender.push("Women");
                } 
                else 
                {
                Gender.push("Other");
                }

                jumlah.push(data[i].jumlah);

                Fakultas.push(data[i].Fakultas);
                jumlah_orang.push(data[i].jumlah_orang);

            }

            var chartdata = {
                labels: Gender,
                datasets: [
                    {
                        label : 'Total',
                        backgroundColor: [
                            'rgba(79, 181, 59, 1)', //green for men
                            'rgba(239, 87, 196, 1)', //pink for women
                            'rgba(166, 160, 164, 1)', //grey for other
],
                        borderColor: 'rgba(200, 200, 200, 0.75)',
                        hoverBackgroundColor: 'rgba(200, 200, 200, 1)',
                        hoverBorderColor: 'rgba(200, 200, 200, 1)',
                        data: jumlah
                    }
                ]

            };

            var chartdata2 = {
                labels: Fakultas,
                datasets: [
                    {
                        label : 'Total',
                        backgroundColor: [
                            'rgba(79, 181, 59, 1)',
                            'rgba(239, 87, 196, 1)', 
                            'rgba(166, 160, 164, 1)', 
                            'rgba(16, 60, 64, 1)', 
                            'rgba(66, 16, 164, 1)', 
                            'rgba(77, 18, 74, 1)', 
                            'rgba(6, 60, 64, 1)', 
                            'rgba(86, 10, 64, 1)', 
],
                        borderColor: 'rgba(200, 200, 200, 0.75)',
                        hoverBackgroundColor: 'rgba(200, 200, 200, 1)',
                        hoverBorderColor: 'rgba(200, 200, 200, 1)',
                        data: jumlah
                    }
                ]

            };



            var ctx = $("#mycanvas");
            var ctx2 = $("mycanvas2")

            var barGraph = new Chart(ctx, {
                type: 'bar',
                data: chartdata

            });

            var barGraph2 = new Chart(ctx2, {
                type: 'bar',
                data: chartdata2

            });
        },
        error: function(data) {
            console.log(data);
        }
    });
});

MY PHP CODE

<?php
//setting header to json
header('Content-Type: application/json');

//database
define('DB_HOST', '127.0.0.1');
define('DB_USERNAME', 'root');
define('DB_PASSWORD', '');
define('DB_NAME', 'dbintegrasi');

//get connection
$mysqli = new mysqli(DB_HOST, DB_USERNAME, DB_PASSWORD, DB_NAME);
if(!$mysqli){
    die("Connection failed: " . $mysqli->error);
}

//query to get data from the table
$query = sprintf("SELECT JenisKelaminID, COUNT(JenisKelaminID) as jumlah FROM tahunmasukmagister GROUP BY JenisKelaminID");
$query2 = sprintf("SELECT FAKULTAS, COUNT(FAKULTAS) as jumlah_orang FROM s2view GROUP BY FAKULTAS");

//execute query
$result = $mysqli->query($query);
$result2 = $mysqli->query($query2);

//loop through the returned data
$data = array();
foreach ($result as $row){
    $data[] = $row;
}

foreach ($result2 as $row){
    $data[] = $row;
}

//freee memory associated with result
$result->close();
$result2->close();

//close connection
$mysqli->close();

//new print the data
print json_encode($data);

MY HTML CODE

<!DOCTYPE html>
<html>

<head>


    <title>Chart JS Graph Examples</title>

    <!-- Bootstrsap -->
    <link href="vendors/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">

</head>


    <!-- <head>
        <title>ChartJS - BarGraph</title>
        <style type="text/css">
            #chart-container {
                width: 640px;
                height: auto;
            }
        </style>
    </head> -->

<body>

    <div class="container body">

        <div class="col-md-6 left_col">
          <div class="left_col scroll-view">

              <a href="index.html" class="site_title"><span>Pascasarjana Dalam Angka IPB</span></a>
            </div>
        <div class="clearfix"></div>



    <div id="chart-container">
        <br><br>
        <a class="site_title"><span>Bar Chart</span></a>
        <canvas id="mycanvas"></canvas>
    </div>

    <div id="chart-container2">

        <canvas id="mycanvas2"></canvas>
    </div>


    <!-- javascript -->
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/Chart.min.js"></script>
    <script type="text/javascript" src="js/app.js"></script>
    </body>
</html>

please help me to solve that problem. thankyou