我有一个问题,在javascript与建设金融烛台图表。我做了一个图表与apex.js,它显示正确的数据,它应该是,但图表的颜色不改变,当股价上涨烛台应该是绿色的,当它下跌它应该是红色的,但在一些股票烛台总是红色,在一些股票它的工作很好。这里有图片,这两个图表使用相同的代码,但不同的数据,因为它是不同的股票,但这并不意味着它应该这样显示.
下面是图表的代码:
<div id="chart">
</div>
<script>
var options = {
series: [{
name: 'OHLC',
data: [
{% for stock in stocks %}
{
x: new Date("{{stock.date}}"),
y: [Number("{{stock.open}}"), Number("{{stock.high}}"), Number("{{stock.low}}"), Number("{{stock.price}}")],
},
{% endfor %}
]
},
],
chart: {
type: 'candlestick',
},
title: {
text: '{{ticker}} Stock ',
align: 'center'
},
yaxis: {
tooltip: {
enabled: true
}
}
};
var chart = new ApexCharts(document.querySelector("#chart"), options);
chart.render();
</script>
我在后台使用Django,所以这里有一个返回图表数据的函数:
@login_required(login_url='stock:login')
def chart(request, ticker):
stocks = Stock.objects.filter(ticker = ticker).order_by('date')
context = {'stocks':stocks, 'ticker':ticker}
return render(request, 'stock_app/chart.html', context)
我为此挣扎了几天,甚至没有取得任何进展,有人能帮助我或至少告诉我问题可能在哪里,我将非常感谢。我检查了数据库,数据和代码,切换了一些服务,并使用chart.js,plotly,还有一些其他的,总是同样的问题。我还检查了雅虎财经的数据,看有没有显示正确的股票,数据是正确的。
2条答案
按热度按时间42fyovps1#
通常,当您更换库时,如果问题仍然存在,则问题不可能是库;相反,提供的数据可能包含错误的信息,导致图表上的分辨率不一致。
我看到您没有在规范中特别指定烛台颜色,所以这可能值得一试,尽管它可能只是基本配置:
https://apexcharts.com/docs/chart-types/candlestick/
然而,如果问题是数据本身,你应该提供一个有问题的股票的摘录,也是一个它的工作刚刚好。不要踩太深的顶点,也许高/低或开盘/收盘是混合或错误的。
sigwle7e2#
很难说没有你的数据集会发生什么。但是,我怀疑你的
xaxis
缺乏配置,特别是因为你的时间尺度似乎不一致。你能把这个放在你的选项中,看看会发生什么吗?你也可以有一个分类轴和一个蜡烛图,但是你可能需要额外的配置(例如,一个格式化程序)。Category x-axis – ApexCharts.js
为了方便起见,我粘贴了下面的示例。
x一个一个一个一个x一个一个二个x