apexcharts

Question

我正在使用 apexcharts 和 react-apexcharts 实时绘制带有支撑线的烛台图表。从我在文档中阅读的所有内容来看，我绘制的线条颜色不应该是正在显示的颜色，它目前与默认网格线的颜色相同，因此几乎不可能将我绘制的线条与网格区分开来。（它应该使用目前被完全忽略的“颜色”属性）

这是我的选项对象：

options: {
                chart: {
                    id: "realtime",
                    type: 'line',
                    height: 450,
                    animations: {
                        enabled: true,
                        easing: 'linear',
                        dynamicAnimation: {
                            speed: 150
                        }
                    },
                    zoom: {
                        enabled: false,
                        autoScaleYaxis: false,
                    }
                },
                title: {
                    text: 'Prices',
                    align: 'center'
                },
                xaxis: {
                    type: 'datetime',
                },
                yaxis: {
                    opposite: true,
                    tickAmount: 25,
                    tooltip: {enabled:true}
                },
                grid: {
                    row: {
                        colors: ['black'],
                        opacity: 1
                    },
                    column: {
                        colors: ['black'],
                        opacity: 1
                    },
                },
                plotOptions: {
                    candlestick: {
                        colors: {
                            upward: 'rgb(0,255,0)',
                            downward: 'rgb(255,0,0)'
                        }
                    },
                },
                colors: ['#546E7A', '#E91E63']
            },

我的组件：

                <ReactApexChart options={this.state.options} series={this.state.series} type="candlestick" height={650} />

知道为什么会发生这种情况以及如何解决它吗？

Answer 1

我修好了。显然，如果您希望在行上应用 colors 属性，不仅 chart.type、series.type 属性必须设置为 line，而且 type ReactApexChart 组件中的道具。

所以，就我而言：

<ReactApexChart options={this.options} series={this.state.series} type="line" height={650} />

apexcharts - 带额外线条的烛台图表 - 如何更改线条颜色？

apexcharts - candlestick chart with extra line - how to change line color?

javascript

reactjs