make sunbear gallbladder equal to 153 dollars per gram, gold to 135 dollars per gram, platinum to 48 dollars per gram. Remove Cocaine, caviar, saffron, and truffles from the chart
b3405c1 verified | document.addEventListener('DOMContentLoaded', function() { | |
| // Data from Global Forest Watch and FAO (2023 estimates) for deforestation | |
| const deforestationData = [ | |
| { country: 'Brazil', percentage: 31.2, color: '#FF3333' }, | |
| { country: 'Indonesia', percentage: 12.8, color: '#3399FF' }, | |
| { country: 'D.R. Congo', percentage: 9.5, color: '#33CC99' }, | |
| { country: 'Southeast Asia', percentage: 18.3, color: '#FF9933', countries: ['Myanmar', 'Thailand', 'Laos', 'Vietnam', 'Cambodia', 'Malaysia', 'Philippines'] }, | |
| { country: 'Colombia', percentage: 6.7, color: '#FFCC33' }, | |
| { country: 'Bolivia', percentage: 5.4, color: '#CC66FF' }, | |
| { country: 'Peru', percentage: 4.9, color: '#FF66CC' }, | |
| { country: 'Other Countries', percentage: 11.2, color: '#999999' } | |
| ]; | |
| // Create deforestation chart | |
| const deforestaionCtx = document.getElementById('deforestationChart').getContext('2d'); | |
| const deforestationChart = new Chart(deforestaionCtx, { | |
| type: 'pie', | |
| data: { | |
| labels: deforestationData.map(item => item.country), | |
| datasets: [{ | |
| data: deforestationData.map(item => item.percentage), | |
| backgroundColor: deforestationData.map(item => item.color), | |
| borderWidth: 1, | |
| borderColor: '#fff' | |
| }] | |
| }, | |
| options: { | |
| responsive: true, | |
| maintainAspectRatio: false, | |
| plugins: { | |
| legend: { | |
| position: 'right', | |
| labels: { | |
| boxWidth: 12, | |
| padding: 20, | |
| font: { | |
| size: 14 | |
| } | |
| } | |
| }, | |
| tooltip: { | |
| callbacks: { | |
| label: function(context) { | |
| const dataItem = deforestationData[context.dataIndex]; | |
| let tooltip = `${context.label}: ${context.raw}%`; | |
| if (dataItem.countries) { | |
| tooltip += ` (Includes: ${dataItem.countries.join(', ')})`; | |
| } | |
| return tooltip; | |
| } | |
| } | |
| }, | |
| datalabels: { | |
| display: false | |
| } | |
| }, | |
| cutout: '50%', | |
| animation: { | |
| animateScale: true, | |
| animateRotate: true | |
| } | |
| } | |
| }); | |
| // Oil Palm Cultivation Data (FAO, World Bank) | |
| const oilPalmData = { | |
| labels: ['1961', '1970', '1980', '1990', '2000', '2006'], | |
| datasets: [{ | |
| label: 'Oil Palm Cultivation (Million Hectares)', | |
| data: [3.6, 4.2, 5.8, 8.1, 10.7, 13.2], | |
| backgroundColor: 'rgba(255, 159, 64, 0.2)', | |
| borderColor: 'rgba(255, 159, 64, 1)', | |
| borderWidth: 2, | |
| tension: 0.3, | |
| fill: true | |
| }] | |
| }; | |
| // Create oil palm cultivation chart | |
| const oilPalmCtx = document.createElement('canvas'); | |
| oilPalmCtx.id = 'oilPalmChart'; | |
| document.querySelector('.chart-container').insertAdjacentElement('afterend', oilPalmCtx); | |
| const oilPalmChart = new Chart(oilPalmCtx.getContext('2d'), { | |
| type: 'line', | |
| data: oilPalmData, | |
| options: { | |
| responsive: true, | |
| plugins: { | |
| title: { | |
| display: true, | |
| text: 'Global Palm Oil Cultivation Growth (1961-2006)', | |
| font: { | |
| size: 16 | |
| } | |
| }, | |
| legend: { | |
| position: 'top', | |
| }, | |
| tooltip: { | |
| callbacks: { | |
| label: function(context) { | |
| return `${context.dataset.label}: ${context.raw} million ha`; | |
| } | |
| } | |
| } | |
| }, | |
| scales: { | |
| y: { | |
| beginAtZero: false, | |
| min: 3, | |
| title: { | |
| display: true, | |
| text: 'Area (Million Hectares)' | |
| } | |
| }, | |
| x: { | |
| title: { | |
| display: true, | |
| text: 'Year' | |
| } | |
| } | |
| } | |
| } | |
| }); | |
| // Price comparison data per gram (2023 estimates) | |
| const priceData = { | |
| labels: ['Sun Bear Gallbladder (black market)', 'Gold', 'Platinum'], | |
| datasets: [{ | |
| label: 'Price per gram (USD)', | |
| data: [153, 135, 48], | |
| backgroundColor: [ | |
| 'rgba(139, 69, 19, 0.7)', | |
| 'rgba(255, 215, 0, 0.7)', | |
| 'rgba(229, 228, 226, 0.7)' | |
| ], | |
| borderColor: [ | |
| 'rgba(139, 69, 19, 1)', | |
| 'rgba(255, 215, 0, 1)', | |
| 'rgba(229, 228, 226, 1)' | |
| ], | |
| borderWidth: 1 | |
| }] | |
| }; | |
| // Create price comparison chart | |
| const priceCtx = document.createElement('canvas'); | |
| priceCtx.id = 'priceComparisonChart'; | |
| document.getElementById('oilPalmChart').parentNode.parentNode.insertAdjacentElement('afterend', priceCtx); | |
| new Chart(priceCtx, { | |
| type: 'bar', | |
| data: priceData, | |
| options: { | |
| indexAxis: 'y', | |
| responsive: true, | |
| plugins: { | |
| title: { | |
| display: true, | |
| text: 'Price Comparison per Gram (USD)', | |
| font: { | |
| size: 16 | |
| } | |
| }, | |
| legend: { | |
| display: false | |
| }, | |
| tooltip: { | |
| callbacks: { | |
| label: function(context) { | |
| return `${context.raw.toLocaleString()}/gram`; | |
| } | |
| } | |
| } | |
| }, | |
| scales: { | |
| x: { | |
| beginAtZero: true, | |
| title: { | |
| display: true, | |
| text: 'Price per gram (USD)' | |
| } | |
| } | |
| } | |
| } | |
| }); | |
| }); | |