रणनीति को डिजाइन करते समय, अक्सर प्रदर्शित करने के लिए एक रणनीति चार्ट डिजाइन करना आवश्यक होता है, जब जावास्क्रिप्ट भाषा, पायथन भाषा में रणनीतियों को लिखते हैं, तो जो उपयोगकर्ता प्रोग्रामिंग या एफएमजेड प्लेटफॉर्म में उपयोग किए जाने वाले चार्टिंग लाइब्रेरी से अपरिचित हैं, वे अक्सर कस्टम चार्ट पर ड्राइंग के लिए कोड डिजाइन के साथ संघर्ष करते हैं। तो आप केवल एक छोटी मात्रा में कोड द्वारा समृद्ध सामग्री के साथ एक रणनीति चार्ट कैसे आकर्षित कर सकते हैं?
ड्राइंग का यह सरल और शक्तिशाली तरीका पाइन भाषा में देखा जा सकता है, जो अपने समृद्ध ड्राइंग कार्यों के लिए जाना जाता है। यदि पाइन भाषा के ड्राइंग इंटरफ़ेस को जावास्क्रिप्ट और पायथन भाषाओं की रणनीतियों से जोड़ा जा सकता है, तो यह डेवलपर्स की डिजाइन रणनीति के ड्राइंग फ़ंक्शन को बहुत सुविधाजनक बना देगा। इसलिए, इस मांग के आधार पर, एफएमजेड प्लेटफॉर्म ने कस्टम ड्राइंग फ़ंक्शन को अपग्रेड किया है और उपयोग करने के तरीके का विस्तार किया हैKLineChart
कस्टम चार्ट खींचने के लिए कार्य करें. आप एपीआई प्रलेखन का संदर्भ ले सकते हैंःhttps://www.fmz.com/api#klinechart
चलिए एक सरल उदाहरण लिखकर शुरू करते हैं जावास्क्रिप्ट भाषा का उपयोग करके संक्रमण करने के लिए.
/*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, "Close")
c.close()
}
Sleep(1000)
}
}
यह उदाहरण बहुत सरल है, बस रणनीति के कस्टम ड्राइंग क्षेत्र में एक K-लाइन चार्ट खींचें, और चार्ट के उप-चार्ट स्थिति में प्रत्येक K-लाइन BAR के अनुरूप एक वॉल्यूम वक्र खींचें।
कोड में, हम उपयोगvar c = KLineChart()
एक चार्ट ऑब्जेक्ट बनाने के लिए पहले, और फिर एक चार्ट आकर्षित करने के लिए इसकी विधि का उपयोग करें. फिर लूप में, हम K-लाइन डेटा (सरणी संरचना) प्राप्त करते हैं, और K-लाइन सरणी को पार करते हैं. इसे उदाहरण में एक सरल के लिए लूप का उपयोग करके पार किया जा सकता है, या इसे अन्य तरीकों से पार किया जा सकता है.
ड्राइंग ऑपरेशन के साथ शुरूc.begin(bar)
कार्य और अंत के साथc.close()
कार्य।begin
औरclose
कार्य चार्ट ऑब्जेक्ट के सभी तरीकों हैं c. अगला, सबसे अधिक इस्तेमाल किया ड्राइंग समारोह का उपयोग करेंplot
प्रत्येक BAR पर वॉल्यूम वक्र खींचने के लिए।
मान लीजिए हम एक चार्ट डिजाइन करना चाहते हैं बोलिंगर संकेतक के साथ संलग्न है. और यह भी प्रत्येक बार का एक मात्रा चार्ट के साथ आता है, जो इस तरह से डिजाइन किया जा सकता हैः
/*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()
// main strategy loop
while(true) {
// polling interval
Sleep(500)
// get K-line data
let bars = exchange.GetRecords()
if (!bars || bars.length <= 20) {
continue
}
// calculate the Bollinger indicator
var boll = TA.BOLL(bars)
bars.forEach(function(bar, index) {
c.begin(bar)
// drawing operation
c.plot(boll[0][index], "Boll_Up", {overlay: true}) // Draw on the main chart
c.plot(boll[1][index], "Boll_Mid", {overlay: true}) // Draw on the main chart
c.plot(boll[2][index], "Boll_Down", {overlay: true}) // Draw on the main chart
c.plot(bar.Volume, "volume") // Draw on the sub-chart
c.close()
})
// Strategy trading logic
// ...
// ..
}
}
हम कोड में देख सकते हैं के रूप में, हमारे 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"}]
*/
इस तरह के एक विन्यास Binance स्पॉट एक्सचेंज ऑब्जेक्ट बैकटेस्टिंग परीक्षण का उपयोग करना है। बैकटेस्टिंग प्रभाव निम्नानुसार दिखाया गया हैः
यह देखा जा सकता है कि हम पाइन की ड्राइंग विधि का उपयोग करते हैं, जो जावास्क्रिप्ट भाषा में ड्राइंग कोड को बहुत सरल बनाता है।
K-लाइन डेटा प्राप्त करने और संकेतकों की गणना करने के संचालन प्लेटफार्म रणनीति वर्ग में रणनीति उदाहरणों में और एपीआई प्रलेखन में सामान्य और सरल हैं।
// obtain K-line data
let bars = exchange.GetRecords()
if (!bars || bars.length <= 20) {
// If the acquisition of the K line fails, that is, if !bar is true, execute continue, ignore the following code, and re-execute the loop
// If bars.length is less than or equal to 20, that is, the number of K-line BAR (bar) is less than 20, the indicator cannot be calculated, and continue is also executed
continue
}
// Calculate the Bollinger indicator
var boll = TA.BOLL(bars)
बोलिंगर संकेतक की गणना फ़ंक्शन TA.BOLL, यदि बोलिंगर संकेतक पैरामीटर निर्दिष्ट नहीं हैं, तो डिफ़ॉल्ट पैरामीटरBOLL(20, 2)
बोलिंगर संकेतक में तीन पंक्तियाँ होती हैं, इसलिए TA.BOLL फ़ंक्शन द्वारा लौटाए गए डेटा एक दो आयामी सरणी है। बोल[0], बोल[1], और बोल[2] बोल सरणी के तीन तत्व हैं, जिनमें से प्रत्येक एक रेखा का प्रतिनिधित्व करता है और एक सरणी है।
फिर हम देखेंगे कि कैसे K-लाइन डेटा की मात्रा को आकर्षित करने के लिए, अर्थात्, मात्रा, और चार्ट पर गणना की बोलिंगर संकेतक डेटा.
हम K-लाइन डेटा बार बार आकर्षित करते हैं, तो हम पूरे K-लाइन सरणी को पार करने की जरूरत है, कि है, कोड में सलाखों सरणी को पार.forEach
विधि का उपयोग यहाँ पार करने के लिए किया जाता है, या for लूप का उपयोग पार करने के लिए किया जा सकता है।
bars.forEach(function(bar, index) {
c.begin(bar)
// Drawing operations
c.plot(boll[0][index], "Boll_Up", {overlay: true}) // {overlay: true} Parameter control, drawn on the main chart
c.plot(boll[1][index], "Boll_Mid", {overlay: true}) // Draw on the main chart
c.plot(boll[2][index], "Boll_Down", {overlay: true}) // Draw on the main chart
c.plot(bar.Volume, "volume") // Draw on the sub-chart
c.close()
})
यह ध्यान दिया जाना चाहिए कि जब भी आप एक बार पर एक चार्ट ड्राइंग ऑपरेशन शुरू करते हैं, तो आपको एकc.begin(bar)
फ़ंक्शन कॉल पहले.begin
फ़ंक्शन हमारे चार्ट ऑब्जेक्ट सी विधि में से एक है। ड्राइंग ऑपरेशन के अंत में,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({overlay : true})
// Strategy main loop
while(true) {
// Polling interval
Sleep(500)
// Obtain K-line data
let bars = exchange.GetRecords()
if (!bars || bars.length <= 20) {
continue
}
// Calculate Bollinger indicator
var boll = TA.BOLL(bars)
bars.forEach(function(bar, index) {
c.begin(bar)
// Drawing operations
c.plot(boll[0][index], "Boll_Up", {overlay: true}) // Draw on the main chart
c.plot(boll[1][index], "Boll_Mid", {overlay: true}) // Draw on the main chart
c.plot(boll[2][index], "Boll_Down", {overlay: true}) // Draw on the main chart
c.plot(bar.Volume, "volume", {overlay: false}) // Draw on the sub-chart
c.hline(bar.Open, {overlay: true}) // Horizontal line
c.plotarrow(bar.Close - bar.Open, {overlay: true}) // Arrow
c.plotshape(bar.Close - bar.Open > 0, {style: 'square'}) // Draw square markers
c.plotchar(bar.Close - bar.Open < 0, {char: 'X'}) // Draw the character X
c.close()
})
// Strategy trading logic
// ...
// ..
}
}
चार्ट शैली को कॉन्फ़िगर करने के लिए एक संरचना घोषित की जा सकती है। उदाहरण के लिए, निम्न चार्टCfg चर ग्रिड लाइन की कॉन्फ़िगरेशन जानकारी का प्रतिनिधित्व करता है।
var chartCfg = {
grid: {
show: true,
// Grid horizontal line
horizontal: {
show: true,
size: 2,
color: '#FF0000', // Color of horizontal grid line
// 'solid'|'dash'
style: 'dash', // Type of line
dashValue: [2, 2]
},
// Grid vertical line
vertical: {
show: true,
size: 2,
color: '#32CD32',
// 'solid'|'dash'
style: 'solid',
dashValue: [2, 2]
}
},
}
चार्ट कॉन्फ़िगरेशन ऑब्जेक्ट डेटा संरचना है जो चार्ट के कुछ गुणों और उपस्थिति को सेट करती है। उदाहरण के लिए, उदाहरण में ग्रिड लाइन शैली कॉन्फ़िगरेशन का उपयोग किया जाता है। कई विकल्प भी हैं जिन्हें कॉन्फ़िगर और संशोधित किया जा सकता है, जैसे कि एक्स-अक्ष, वाई-अक्ष से संबंधित सेटिंग्स, कर्सर लाइन सेटिंग्स, अलर्ट संदेश सेटिंग्स, तकनीकी संकेतक शैली सेटिंग्स, के-लाइन बार शैली सेटिंग्स, आदि।
बेशक, अगर आप इन के साथ परिचित नहीं हैं, आप चार्ट विन्यास ऑब्जेक्ट में पारित नहीं कर सकते जब कॉलKLineChart
एक चार्ट ऑब्जेक्ट बनाने के लिए फ़ंक्शन. तो बनाया चार्ट डिफ़ॉल्ट शैली है. एपीआई फ़ंक्शन का उपयोग करेंKLineChart
चार्ट ऑब्जेक्ट बनाने के लिए FMZ प्लेटफॉर्म का कार्यः
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,
// Grid horizontal line
horizontal: {
show: true,
size: 2,
color: '#FF0000',
// 'solid'|'dash'
style: 'dash',
dashValue: [2, 2]
},
// Grid vertical line
vertical: {
show: true,
size: 2,
color: '#32CD32',
// 'solid'|'dash'
style: 'solid',
dashValue: [2, 2]
}
},
}
var c = KLineChart(chartCfg)
// Strategy main loop
while(true) {
// Polling interval
Sleep(500)
// Obtain K-line data
var bars = _C(exchange.GetRecords)
bars.forEach(function(bar, index) {
c.begin(bar)
c.close()
})
// Strategy trading logic
// ...
// ..
}
}
इसका प्रयोग चार्ट कॉन्फ़िगरेशन शैली सेटिंग्स को संदर्भित करने के लिए किया जा सकता है।
{
// Gridlines
grid: {
show: true,
// Grid horizontal line
horizontal: {
show: true,
size: 1,
color: '#393939',
// 'solid'|'dash'
style: 'dash',
dashValue: [2, 2]
},
// Grid vertical line
vertical: {
show: false,
size: 1,
color: '#393939',
// 'solid'|'dash'
style: 'dash',
dashValue: [2, 2]
}
},
// Candlestick chart
candle: {
// The distance between the top and bottom of the candlestick chart, greater than 1 is the absolute value, greater than 0, and 1 is the proportion
margin: {
top: 0.2,
bottom: 0.1
},
// Type of Candlestick Charts 'candle_solid'|'candle_stroke'|'candle_up_stroke'|'candle_down_stroke'|'ohlc'|'area'
type: 'candle_solid',
// Candle pillar
bar: {
upColor: '#26A69A',
downColor: '#EF5350',
noChangeColor: '#888888'
},
// Area map
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,
// Highest price marker
high: {
show: true,
color: '#D9D9D9',
textMargin: 5,
textSize: 10,
textFamily: 'Helvetica Neue',
textWeight: 'normal'
},
// Lowest price marker
low: {
show: true,
color: '#D9D9D9',
textMargin: 5,
textSize: 10,
textFamily: 'Helvetica Neue',
textWeight: 'normal',
},
// Latest price marker
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
}
}
},
// Tips
tooltip: {
// 'always' | 'follow_cross' | 'none'
showRule: 'always',
// 'standard' | 'rect'
showType: 'standard',
labels: ['time', 'open', 'close', 'high', 'low', 'volume'],
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
}
}
},
// Technical indicators
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'
},
// Latest value marker
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
}
},
// Tips
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-axis
xAxis: {
show: true,
height: null,
// x-axis line
axisLine: {
show: true,
color: '#888888',
size: 1
},
// x-axis split text
tickText: {
show: true,
color: '#D9D9D9',
family: 'Helvetica Neue',
weight: 'normal',
size: 12,
paddingTop: 3,
paddingBottom: 6
},
// x-axis split line
tickLine: {
show: true,
size: 1,
length: 3,
color: '#888888'
}
},
// y-axis
yAxis: {
show: true,
width: null,
// 'left' | 'right'
position: 'right',
// 'normal' | 'percentage' | 'log'
type: 'normal',
inside: false,
reverse: false,
// y-axis line
axisLine: {
show: true,
color: '#888888',
size: 1
},
// y-axis split text
tickText: {
show: true,
color: '#D9D9D9',
family: 'Helvetica Neue',
weight: 'normal',
size: 12,
paddingLeft: 3,
paddingRight: 6
},
// y-axis split line
tickLine: {
show: true,
size: 1,
length: 3,
color: '#888888'
}
},
// Split line between charts
separator: {
size: 1,
color: '#888888',
fill: true,
activeBackgroundColor: 'rgba(230, 230, 230, .15)'
},
// Crosshair
crosshair: {
show: true,
// Horizontal line and text of crosshair
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 line and text of crosshair
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'
}
}
},
// Graph
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'
}
}
}
क्या इससे रणनीति तैयार करना आसान नहीं हो जाता है?