React Google Charts Candlestick colors 和灯芯未显示

Question

I am trying to implement the React Google Charts candlestick charts, and I am plugging in my own data into the charts but when the charts are displayed, the candlesticks are all being displayed in one color at a time even when I change the color options.

options={{
        legend: "none",
        bar: { groupWidth: "100%" }, // Remove space between bars.
        candlestick: {
          fallingColor: { strokeWidth: 0, fill: "#a52714" }, // red
          risingColor: { strokeWidth: 0, fill: "#0f9d58" } // green
        }
      }}

I am almost certain my data is shaped correctly (this is the ordered_data array of arrays passed to the charts data property.

  data={this.state.ordered_data}

The wicks are also not displaying on the charts even though my data fits into the same shape as the default example data.

I am linking to a codesandbox showing my charts.

The chart without any wicks and with all candles with the same color looks as shown below

The codesandbox with the code for the chart is embedded below. Here's the official example for using this chart: React Google Charts candlestick . I've tried to customize the colors using the options fallingColor and risingColor settings to no avail. How can I get the wicks to display?

You can view the shape of my data from the console in the codesandbox.

 <iframe src="https://codesandbox.io/embed/charming-oskar-15lkf?fontsize=14&hidenavigation=1&theme=dark" style="width:100%; height:500px; border:0; border-radius: 4px; overflow:hidden;" title="charming-oskar-15lkf" allow="accelerometer; ambient-light-sensor; camera; encrypted-media; geolocation; gyroscope; hid; microphone; midi; payment; usb; vr; xr-spatial-tracking" sandbox="allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts"></iframe>

Answer 1

looking at the code sandbox and the data in the console,
it looks as though your data is structured as follows...

"day", "open", "high", "low", "close"

but according to the data format for Google's Candlestick Chart,
the data should be structured as follows...

"day", "low", "open", "close", "high"