Deneb Graph/Chart Issue: No Data Displayed in Embedded Power BI Report

[oskar-s]

I have tried both the standard and standalone versions of Deneb, but I keep encountering an issue where the data does not display in the chart, such as the bars in my simple bar chart in my Power Embedded Report used in React. Everything else in my Power Embedded Report functions correctly except for the Deneb chart. This leads me to believe that Deneb is either misconfigured, there is a glitch, or the dataset I am using is too large.

However, the Deneb chart works properly when viewing the report directly on the Power BI app website. But when I try loading it on my domain using powerbi-client-react, it does not show any bars (data); it only displays an empty chart with labels on the x-axis.

Yes, the data does appear in the table when I right-click the chart and select "View Table," so the data is there and visible.

I have also tried both SVG and canvas rendering methods, but neither made a difference.

No, there are no errors in my console, and Deneb is loading, showing me the version and everything, so it should work, but it does load in any data.

Here is the code I am using in my deneb-chart:

Specification:

{
  "data": [{"name": "dataset"}],
  "scales": [
    {
      "name": "xscale",
      "type": "band",
      "domain": {
        "data": "dataset",
        "field": "productname"
      },
      "range": "width",
      "padding": 0.1,
      "round": true
    },
    {
      "name": "yscale",
      "domain": {
        "data": "dataset",
        "field": "Sum of total_sold"
      },
      "nice": true,
      "range": "height"
    }
  ],
  "axes": [
    {
      "orient": "bottom",
      "scale": "xscale",
      "title": "productname",
      "labelAngle": -90,
      "labelAlign": "right",
      "labelBaseline": "middle"
    },
    {
      "scale": "yscale",
      "orient": "left",
      "title": "Sum of total_sold",
      "tickCount": 5
    }
  ],
  "marks": [
    {
      "type": "rect",
      "from": {"data": "dataset"},
      "encode": {
        "enter": {
          "x": {
            "scale": "xscale",
            "field": "productname"
          },
          "width": {"value": 5},
          "y": {
            "scale": "yscale",
            "field": "Sum of total_sold"
          },
          "y2": {
            "scale": "yscale",
            "value": 0
          }
        }
      }
    }
  ]
}

Config:

{
  "autosize": {
    "contains": "padding",
    "type": "fit"
  }
}

Here is how it should look like (what it looks like viewing it in the powerbi app website): 

And this is how it looks using power bi embedded in my react project:

And the weird thing is, it worked like the first time using the chart but after a while it went to 50/50 when loading in the embedded report and now it never works.