Du kannst nicht mehr als 25 Themen auswählen Themen müssen mit entweder einem Buchstaben oder einer Ziffer beginnen. Sie können Bindestriche („-“) enthalten und bis zu 35 Zeichen lang sein.

view_pdf_hsd62437.html 4.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
  5. <meta charset="utf-8">
  6. <title>SIBS 2024</title>
  7. <link rel="stylesheet" href="../node_modules/bootstrap/dist/css/bootstrap.min.css">
  8. <script src="../node_modules/bootstrap/dist/js/bootstrap.min.js" defer></script>
  9. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" integrity="sha512-abc123..." crossorigin="anonymous" />
  10. <link rel="stylesheet" href="../css/app.css">
  11. </head>
  12. <body>
  13. <section class="section" style="max-height: 100vh;">
  14. <div class=""
  15. style="background-color: #1F3F6D; min-height: 50px; display: flex; align-items: center;padding-left: 100px;">
  16. <h6 style="color: white;margin-right: 1em;" class=""><a style="color: white;" href="../details/detail_hsd62437.html"><i
  17. class="fas fa-chevron-left"></i></a></h6>
  18. <h6 style="color: white;">HSD 62437</h6>
  19. </div>
  20. <!-- <div class="text-center pt-5"
  21. style="background-color: white; min-height: 50px; display: flex; justify-content: center; align-items: center; padding-left: 100px;">
  22. <h5 style="font-weight: 500;">Perbadanan Setiausaha Kerajaan Pahang</h5>
  23. </div> -->
  24. <div class="text-center pt-1 pb-5"
  25. style="background-color: white;display: flex; justify-content: center; align-items: center;margin-left: -300px;">
  26. <div class="pt-5 pb-5" style="width: 600px;height: 100px;">
  27. <!-- <img style="border-radius: 20px;" src="image.png" alt=""> -->
  28. <!-- <div id="capture"></div> -->
  29. <div id="pdfViewer"></div>
  30. </div>
  31. </div>
  32. <script src="../js/jquery-3.7.1.js" defer></script>
  33. <script src="../js/pdfjs-viewer.js" defer></script>
  34. <script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.6.347/pdf.min.js"
  35. integrity="sha512-Z8CqofpIcnJN80feS2uccz+pXWgZzeKxDsDNMD/dJ6997/LSRY+W4NmEt9acwR+Gt9OHN0kkI1CTianCwoqcjQ=="
  36. crossorigin="anonymous" referrerpolicy="no-referrer" defer></script>
  37. </section>
  38. <!-- <div id="map"></div> -->
  39. <script>
  40. var map;
  41. var src = 'https://dev.suite.psk.gov.my/kml/HSD%2062437.kml';
  42. function initMap() {
  43. map = new google.maps.Map(document.getElementById('map'), {
  44. center: new google.maps.LatLng(-19.257753, 146.823688),
  45. zoom: 2,
  46. mapTypeId: 'satellite'
  47. });
  48. var kmlLayer = new google.maps.KmlLayer(src, {
  49. suppressInfoWindows: true,
  50. preserveViewport: false,
  51. map: map
  52. });
  53. }
  54. document.addEventListener('DOMContentLoaded', () => {
  55. // PDF.js script to render PDF
  56. const pdfUrl = '../HSD_62437.pdf'; // Replace with your PDF URL
  57. const pdfjsLib = window['pdfjs-dist/build/pdf'];
  58. pdfjsLib.GlobalWorkerOptions.workerSrc = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.6.347/pdf.worker.min.js';
  59. pdfjsLib.getDocument(pdfUrl).promise.then(function (pdf) {
  60. pdf.getPage(1).then(function (page) {
  61. const scale = 1.5;
  62. const viewport = page.getViewport({ scale });
  63. const canvas = document.createElement('canvas');
  64. const context = canvas.getContext('2d');
  65. canvas.height = viewport.height;
  66. canvas.width = viewport.width;
  67. const renderContext = {
  68. canvasContext: context,
  69. viewport: viewport
  70. };
  71. page.render(renderContext);
  72. document.getElementById('pdfViewer').appendChild(canvas);
  73. });
  74. });
  75. })
  76. </script>
  77. <script async
  78. src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCj5eAmQOg6IhdABVPCBT6ubZ3Yj_IWejI&callback=initMap">
  79. </script>
  80. </body>
  81. </html>