Định vị địa lý
Bản đồ vùng nguyên liệu Bến Tre & Tiền Giang
Bản đồ thể hiện vị trí các vùng nguyên liệu của Bentrecorp tại Bến Tre và Tiền Giang, được đối chiếu theo danh sách xã cũ để hiển thị gần đúng và dễ tra cứu hơn.
.bt-map-wrapper { position: relative; border-radius: var(–bt-radius); overflow: hidden; box-shadow: var(–bt-shadow); border: 1px solid var(–bt-line); background: var(–bt-white); }.bt-map-toolbar { display: flex; flex-wrap: wrap; gap: .5rem; padding: .75rem 1rem; background: var(–bt-mist); border-bottom: 1px solid var(–bt-line); align-items: center; justify-content: space-between; }.bt-map-toolbar__title { font-weight: 700; color: var(–bt-blue-dark); font-size: .9rem; margin: 0; }.bt-map-toolbar__btns { display: flex; gap: .4rem; flex-wrap: wrap; }.bt-map-filter-btn { border: 1px solid var(–bt-line); background: var(–bt-white); color: var(–bt-ink); font-size: .82rem; font-weight: 600; padding: .35rem .75rem; border-radius: 20px; cursor: pointer; transition: all var(–bt-transition); }.bt-map-filter-btn:hover, .bt-map-filter-btn.active { background: var(–bt-blue-dark); color: var(–bt-white); border-color: var(–bt-blue-dark); }.bt-map-filter-btn–bt.active { background: var(–bt-green); border-color: var(–bt-green); }.bt-map-filter-btn–tg.active { background: var(–bt-gold); border-color: var(–bt-gold); color: var(–bt-blue-dark); }#bt-raw-material-map { width: 100%; height: 480px; z-index: 1; }@media (max-width: 768px) { #bt-raw-material-map { height: 380px; } }.bt-custom-pin { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); box-shadow: 0 3px 8px rgba(0,0,0,0.3); border: 2px solid #fff; cursor: pointer; }.bt-custom-pin__inner { transform: rotate(45deg); font-weight: 800; font-size: 13px; color: #fff; line-height: 1; }.bt-custom-pin–bt { background: #3E7C4A; }.bt-custom-pin–tg { background: #C9A24B; }.bt-map-popup { max-width: 260px; font-family: var(–bt-font); line-height: 1.45; }.bt-map-popup h4 { margin: 0 0 .25rem; font-size: .95rem; color: #0B3D3A; font-weight: 700; }.bt-map-popup__tag { display: inline-block; font-size: .72rem; font-weight: 700; padding: .15rem .45rem; border-radius: 4px; color: #fff; margin-bottom: .35rem; }.bt-map-popup__tag–bt { background: #3E7C4A; }.bt-map-popup__tag–tg { background: #C9A24B; color: #0B3D3A; }.bt-map-popup__loc { margin: 0 0 .35rem; font-size: .88rem; font-weight: 600; color: #16211F; }.bt-map-popup__desc { margin: 0 0 .6rem; font-size: .82rem; color: #4A5A56; }.bt-map-popup__btn { display: inline-block; background: #0B3D3A; color: #fff !important; font-size: .78rem; font-weight: 600; padding: .3rem .6rem; border-radius: 4px; text-decoration: none; }.bt-map-legend { display: flex; flex-wrap: wrap; gap: 1.25rem; padding: .75rem 1rem; background: #fff; border-top: 1px solid var(–bt-line); font-size: .85rem; }.bt-map-legend__item { display: flex; align-items: center; gap: .45rem; }.bt-map-legend__dot { width: 12px; height: 12px; border-radius: 50%; display: inline-block; }.bt-map-legend__dot–bt { background: #3E7C4A; }.bt-map-legend__dot–tg { background: #C9A24B; }.bt-zone-cards-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1rem; margin-top: 1.5rem; }.bt-zone-card { background: var(–bt-white); border: 1px solid var(–bt-line); border-radius: var(–bt-radius-sm); padding: 1rem; box-shadow: var(–bt-shadow); cursor: pointer; transition: transform var(–bt-transition), border-color var(–bt-transition); }.bt-zone-card:hover { transform: translateY(-2px); border-color: var(–bt-green); }.bt-zone-card–tg:hover { border-color: var(–bt-gold); }.bt-zone-card__header { display: flex; justify-content: space-between; align-items: center; margin-bottom: .4rem; }.bt-zone-card__code { font-weight: 700; font-size: .82rem; color: var(–bt-blue-dark); }.bt-zone-card__title { font-weight: 700; font-size: .95rem; margin: 0 0 .25rem; color: var(–bt-ink); }.bt-zone-card__loc { font-size: .88rem; color: var(–bt-ink-soft); margin: 0 0 .4rem; font-weight: 600; }.bt-zone-card__note { font-size: .8rem; color: var(–bt-ink-soft); margin: 0; }
Cụm Bến Tre: 5 vùng trồng (Huyện Bình Đại — 226,86 ha)
Cụm Tiền Giang: 4 vùng trồng (Huyện Châu Thành — 210,83 ha)
Vùng trồng dừa 01
Xã Long Định – Huyện Bình Đại – Bến Tre
Vùng dừa xiêm xanh chuyên canh • Tọa độ xã cũ: 10.2542, 106.5167
Vùng trồng dừa 02
Xã Tam Hiệp – Huyện Bình Đại – Bến Tre
Cù lao Tam Hiệp sông Tiền (Dừa – Tôm – Mật) • Tọa độ: 10.2892, 106.4883
Vùng trồng dừa 03
Xã Phú Thuận – Huyện Bình Đại – Bến Tre
Vùng dừa nước ngọt phù sa hạ lưu sông Tiền • Tọa độ: 10.2386, 106.5539
Vùng trồng dừa 04
Xã Châu Hưng – Huyện Bình Đại – Bến Tre
Vùng dừa liên kết nông hộ bền vững • Tọa độ: 10.2203, 106.5361
Vùng trồng dừa 05
Xã Vang Quới Tây – Huyện Bình Đại – Bến Tre
Vùng dừa nguyên liệu xuất khẩu • Tọa độ: 10.2131, 106.5847
Vùng trồng dừa 06
Xã Bình Trưng – Huyện Châu Thành – Tiền Giang
Vùng dừa liên kết 40 hộ nông dân • Tọa độ: 10.3719, 106.2783
Vùng trồng dừa 07
Xã Dưỡng Điềm – Huyện Châu Thành – Tiền Giang
Vùng dừa xiêm chất lượng cao Tiền Giang • Tọa độ: 10.3861, 106.2572
Vùng trồng dừa 08
Ấp Trung – Ấp Ngươn, Xã Đông Hòa – Huyện Châu Thành – Tiền Giang
Vùng dừa chuyên canh ấp Trung & Ngươn • Tọa độ: 10.3928, 106.2936
Vùng trồng dừa 09
Ấp Thới – Ấp Đông A, Xã Đông Hòa – Huyện Châu Thành – Tiền Giang
Vùng dừa chuyên canh ấp Thới & Đông A • Tọa độ: 10.3992, 106.3061
var btMapInstance = null;var btMapMarkers = [];var btZones = [{“id”:1,”code”:”BENTRECORP 01″,”name”:”Vùng trồng dừa 01″,”loc”:”Xã Long Định – Huyện Bình Đại – Bến Tre”,”desc”:”Vùng dừa xiêm xanh chuyên canh huyện Bình Đại. Tọa độ trung tâm xã cũ đại diện.”,”lat”:10.2542,”lng”:106.5167,”prov”:”bt”,”qr”:”vung-trong-01″},{“id”:2,”code”:”BENTRECORP 02″,”name”:”Vùng trồng dừa 02″,”loc”:”Xã Tam Hiệp – Huyện Bình Đại – Bến Tre”,”desc”:”Cù lao Tam Hiệp trên sông Tiền — mô hình Dừa – Tôm – Mật.”,”lat”:10.2892,”lng”:106.4883,”prov”:”bt”,”qr”:”vung-trong-02″},{“id”:3,”code”:”BENTRECORP 03″,”name”:”Vùng trồng dừa 03″,”loc”:”Xã Phú Thuận – Huyện Bình Đại – Bến Tre”,”desc”:”Vùng dừa nước ngọt phù sa hạ lưu sông Tiền. Tọa độ trung tâm xã cũ đại diện.”,”lat”:10.2386,”lng”:106.5539,”prov”:”bt”,”qr”:”vung-trong-03″},{“id”:4,”code”:”BENTRECORP 04″,”name”:”Vùng trồng dừa 04″,”loc”:”Xã Châu Hưng – Huyện Bình Đại – Bến Tre”,”desc”:”Vùng dừa liên kết nông hộ bền vững. Tọa độ trung tâm xã cũ đại diện.”,”lat”:10.2203,”lng”:106.5361,”prov”:”bt”,”qr”:”vung-trong-04″},{“id”:5,”code”:”BENTRECORP 05″,”name”:”Vùng trồng dừa 05″,”loc”:”Xã Vang Quới Tây – Huyện Bình Đại – Bến Tre”,”desc”:”Vùng dừa nguyên liệu xuất khẩu. Tọa độ trung tâm xã cũ đại diện.”,”lat”:10.2131,”lng”:106.5847,”prov”:”bt”,”qr”:”vung-trong-05″},{“id”:6,”code”:”BENTRECORP 06″,”name”:”Vùng trồng dừa 06″,”loc”:”Xã Bình Trưng – Huyện Châu Thành – Tiền Giang”,”desc”:”Vùng dừa liên kết 40 hộ nông dân huyện Châu Thành. Tọa độ trung tâm xã cũ đại diện.”,”lat”:10.3719,”lng”:106.2783,”prov”:”tg”,”qr”:”vung-trong-06″},{“id”:7,”code”:”BENTRECORP 07″,”name”:”Vùng trồng dừa 07″,”loc”:”Xã Dưỡng Điềm – Huyện Châu Thành – Tiền Giang”,”desc”:”Vùng dừa xiêm chất lượng cao Tiền Giang. Tọa độ trung tâm xã cũ đại diện.”,”lat”:10.3861,”lng”:106.2572,”prov”:”tg”,”qr”:”vung-trong-07″},{“id”:8,”code”:”BENTRECORP 08″,”name”:”Vùng trồng dừa 08″,”loc”:”Ấp Trung – Ấp Ngươn, Xã Đông Hòa – Huyện Châu Thành – Tiền Giang”,”desc”:”Vùng dừa chuyên canh ấp Trung & Ngươn. Tọa độ điểm đại diện xã cũ.”,”lat”:10.3928,”lng”:106.2936,”prov”:”tg”,”qr”:”vung-trong-08″},{“id”:9,”code”:”BENTRECORP 09″,”name”:”Vùng trồng dừa 09″,”loc”:”Ấp Thới – Ấp Đông A, Xã Đông Hòa – Huyện Châu Thành – Tiền Giang”,”desc”:”Vùng dừa chuyên canh ấp Thới & Đông A. Tọa độ điểm đại diện xã cũ.”,”lat”:10.3992,”lng”:106.3061,”prov”:”tg”,”qr”:”vung-trong-09″}];function btInitMap() { if (typeof L === “undefined”) { setTimeout(btInitMap, 200); return; } var mapEl = document.getElementById(“bt-raw-material-map”); if (!mapEl || btMapInstance) return; try { btMapInstance = L.map(“bt-raw-material-map”, { scrollWheelZoom: false }).setView([10.3062, 106.4210], 11); L.tileLayer(“https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png”, { maxZoom: 18, attribution: “© OpenStreetMap contributors | Bentrecorp Raw Material” }).addTo(btMapInstance); btZones.forEach(function(z, idx) { var isBt = z.prov === “bt”; var iconHtml = ‘
‘ + (idx + 1) + ‘
‘; var customIcon = L.divIcon({ className: “bt-map-divicon”, html: iconHtml, iconSize: [32, 32], iconAnchor: [16, 32], popupAnchor: [0, -32] }); var gmapUrl = “https://www.google.com/maps/search/?api=1&query=” + z.lat + “,” + z.lng; var popupHtml = ‘‘; var marker = L.marker([z.lat, z.lng], { icon: customIcon }).addTo(btMapInstance); marker.bindPopup(popupHtml); btMapMarkers.push({ marker: marker, data: z }); }); btFitBounds(“all”); } catch(e) { console.error(“Map init error:”, e); }}function btFitBounds(prov) { if (!btMapInstance || !btMapMarkers.length) return; var filtered = btMapMarkers.filter(function(m) { return prov === “all” || m.data.prov === prov; }); if (!filtered.length) return; var group = L.featureGroup(filtered.map(function(m) { return m.marker; })); btMapInstance.fitBounds(group.getBounds(), { padding: [40, 40], maxZoom: 13 });}function btFilterMap(prov, btn) { document.querySelectorAll(“.bt-map-filter-btn”).forEach(function(b) { b.classList.remove(“active”); }); if (btn) btn.classList.add(“active”); if (btMapInstance) { btMapMarkers.forEach(function(m) { if (prov === “all” || m.data.prov === prov) { if (!btMapInstance.hasLayer(m.marker)) btMapInstance.addLayer(m.marker); } else { if (btMapInstance.hasLayer(m.marker)) btMapInstance.removeLayer(m.marker); } }); btFitBounds(prov); } document.querySelectorAll(“.bt-zone-card”).forEach(function(card) { var p = card.getAttribute(“data-prov”); if (prov === “all” || p === prov) { card.style.display = “”; } else { card.style.display = “none”; } });}function btFocusZone(idx) { if (!btMapInstance || !btMapMarkers[idx]) return; var item = btMapMarkers[idx]; if (!btMapInstance.hasLayer(item.marker)) btMapInstance.addLayer(item.marker); btMapInstance.setView([item.data.lat, item.data.lng], 14, { animate: true }); item.marker.openPopup(); var el = document.getElementById(“bt-raw-material-map”); if (el) el.scrollIntoView({ behavior: “smooth”, block: “center” });}document.addEventListener(“DOMContentLoaded”, btInitMap);if (document.readyState === “complete” || document.readyState === “interactive”) { setTimeout(btInitMap, 300); }