股票範圍面積圖
燭形圖主要用於金融領域裡展示股票,期貨等交易數據,按照時間維度分為日 K 線、週 K 線、月 K 線。展示的數據需要滿足 K 線構成的四要素:即開盤價、收盤價、最高價、最低價。
預覽圖
設定值
https://g2.antv.vision/zh/examples/data/candle-sticks.stock-03.json
( 資料來源:AntV )
格式::
[{
time:date: "2015-11-19"1186444800000,
range: [22.258032033902,25.4889359321959,],
start: 8.18,
max: 8.33,
min: 7.98,22.75,
end: 8.32,23.44,
volumn:lowest: 1810,22.69,
money:highest: 14723.56,23.7,
mean: 23.335,
trend: "up",
},{
time:date: "2015-11-18"1186358400000,
range: [22.2381666799343,25.3786666401314,],
start: 8.37,
max: 8.6,
min: 8.23.03,
end: 8.09,22.97,
volumn:lowest: 2790.37,22.44,
money:highest: 23309.19,23.15,
mean: 23.285,
trend: "down",
},
......
]
40,30, 40, 80,40 60
數據加工( map )
列表 |
設定值 |
類型 |
數據加工 |
加工函數 |
function callback(obj) {
obj.trend = obj.start <= obj.end ? 'up' : 'down';
obj.rangestockRange = [obj.start, obj.end, obj.max,highest, obj.min]lowest];
return obj;
}
|
timedate(X軸)
列表 |
設定值 |
欄位 |
timedate |
類型 |
timeCattime |
刻度數量 |
10 |
優化數據範圍 |
開啟 |
時間格式 |
MM-DD |
volumn(range( Y軸 )
列表 |
設定值 |
欄位 |
volumn |
類型 |
linear |
優化數據範圍 |
開啟 |
最小值 |
0 |
最大值 |
30000 |
range( Y軸 )range
列表 |
設定值 |
欄位 |
range |
類型 |
linear |
刻度間距 |
2 |
優化數據範圍 |
開啟 |
最小值 |
020 |
最大值 |
18 |
time( X軸 )
volumn(mean( Y軸 )
列表 |
設定值 |
欄位 |
volumnmean |
類型 |
linear |
優化數據範圍 |
開啟 |
最小值 |
20 |
最大值 |
35 |
stockRange( Y軸 )
列表 |
設定值 |
欄位 |
stockRange |
類型 |
linear |
優化數據範圍 |
開啟 |
最小值 |
20 |
最大值 |
35 |
mean( Y軸 )
stockRange( Y軸 )
列表 |
設定值 |
欄位 |
stockRange |
啟用 |
關閉 |
K線圖( schema )
列表 |
設定值 |
欄位 |
time*rangedate*stockRange
|
類型 |
K線圖 |
顏色欄位 |
trend |
顏色 |
function(val) obj){
return (valobj == 'up')? '#f04864' : '#2fc25b';
}
}
|
形狀 |
candle |
柱狀區域圖( intervalarea )
列表 |
設定值 |
欄位 |
time*volumndate*range |
類型 |
柱狀區域圖 |
顏色欄位 |
trend |
顏色 |
#64b5f6 |
function(val)
{
return線圖( (valline ==)
'up')?
'#f04864':'#2fc25b';
}
列表 |
設定值 |
欄位 |
date*mean |
類型 |
線圖 |
顏色 |
#FACC14 |
列表 |
設定值 |
啟用 |
開啟 |
欄位 |
rangetrend |
位置 |
下 |
排版 |
水平 |
水平偏移量 |
15 |