发明者量化-小小梦
حکمت عملی ڈرائنگ ڈیزائن کو آسان بنانے کے لیے KLineChart فنکشن کا استعمال کریں۔
3
2617
حکمت عملی ڈرائنگ ڈیزائن کو آسان بنانے کے لیے KLineChart فنکشن کا استعمال کریں۔
حکمت عملی ڈیزائن کرتے وقت، حکمت عملی لکھنے کے لیے JavaScript یا Python کا استعمال کرتے وقت اکثر حکمت عملی چارٹ ڈسپلے ڈیزائن کرنا ضروری ہوتا ہے۔ وہ صارفین جو پروگرامنگ یا FMZ پلیٹ فارم کے ذریعے استعمال ہونے والی چارٹنگ لائبریری سے واقف نہیں ہیں اکثر حسب ضرورت چارٹس پر ڈرائنگ کے لیے کوڈ ڈیزائن کے ساتھ جدوجہد کرتے ہیں۔ تو ہم صرف تھوڑا سا کوڈ لکھ کر بھرپور مواد کے ساتھ حکمت عملی کا چارٹ کیسے بنا سکتے ہیں؟
یہ سادہ لیکن طاقتور ڈرائنگ کا طریقہ پائن زبان میں دیکھا جا سکتا ہے، جو اپنے بھرپور ڈرائنگ فنکشنز کے لیے مشہور ہے۔ اگر پائن لینگویج کے ڈرائنگ انٹرفیس کو جاوا اسکرپٹ اور ازگر کی زبانوں کی حکمت عملیوں سے جوڑا جا سکتا ہے، تو یہ ڈویلپرز کو حکمت عملی کے ڈرائنگ فنکشن کو ڈیزائن کرنے میں بہت زیادہ سہولت فراہم کرے گا۔ اس مطالبے کی بنیاد پر، FMZ پلیٹ فارم نے حسب ضرورت ڈرائنگ فنکشن کو اپ گریڈ کیا اور اس کے استعمال کو بڑھا دیا۔KLineChartفنکشن اپنی مرضی کے مطابق چارٹ ڈرائنگ کرتا ہے۔ آپ API دستاویزات کا حوالہ دے سکتے ہیں: https://www.fmz.com/api#klinechart
آئیے ٹرانزیشن کرنے کے لیے ایک سادہ سی مثال لکھنے کے لیے JavaScript کا استعمال کریں۔
سادہ مثال
/*backtest
start: 2022-03-21 09:00:00
end: 2022-06-21 15:00:00
period: 30m
basePeriod: 15m
exchanges: [{"eid":"Binance","currency":"BTC_USDT"}]
*/
function main() {
var c = KLineChart()
while (true) {
var bars = _C(exchange.GetRecords)
for (var i = 0 ; i < bars.length ; i++) {
var bar = bars[i]
c.begin(bar)
c.plot(bar.Volume, "volume")
c.close()
}
Sleep(1000)
}
}
یہ مثال بہت آسان ہے یہ حکمت عملی کے حسب ضرورت ڈرائنگ ایریا میں صرف ایک کینڈل سٹک چارٹ کھینچتی ہے، اور چارٹ کی ذیلی چارٹ پوزیشن میں ہر کینڈل سٹک بار کے مطابق ایک والیوم کریو کھینچتی ہے۔
کوڈ میں ہم سب سے پہلے استعمال کرتے ہیں۔var c = KLineChart()ایک چارٹ آبجیکٹ بنائیں اور پھر ڈرا کرنے کے لیے اس کے طریقوں کو کال کریں۔ پھر لوپ میں ہم K-line ڈیٹا (array سٹرکچر) حاصل کرتے ہیں اور K-line ارے کو عبور کرتے ہیں۔ آپ مثال کے طور پر ٹراورس کرنے کے لیے سادہ لوپ کا استعمال کر سکتے ہیں، یا آپ دوسرے طریقے استعمال کر سکتے ہیں۔
سے ڈرائنگ آپریشن کیا جانا چاہئےc.begin(bar)فنکشن شروع ہوتا ہے،c.close()فنکشن ختم ہوتا ہے۔begin、closeفنکشنز چارٹ آبجیکٹ کے طریقے ہیں c۔ اگلا، سب سے زیادہ استعمال شدہ ڈرائنگ فنکشن استعمال کریں۔plotہر بار پر والیوم وکر کھینچیں۔
ایک زیادہ پیچیدہ مثال
فرض کریں کہ ہم بولنگر انڈیکیٹرز کے ساتھ ایک چارٹ ڈیزائن کرنا چاہتے ہیں۔ اوہ ہاں! ہر بار کے لیے حجم کا چارٹ منسلک کرنا بھی ضروری ہے، جسے اس طرح ڈیزائن کیا جا سکتا ہے:
/*backtest
start: 2022-03-21 09:00:00
end: 2022-06-21 15:00:00
period: 1d
basePeriod: 1h
exchanges: [{"eid":"Binance","currency":"BTC_USDT"}]
*/
function main() {
var c = KLineChart()
// 策略主循环
while(true) {
// 轮询间隔
Sleep(500)
// 获取K线数据
let bars = exchange.GetRecords()
if (!bars || bars.length <= 20) {
continue
}
// 计算布林指标
var boll = TA.BOLL(bars)
bars.forEach(function(bar, index) {
c.begin(bar)
// 画图操作
c.plot(boll[0][index], "Boll_Up", {overlay: true}) // 画在图表主图
c.plot(boll[1][index], "Boll_Mid", {overlay: true}) // 画在图表主图
c.plot(boll[2][index], "Boll_Down", {overlay: true}) // 画在图表主图
c.plot(bar.Volume, "volume") // 画在图表副图
c.close()
})
// 策略交易逻辑
// ...
// ..
}
}
آپ کوڈ میں دیکھ سکتے ہیں کہ FMZ پلیٹ فارم پر ہماری بہترین ترتیب کی معلومات یہ ہے:
/*backtest
start: 2022-03-21 09:00:00
end: 2022-06-21 15:00:00
period: 1d
basePeriod: 1h
exchanges: [{"eid":"Binance","currency":"BTC_USDT"}]
*/
اس ترتیب کو بائننس اسپاٹ ایکسچینج آبجیکٹ کا استعمال کرتے ہوئے بیک ٹیسٹ کیا گیا ہے جس کے نتائج تصویر میں دکھائے گئے ہیں۔
یہ دیکھا جا سکتا ہے کہ ہم جاوا اسکرپٹ کی زبان میں ڈرائنگ کوڈ کو بہت آسان بنانے کے لیے پائن کے ڈرائنگ کا طریقہ استعمال کرتے ہیں۔
تصویریں کھینچنے کے لیے اشارے اور دیگر ڈیٹا لکھیں۔
پلیٹ فارم کے اسٹرٹیجی اسکوائر کی حکمت عملی کی مثالوں اور API دستاویزات میں K-line ڈیٹا حاصل کرنا اور انڈیکیٹرز کا حساب لگانا جیسے آپریشنز عام اور بہت آسان ہیں۔
// 获取K线数据
let bars = exchange.GetRecords()
if (!bars || bars.length <= 20) {
// 如果获取K线失败，即!bar为真则执行continue，忽略之后的代码，重新执行循环
// 如果bars.length小于等于20，即K线BAR（柱）数量小于20，无法计算指标，也执行continue
continue
}
// 计算布林指标
var boll = TA.BOLL(bars)
بولنگر انڈیکیٹر کیلکولیشن فنکشن TA.BOLL، اگر آپ بولنگر انڈیکیٹر کے پیرامیٹرز کی وضاحت نہیں کرتے ہیں تو پہلے سے طے شدہ پیرامیٹرز استعمال کیے جاتے ہیں۔BOLL(20, 2). بولنگر انڈیکیٹر میں تین لائنیں ہیں، اس لیے TA.BOLL فنکشن کے ذریعے لوٹایا جانے والا ڈیٹا ایک دو جہتی صف ہے۔ بول[0]、boll[1]、boll[2] بول سرنی کے تین عناصر ہیں، جن میں سے ہر ایک لائن کی نمائندگی کرتا ہے اور ایک صف ہے۔
- boll[0]: بولنگر بینڈز آن لائن
- boll[1]: بولنگر بینڈز مڈل لائن
- boll[2]: بولنگر بینڈز ڈاؤن
پھر ہم دیکھیں گے کہ K-line ڈیٹا کا حجم، یعنی ٹریڈنگ والیوم، اور چارٹ پر حسابی بولنگر انڈیکیٹر ڈیٹا کا حجم کیسے نکالا جائے۔
ہم K-لائن ڈیٹا بار کو بار کے ذریعے کھینچتے ہیں، اس لیے ہمیں K-line کی پوری صف کو عبور کرنے کی ضرورت ہے، یعنی کوڈ میں موجود بارز کی صف کو عبور کرنا ہے۔ یہاں ہم استعمال کرتے ہیں۔forEachفار لوپ کا استعمال کرتے ہوئے میتھڈ ٹراورسل کو بھی عبور کیا جا سکتا ہے۔
bars.forEach(function(bar, index) {
c.begin(bar)
// 画图操作
c.plot(boll[0][index], "Boll_Up", {overlay: true}) // {overlay: true}参数控制，画在图表主图
c.plot(boll[1][index], "Boll_Mid", {overlay: true}) // 画在图表主图
c.plot(boll[2][index], "Boll_Down", {overlay: true}) // 画在图表主图
c.plot(bar.Volume, "volume") // 画在图表副图
c.close()
})
واضح رہے کہ جب بھی آپ بار پر چارٹ بنانا شروع کرتے ہیں، آپ کو سب سے پہلے یہ کرنا چاہیے۔c.begin(bar)فنکشن کالز،beginایک فنکشن ہمارے چارٹ آبجیکٹ کا ایک طریقہ ہے c۔ ڈرائنگ آپریشن کے اختتام پر، آپ کو کال کرنے کی ضرورت ہے۔c.close(). موجودbeginافعال اورcloseفنکشنز کے درمیان وہ ڈرائنگ فنکشنز ہیں جنہیں ہم کہتے ہیں جو پائن لینگویج ڈرائنگ کے طریقے سے ملتے جلتے ہیں۔ حمایت:barcolor bgcolor plot fill hline plotarrow plotshape plotchar plotcandle signal، آپ لکیریں، تیر، نشان معلومات وغیرہ کھینچ سکتے ہیں۔ ان فنکشنز کے پیرامیٹرز پائن لینگویج کے متعلقہ فنکشن پیرامیٹرز کے ساتھ مطابقت رکھتے ہیں، اور ڈرائنگ فنکشنز بھی ہم آہنگ ہیں۔
تجارتی سگنل کے تیر، مارکر، افقی لکیریں اور دیگر ڈرائنگز شامل کی گئیں۔
اوپر دی گئی بولنگر انڈیکیٹر ڈرائنگ کی مثال میں کچھ تجارتی سگنل کے تیر، مارکر اور افقی لکیریں شامل کریں۔
/*backtest
start: 2022-03-21 09:00:00
end: 2022-06-21 15:00:00
period: 1d
basePeriod: 1h
exchanges: [{"eid":"Binance","currency":"BTC_USDT"}]
*/
function main() {
var c = KLineChart()
// 策略主循环
while(true) {
// 轮询间隔
Sleep(500)
// 获取K线数据
let bars = exchange.GetRecords()
if (!bars || bars.length <= 20) {
continue
}
// 计算布林指标
var boll = TA.BOLL(bars)
bars.forEach(function(bar, index) {
c.begin(bar)
// 画图操作
c.plot(boll[0][index], "Boll_Up", {overlay: true}) // 画在图表主图
c.plot(boll[1][index], "Boll_Mid", {overlay: true}) // 画在图表主图
c.plot(boll[2][index], "Boll_Down", {overlay: true}) // 画在图表主图
c.plot(bar.Volume, "volume") // 画在图表副图
c.hline(bar.Open, {overlay: true}) // 水平线
c.plotarrow(bar.Close - bar.Open, {overlay: true}) // 箭头
c.plotshape(bar.Close - bar.Open > 0, {style: 'square', overlay: true}) // 画方块标记
c.plotchar(bar.Close - bar.Open < 0, {char: '❄', size: "20px", overlay: true}) // 画出字符❄
if (boll[0][index] && bar.Close > boll[0][index]) {
c.signal("long", bar.Close, 1.5)
} else if (boll[2][index] && bar.Close < boll[2][index]) {
c.signal("closelong", bar.Close, 1.5)
}
c.close()
})
// 策略交易逻辑
// ...
// ..
}
}
چونکہ پائن لینگویج اسٹریٹجی آرڈر آپریشن خود بخود چارٹ پر سگنل کو نشان زد کردے گا،KLineChartفنکشن کے ذریعہ تیار کردہ چارٹ آبجیکٹ کو خرید و فروخت کے سگنل مارکر ڈرائنگ کے فنکشن کے ساتھ بھی بڑھایا جاتا ہے:c.signal。
چارٹ کنفیگریشن آبجیکٹ
آپ چارٹ کے انداز کو ترتیب دینے کے لیے ڈھانچے کا اعلان کر سکتے ہیں، مثال کے طور پر، درج ذیل چارٹ سی ایف جی متغیر گرڈ لائن کی ترتیب کی معلومات کو ظاہر کرتا ہے۔
var chartCfg = {
grid: {
show: true,
// 网格水平线
horizontal: {
show: true,
size: 2,
color: '#FF0000', // 水平网格线的颜色
// 'solid'|'dash'
style: 'dash', // 线的类型
dashValue: [2, 2]
},
// 网格垂直线
vertical: {
show: true,
size: 2,
color: '#32CD32',
// 'solid'|'dash'
style: 'solid',
dashValue: [2, 2]
}
},
}
چارٹ کنفیگریشن آبجیکٹ ایک ڈیٹا ڈھانچہ ہے جو چارٹ کی کچھ خصوصیات اور ظاہری شکل کو متعین کرتا ہے۔ بہت سے آپشنز بھی ہیں جن کو کنفیگر اور تبدیل کیا جا سکتا ہے، جیسے کہ X-axis اور Y-axis کی متعلقہ سیٹنگز، کرسر لائن کی سیٹنگز، پرامپٹ انفارمیشن کی سیٹنگز، ٹیکنیکل انڈیکیٹر اسٹائل کی سیٹنگز، K-line BAR طرز کی ترتیبات وغیرہ۔
یقینا، اگر آپ ان سے واقف نہیں ہیں،KLineChartچارٹ آبجیکٹ بناتے وقت فنکشن کو چارٹ کنفیگریشن آبجیکٹ میں پاس کرنے کی ضرورت نہیں ہے۔ بنایا گیا چارٹ پہلے سے طے شدہ طرز کا ہے۔ FMZ پلیٹ فارم کے API افعال کا استعمالKLineChartچارٹ آبجیکٹ بنانے کا فنکشن:
var c = KLineChart(chartCfg)
گرڈ لائنوں کو ڈرائنگ کے لیے ٹیسٹ کوڈ:
/*backtest
start: 2022-03-21 09:00:00
end: 2022-06-21 15:00:00
period: 1d
basePeriod: 1h
exchanges: [{"eid":"Binance","currency":"BTC_USDT"}]
*/
function main() {
var chartCfg = {
grid: {
show: true,
// 网格水平线
horizontal: {
show: true,
size: 2,
color: '#FF0000',
// 'solid'|'dash'
style: 'dash',
dashValue: [2, 2]
},
// 网格垂直线
vertical: {
show: true,
size: 2,
color: '#32CD32',
// 'solid'|'dash'
style: 'solid',
dashValue: [2, 2]
}
},
}
var c = KLineChart(chartCfg)
// 策略主循环
while(true) {
// 轮询间隔
Sleep(500)
// 获取K线数据
var bars = _C(exchange.GetRecords)
bars.forEach(function(bar, index) {
c.begin(bar)
c.close()
})
// 策略交易逻辑
// ...
// ..
}
}
چارٹ کنفیگریشن اسٹائل کی مثال
چارٹ کنفیگریشن اسٹائل کی سیٹنگز کا حوالہ دینے کے لیے استعمال کیا جا سکتا ہے۔
{
// 网格线
grid: {
show: true,
// 网格水平线
horizontal: {
show: true,
size: 1,
color: '#393939',
// 'solid'|'dash'
style: 'dash',
dashValue: [2, 2]
},
// 网格垂直线
vertical: {
show: false,
size: 1,
color: '#393939',
// 'solid'|'dash'
style: 'dash',
dashValue: [2, 2]
}
},
// 蜡烛图
candle: {
// 蜡烛图上下间距，大于1为绝对值，大于0小余1则为比例
margin: {
top: 0.2,
bottom: 0.1
},
// 蜡烛图类型 'candle_solid'|'candle_stroke'|'candle_up_stroke'|'candle_down_stroke'|'ohlc'|'area'
type: 'candle_solid',
// 蜡烛柱
bar: {
upColor: '#26A69A',
downColor: '#EF5350',
noChangeColor: '#888888'
},
// 面积图
area: {
lineSize: 2,
lineColor: '#2196F3',
value: 'close',
backgroundColor: [{
offset: 0,
color: 'rgba(33, 150, 243, 0.01)'
}, {
offset: 1,
color: 'rgba(33, 150, 243, 0.2)'
}]
},
priceMark: {
show: true,
// 最高价标记
high: {
show: true,
color: '#D9D9D9',
textMargin: 5,
textSize: 10,
textFamily: 'Helvetica Neue',
textWeight: 'normal'
},
// 最低价标记
low: {
show: true,
color: '#D9D9D9',
textMargin: 5,
textSize: 10,
textFamily: 'Helvetica Neue',
textWeight: 'normal',
},
// 最新价标记
last: {
show: true,
upColor: '#26A69A',
downColor: '#EF5350',
noChangeColor: '#888888',
line: {
show: true,
// 'solid'|'dash'
style: 'dash',
dashValue: [4, 4],
size: 1
},
text: {
show: true,
size: 12,
paddingLeft: 2,
paddingTop: 2,
paddingRight: 2,
paddingBottom: 2,
color: '#FFFFFF',
family: 'Helvetica Neue',
weight: 'normal',
borderRadius: 2
}
}
},
// 提示
tooltip: {
// 'always' | 'follow_cross' | 'none'
showRule: 'always',
// 'standard' | 'rect'
showType: 'standard',
labels: ['时间', '开', '收', '高', '低', '成交量'],
values: null,
defaultValue: 'n/a',
rect: {
paddingLeft: 0,
paddingRight: 0,
paddingTop: 0,
paddingBottom: 6,
offsetLeft: 8,
offsetTop: 8,
offsetRight: 8,
borderRadius: 4,
borderSize: 1,
borderColor: '#3f4254',
backgroundColor: 'rgba(17, 17, 17, .3)'
},
text: {
size: 12,
family: 'Helvetica Neue',
weight: 'normal',
color: '#D9D9D9',
marginLeft: 8,
marginTop: 6,
marginRight: 8,
marginBottom: 0
}
}
},
// 技术指标
technicalIndicator: {
margin: {
top: 0.2,
bottom: 0.1
},
bar: {
upColor: '#26A69A',
downColor: '#EF5350',
noChangeColor: '#888888'
},
line: {
size: 1,
colors: ['#FF9600', '#9D65C9', '#2196F3', '#E11D74', '#01C5C4']
},
circle: {
upColor: '#26A69A',
downColor: '#EF5350',
noChangeColor: '#888888'
},
// 最新值标记
lastValueMark: {
show: false,
text: {
show: false,
color: '#ffffff',
size: 12,
family: 'Helvetica Neue',
weight: 'normal',
paddingLeft: 3,
paddingTop: 2,
paddingRight: 3,
paddingBottom: 2,
borderRadius: 2
}
},
// 提示
tooltip: {
// 'always' | 'follow_cross' | 'none'
showRule: 'always',
// 'standard' | 'rect'
showType: 'standard',
showName: true,
showParams: true,
defaultValue: 'n/a',
text: {
size: 12,
family: 'Helvetica Neue',
weight: 'normal',
color: '#D9D9D9',
marginTop: 6,
marginRight: 8,
marginBottom: 0,
marginLeft: 8
}
}
},
// x轴
xAxis: {
show: true,
height: null,
// x轴线
axisLine: {
show: true,
color: '#888888',
size: 1
},
// x轴分割文字
tickText: {
show: true,
color: '#D9D9D9',
family: 'Helvetica Neue',
weight: 'normal',
size: 12,
paddingTop: 3,
paddingBottom: 6
},
// x轴分割线
tickLine: {
show: true,
size: 1,
length: 3,
color: '#888888'
}
},
// y轴
yAxis: {
show: true,
width: null,
// 'left' | 'right'
position: 'right',
// 'normal' | 'percentage' | 'log'
type: 'normal',
inside: false,
reverse: false,
// y轴线
axisLine: {
show: true,
color: '#888888',
size: 1
},
// y轴分割文字
tickText: {
show: true,
color: '#D9D9D9',
family: 'Helvetica Neue',
weight: 'normal',
size: 12,
paddingLeft: 3,
paddingRight: 6
},
// y轴分割线
tickLine: {
show: true,
size: 1,
length: 3,
color: '#888888'
}
},
// 图表之间的分割线
separator: {
size: 1,
color: '#888888',
fill: true,
activeBackgroundColor: 'rgba(230, 230, 230, .15)'
},
// 十字光标
crosshair: {
show: true,
// 十字光标水平线及文字
horizontal: {
show: true,
line: {
show: true,
// 'solid'|'dash'
style: 'dash',
dashValue: [4, 2],
size: 1,
color: '#888888'
},
text: {
show: true,
color: '#D9D9D9',
size: 12,
family: 'Helvetica Neue',
weight: 'normal',
paddingLeft: 2,
paddingRight: 2,
paddingTop: 2,
paddingBottom: 2,
borderSize: 1,
borderColor: '#505050',
borderRadius: 2,
backgroundColor: '#505050'
}
},
// 十字光标垂直线及文字
vertical: {
show: true,
line: {
show: true,
// 'solid'|'dash'
style: 'dash',
dashValue: [4, 2],
size: 1,
color: '#888888'
},
text: {
show: true,
color: '#D9D9D9',
size: 12,
family: 'Helvetica Neue',
weight: 'normal',
paddingLeft: 2,
paddingRight: 2,
paddingTop: 2,
paddingBottom: 2,
borderSize: 1,
borderColor: '#505050',
borderRadius: 2,
backgroundColor: '#505050'
}
}
},
// 图形
shape: {
point: {
backgroundColor: '#2196F3',
borderColor: '#2196F3',
borderSize: 1,
radius: 4,
activeBackgroundColor: '#2196F3',
activeBorderColor: '#2196F3',
activeBorderSize: 1,
activeRadius: 6
},
line: {
// 'solid'|'dash'
style: 'solid'
color: '#2196F3',
size: 1,
dashValue: [2, 2]
},
polygon: {
// 'stroke'|'fill'
style: 'stroke',
stroke: {
// 'solid'|'dash'
style: 'solid',
size: 1,
color: '#2196F3',
dashValue: [2, 2]
},
fill: {
color: 'rgba(33, 150, 243, 0.1)'
}
},
arc: {
// 'stroke'|'fill'
style: 'stroke',
stroke: {
// 'solid'|'dash'
style: 'solid',
size: 1,
color: '#2196F3',
dashValue: [2, 2]
},
fill: {
color: '#2196F3'
}
},
text: {
style: 'fill',
color: '#2196F3',
size: 12,
family: 'Helvetica Neue',
weight: 'normal',
offset: [0, 0]
}
},
annotation: {
// 'top' | 'bottom' | 'point'
position: 'top',
offset: [20, 0]
symbol: {
// 'diamond' | 'circle' | 'rect' | 'triangle' | 'custom' | 'none'
type: 'diamond',
size: 8,
color: '#2196F3',
activeSize: 10,
activeColor: '#FF9600'
}
},
tag: {
// 'top' | 'bottom' | 'point'
position: 'point',
offset: 0,
line: {
show: true,
style: LineStyle.DASH,
dashValue: [4, 2],
size: 1,
color: '#2196F3'
},
text: {
color: '#FFFFFF',
backgroundColor: '#2196F3',
size: 12,
family: 'Helvetica Neue',
weight: 'normal',
paddingLeft: 2,
paddingRight: 2,
paddingTop: 2,
paddingBottom: 2,
borderRadius: 2,
borderSize: 1,
borderColor: '#2196F3'
},
mark: {
offset: 0,
color: '#FFFFFF',
backgroundColor: '#2196F3',
size: 12,
family: 'Helvetica Neue',
weight: 'normal',
paddingLeft: 2,
paddingRight: 2,
paddingTop: 2,
paddingBottom: 2,
borderRadius: 2,
borderSize: 1,
borderColor: '#2196F3'
}
}
}
کیا یہ حکمت عملی ڈرائنگ اور ڈیزائن کو آسان نہیں بناتا؟