{"id":139,"date":"2019-02-12T07:05:15","date_gmt":"2019-02-12T00:05:15","guid":{"rendered":"http:\/\/www.indokreatif.net\/blog\/?p=139"},"modified":"2019-02-12T07:13:17","modified_gmt":"2019-02-12T00:13:17","slug":"leaflet-deepzoom","status":"publish","type":"post","link":"https:\/\/www.indokreatif.net\/blog\/2019\/02\/leaflet-deepzoom\/","title":{"rendered":"Leaflet-DeepZoom"},"content":{"rendered":"\n<p>Ini adalah plugin yang beberapa tahun lalu pernah kami buat untuk keperluan satu pekerjaan. Di antara kebutuhan pekerjaannya adalah :<\/p>\n\n\n\n<ol class=\"wp-block-list\"><li>Membuat gambar stasiun gas bumi.<\/li><li>Gambar (yang sudah dalam format 2D beresolusi tinggi) bisa di-zoom, sehingga komponen peralatan seperti pipa, tangki, valve dll dapat terlihat jelas.<\/li><li>Jika gambar peralatan di-klik bisa terlihat nama dan deskripsinya.<\/li><li>Fitur pencarian lokasi peralatan tertentu, kemudian langsung fokus dan zoom peralatan tersebut.<\/li><li>Sistem berbasis Web<\/li><\/ol>\n\n\n\n<p>Ketika itu yang terbersit adalah : mirip Google Maps, hanya saja bukan peta jalan, tapi Stasiun Gas Bumi.<\/p>\n\n\n\n<!--more-->\n\n\n\n<p>Akhirnya pilihan jatuh dengan menggabungkan Leaflet + DeepZoom tiles. Leaflet merupakan JavaScript library untuk keperluan menampilkan peta. Lalu, dengan format DeepZoom gambar akan di-scale, dipecah-pecah dan ditampilkan sesuai level zoom-nya. Hasilnya mirip seperti google maps yang biasa kita gunakan.<\/p>\n\n\n\n<p>Beberapa tahun lalu plugin Leaflet-DeepZoom hanya mendukung versi Leaflet 0.7.<br>Sekarang sudah bisa digunakan pada versi Leaflet 1.2 terbaru.<\/p>\n\n\n\n<p>Bisa dilihat dan di-download di <a href=\"https:\/\/github.com\/alfarisi\/leaflet-deepzoom\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\"GitHub (opens in a new tab)\">GitHub<\/a>.<\/p>\n\n\n\n<p>Pada file example.html ada contoh sederhana penggunaannya. Selanjutnya bisa dikembangkan sesuai kebutuhan.<\/p>\n<!-- AddThis Advanced Settings generic via filter on the_content --><!-- AddThis Share Buttons generic via filter on the_content -->","protected":false},"excerpt":{"rendered":"<p>Ini adalah plugin yang beberapa tahun lalu pernah kami buat untuk keperluan satu pekerjaan. Di antara kebutuhan pekerjaannya adalah : Membuat gambar stasiun gas bumi. Gambar (yang sudah dalam format 2D beresolusi tinggi) bisa di-zoom, sehingga komponen peralatan seperti pipa, &hellip;<\/p>\n<p class=\"read-more\"><a href=\"https:\/\/www.indokreatif.net\/blog\/2019\/02\/leaflet-deepzoom\/\">Read more &raquo;<\/a><\/p>\n<p><!-- AddThis Advanced Settings generic via filter on get_the_excerpt --><!-- AddThis Share Buttons generic via filter on get_the_excerpt --><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4],"tags":[25,26,24],"class_list":["post-139","post","type-post","status-publish","format-standard","hentry","category-produk-layanan","tag-deepzoom","tag-gas-and-oil","tag-leaflet"],"_links":{"self":[{"href":"https:\/\/www.indokreatif.net\/blog\/wp-json\/wp\/v2\/posts\/139","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.indokreatif.net\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.indokreatif.net\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.indokreatif.net\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.indokreatif.net\/blog\/wp-json\/wp\/v2\/comments?post=139"}],"version-history":[{"count":0,"href":"https:\/\/www.indokreatif.net\/blog\/wp-json\/wp\/v2\/posts\/139\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.indokreatif.net\/blog\/wp-json\/wp\/v2\/media?parent=139"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.indokreatif.net\/blog\/wp-json\/wp\/v2\/categories?post=139"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.indokreatif.net\/blog\/wp-json\/wp\/v2\/tags?post=139"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}