I am on React project using ApexCharts to display data, and I’m trying to add emojis to specific data points that have associated goals.

I have tried adding emojis using the markers ,annotations property but haven’t been successful. I need assistance in correctly displaying emojis at data points with defined goals.

    import React, { useEffect, useState } from "react";
    import ReactApexChart from "react-apexcharts";
    // import PanadolWinner from "../../src/assets/icons/PanadolWinner.png";
    
    const PanadolStackedColChart = () => {
      const [seriesData, setSeriesData] = useState([]);
      const [colorsList, setColorsList] = useState([]);
      useEffect(() => {
        const series = [
          {
            name: "Blue Panadol",
            data: [1, 4, 3, 4, 2],
            PanadolTotal: 4,
            color: "#80c7fd",
          },
          {
            name: "Red Panadol",
            data: [2, 3, 1, 3, 3],
            PanadolTotal: 4,
            color: "#FF5733",
          },
          {
            name: "Green Panadol",
            data: [5, 4, 1, 0, 2],
            PanadolTotal: 5,
            color: "#80f1cb",
          },
          {
            name: "Orange Panadol",
            data: [1, 4, 3, 4, 2],
            PanadolTotal: 4,
            color: "#f5840e",
          },
        ];
    
        setColorsList(series.map((item) => item.color));
    
        setSeriesData(
          series.map((item) => ({
            name: item.name,
            data: item.data.map((value, index) => ({
              x: `Day ${index + 1}`,
              y: value,
              goals: [
                {
                  name: "Expected",
                  value: item.PanadolTotal,
                  cssClass: "expected-emoji",
                  strokeHeight: 13,
                  strokeWidth: 0,
                  strokeLineCap: "round",
                  strokeColor: item.color,
                },
              ],
            })),
          }))
        );
      }, []);
    
      const options = {
        chart: {
          height: 350,
          type: "bar",
        },
        plotOptions: {
          bar: {
            columnWidth: "60%",
            endingShape: "rounded",
          },
        },
        colors: colorsList,
        dataLabels: {
          enabled: true,
        },
        legend: {
          show: true,
        },
        yaxis: {
          stepSize: 1,
        },
        xaxis: {
          categories: ["Day 1", "Day 2", "Day 3", "Day 4", "Day 5"],
        },
      };
    
      return (
        <div id="chart">
          <ReactApexChart
            options={options}
            series={seriesData || []}
            type="bar"
            height={350}
          />
        </div>
      );
    };
    
    export default PanadolStackedColChart;

[enter image description here](https://i.sstatic.net/YjAgQ3ax.png)