Indeks SPBE Kota Bekasi

<!-- Styles --> <style type="text/css">#chartdiv { width: 35vw; height: 450px; font-weight: bold; } </style> <!-- Resources -->[removed][removed][removed][removed][removed][removed]<!-- Chart code -->[removed] am5.ready(function() { // Create root element var root = am5.Root.new("chartdiv"); // Set themes root.setThemes([ am5themes_Animated.new(root) ]); // Create chart var chart = root.container.children.push(am5xy.XYChart.new(root, { panX: true, panY: true, wheelX: "panX", wheelY: "zoomX", pinchZoomX: true, paddingLeft: 0, paddingRight: 1 })); // Add cursor var cursor = chart.set("cursor", am5xy.XYCursor.new(root, {})); cursor.lineY.set("visible", false); // Create axes var xRenderer = am5xy.AxisRendererX.new(root, { minGridDistance: 30, strokeOpacity: 4, minorGridEnabled: true }); xRenderer.labels.template.setAll({ rotation: 0, fontWeight: "900", centerY: am5.p50, centerX: am5.p100, paddingRight: 15 }); xRenderer.grid.template.setAll({ location: 1 }); var xAxis = chart.xAxes.push(am5xy.CategoryAxis.new(root, { maxDeviation: 0.3, categoryField: "country", renderer: xRenderer, tooltip: am5.Tooltip.new(root, {}) })); var yRenderer = am5xy.AxisRendererY.new(root, { strokeOpacity: 4 }); var yAxis = chart.yAxes.push(am5xy.ValueAxis.new(root, { maxDeviation: 0.3, renderer: yRenderer })); // Set bold font for y-axis labels yAxis.get("renderer").labels.template.setAll({ fontWeight: "bold" }); // Create series var series = chart.series.push(am5xy.ColumnSeries.new(root, { name: "Series 1", xAxis: xAxis, yAxis: yAxis, valueYField: "value", sequencedInterpolation: true, categoryXField: "country", tooltip: am5.Tooltip.new(root, { labelText: "{valueY}", label: am5.Label.new(root, { fontWeight: "bold" }) // Bold tooltip label }) })); series.columns.template.setAll({ cornerRadiusTL: 5, cornerRadiusTR: 5, strokeOpacity: 5 }); series.columns.template.adapters.add("fill", function (fill, target) { return chart.get("colors").getIndex(series.columns.indexOf(target)); }); series.columns.template.adapters.add("stroke", function (stroke, target) { return chart.get("colors").getIndex(series.columns.indexOf(target)); }); // Set data var data = [ { country: "2019", value: 3.34 }, { country: "2020", value: 3.70 }, { country: "2021", value: 2.94 }, { country: "2022", value: 2.78 }, { country: "2023", value: 3.01 }, { country: "2024", value: 3.83 } ]; xAxis.data.setAll(data); series.data.setAll(data); // Make stuff animate on load series.appear(1000); chart.appear(1000, 100); }); // end am5.ready() [removed]<!-- HTML -->