muqriz
/
SIBS2024


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111
							<!DOCTYPE html>
<html>

<head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <title>SIBS 2024</title>
    <link rel="stylesheet" href="../node_modules/bootstrap/dist/css/bootstrap.min.css">
    <script src="../node_modules/bootstrap/dist/js/bootstrap.min.js" defer></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" integrity="sha512-abc123..." crossorigin="anonymous" />
    <link rel="stylesheet" href="../css/app.css">

</head>

<body>

    <section class="section" style="max-height: 100vh;">

        <div class=""
            style="background-color: #1F3F6D; min-height: 50px; display: flex; align-items: center;padding-left: 100px;">
            <h6 style="color: white;margin-right: 1em;" class=""><a style="color: white;" href="../details/detail_hsm1909.html"><i
                        class="fas fa-chevron-left"></i></a></h6>
            <h6 style="color: white;">HSM 1909</h6>
        </div>

        <!-- <div class="text-center pt-5"
            style="background-color: white; min-height: 50px; display: flex; justify-content: center; align-items: center; padding-left: 100px;">
            <h5 style="font-weight: 500;">Perbadanan Setiausaha Kerajaan Pahang</h5>

        </div> -->

        <div class="text-center pt-1 pb-5"
            style="background-color: white;display: flex; justify-content: center; align-items: center;margin-left: -300px;">
            <div class="pt-5 pb-5" style="width: 600px;height: 100px;">
                <!-- <img style="border-radius: 20px;" src="image.png" alt=""> -->

                <!-- <div id="capture"></div> -->
                <div id="pdfViewer"></div>


            </div>
        </div>


        <script src="../js/jquery-3.7.1.js" defer></script>

        <script src="../js/pdfjs-viewer.js" defer></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.6.347/pdf.min.js"
            integrity="sha512-Z8CqofpIcnJN80feS2uccz+pXWgZzeKxDsDNMD/dJ6997/LSRY+W4NmEt9acwR+Gt9OHN0kkI1CTianCwoqcjQ=="
            crossorigin="anonymous" referrerpolicy="no-referrer" defer></script>

    </section>


    <!-- <div id="map"></div> -->

    <script>
        var map;
        var src = 'https://dev.suite.psk.gov.my/kml/HSM%201909.kml';

        function initMap() {
            map = new google.maps.Map(document.getElementById('map'), {
                center: new google.maps.LatLng(-19.257753, 146.823688),
                zoom: 2,
                mapTypeId: 'satellite'
            });

            var kmlLayer = new google.maps.KmlLayer(src, {
                suppressInfoWindows: true,
                preserveViewport: false,
                map: map
            });
        }

        document.addEventListener('DOMContentLoaded', () => {
            // PDF.js script to render PDF
            const pdfUrl = '../HSM_1909.pdf'; // Replace with your PDF URL
            const pdfjsLib = window['pdfjs-dist/build/pdf'];
            pdfjsLib.GlobalWorkerOptions.workerSrc = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.6.347/pdf.worker.min.js';

            pdfjsLib.getDocument(pdfUrl).promise.then(function (pdf) {
                pdf.getPage(1).then(function (page) {
                    const scale = 1.5;
                    const viewport = page.getViewport({ scale });

                    const canvas = document.createElement('canvas');
                    const context = canvas.getContext('2d');
                    canvas.height = viewport.height;
                    canvas.width = viewport.width;

                    const renderContext = {
                        canvasContext: context,
                        viewport: viewport
                    };

                    page.render(renderContext);
                    document.getElementById('pdfViewer').appendChild(canvas);
                });
            });

        })

    </script>
    <script async
        src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCj5eAmQOg6IhdABVPCBT6ubZ3Yj_IWejI&callback=initMap">
        </script>

</body>

</html>