7、創建自定義指標 · tradingView開發文檔

# 7、創建自定義指標 # 創建自定義指標 - - - - - - ## 如何顯示您的數據作為一個指標如果您想要在圖表上顯示一些數據，例如指標，則此處為食用說明。請遵循以下幾個步驟: 1. 為您的數據創建一個新的ticker，并設置您的服務器返回此ticker有效的SymbolInfo。 2. 設置服務器以返回此ticker的有效歷史數據。 3. 使用以下指標模板并填寫所有占位符(placeholder)的值：名稱，說明和代碼。如果需要，還可以修改繪圖的默認樣式。 ``` { // 將<study name>替換為您的指標名稱 // 它將由圖表庫內部使用 name: "<study name>", metainfo: { "_metainfoVersion": 40, "id": "<study name>@tv-basicstudies-1", "scriptIdPart": "", "name": "<study name>", // 此說明將顯示在指標窗口中 // 當調用createStudy方法時，它也被用作“name”參數 "description": "<study description>", // 該描述將顯示在圖表上 "shortDescription": "<short study description>", "is_hidden_study": true, "is_price_study": true, "isCustomIndicator": true, "plots": [{"id": "plot_0", "type": "line"}], "defaults": { "styles": { "plot_0": { "linestyle": 0, "visible": true, // 繪圖線寬度 "linewidth": 2, // 繪制類型: // 1 - 直方圖 // 2 - 線形圖 // 3 - 十字指針 // 4 - 山形圖 // 5 - 柱狀圖 // 6 - 圓圈圖 // 7 - 中斷線 // 8 - 中斷區塊 "plottype": 2, // 顯示價格線? "trackPrice": false, // 繪制透明度，百分比。 "transparency": 40, // 以#RRGGBB格式繪制顏色 "color": "#0000FF" } }, // 指標輸出值的精度 // (小數點后的位數)。 "precision": 2, "inputs": {} }, "styles": { "plot_0": { // 輸出的名字將在樣式窗口顯示 "title": "-- output name --", "histogramBase": 0, } }, "inputs": [], }, constructor: function() { this.init = function(context, inputCallback) { this._context = context; this._input = inputCallback; // 定義要繪制的商品。 // 商品應該是一個字符串。 // 您可以使用PineJS.Std.ticker（this._context）獲取所選商品的代碼。 // 例, // var symbol = "AAPL"; // var symbol = "#EQUITY"; // var symbol = PineJS.Std.ticker(this._context) + "#TEST"; var symbol = "<TICKER>"; this._context.new_sym(symbol, PineJS.Std.period(this._context), PineJS.Std.period(this._context)); }; this.main = function(context, inputCallback) { this._context = context; this._input = inputCallback; this._context.select_sym(1); // 您可以在PineJS.Std對象中使用以下內置函數： // open, high, low, close // hl2, hlc3, ohlc4 var v = PineJS.Std.close(this._context); return [v]; } } } ``` 1. 將指標保存到具有以下結構的自定義指標文件中: ``` __customIndicators = [ *** 您的指標對象，由模板創建 *** ]; ``` 請注意，該指標文件是一個JavaScript源文件，它定義了一個指標對象數組。因此，您可以在其中放置多個指標，或者將它們與我們為您編譯的指標組合起來。 1. 使用 [indicators\_file\_name](Widget-Constructor.html#indicatorsfilename) Widget構造函數的選項來從指標文件加載自定義指標。 2. 圖表準備好后，更新您的Widget初始化代碼以[創建](Chart-Methods.html#createstudyname-forceoverlay-lock-inputs-callback-overrides-options) 此指標。 ## 例子 1. 使用[indicators\_file\_name](Widget-Constructor.html#indicators_file_name)選項將指標添加到圖表庫。 2. 更改Widget的初始化代碼。這是一個例子。 ``` widget = new TradingView.widget(/* ... */); widget.onChartReady(function() { widget.chart().createStudy('<indicator-name>', false, true); }); ``` ### 請求另一個商品代碼的數據假設您希望在圖表上顯示用戶的權益曲線。你必須做以下事情： - 為新的代碼創建一個名稱。假設它為 `#EQUITY` 代碼。您可以使用您想像到的任何名字。 - 更改服務器的代碼以將此代碼作為有效商品。為此返回最小的有效SymbolInfo。 - 使服務器返回有效的歷史記錄。即，服務器可以詢問您的數據庫的股權歷史記錄，并返回此數據，就像返回普通商品的歷史記錄一樣（例如 `AAPL`)。 - 采用上述指標模板，創建指標文件（或向現有指標文件添加新指標）。例如： ``` __customIndicators = [ { name: "Equity", metainfo: { "_metainfoVersion": 40, "id": "Equity@tv-basicstudies-1", "scriptIdPart": "", "name": "Equity", "description": "Equity", "shortDescription": "Equity", "is_hidden_study": true, "is_price_study": true, "isCustomIndicator": true, "plots": [{"id": "plot_0", "type": "line"}], "defaults": { "styles": { "plot_0": { "linestyle": 0, "visible": true, // 使線條變細 "linewidth": 1, // 繪制類型為線性圖 "plottype": 2, // 顯示價格線 "trackPrice": true, "transparency": 40, // 為圖線設置深紅色。 "color": "#880000" } }, // 精度是一位數，如777.7 "precision": 1, "inputs": {} }, "styles": { "plot_0": { // 輸出名字在樣式窗口顯示 "title": "Equity value", "histogramBase": 0, } }, "inputs": [], }, constructor: function() { this.init = function(context, inputCallback) { this._context = context; this._input = inputCallback; var symbol = "#EQUITY"; this._context.new_sym(symbol, PineJS.Std.period(this._context), PineJS.Std.period(this._context)); }; this.main = function(context, inputCallback) { this._context = context; this._input = inputCallback; this._context.select_sym(1); var v = PineJS.Std.close(this._context); return [v]; } } } ]; ``` - 使用[indicators\_file\_name](Widget-Constructor.html#indicatorsfilename) 選項將指標插入圖表。 - 更改Widget的初始化代碼。添加如下內容： ``` widget = new TradingView.Widget(/* ... */); widget.onChartReady(function() { widget.chart().createStudy('Equity', false, true); }); ``` ### 著色K線 ``` __customIndicators = [ { name: "Bar Colorer Demo", metainfo: { _metainfoVersion: 42, id: "BarColoring@tv-basicstudies-1", name: "BarColoring", description: "Bar Colorer Demo", shortDescription: "BarColoring", scriptIdPart: "", is_price_study: true, is_hidden_study: false, isCustomIndicator: true, isTVScript: false, isTVScriptStub: false, defaults: { precision: 4, palettes: { palette_0: { // 調色板顏色 // 將其更改為您喜歡的默認顏色， // 但請注意，用戶可以在“樣式”選項卡中更改它們 // 指標屬性 colors: [ { color: "#FFFF00" }, { color: "#0000FF" } ] } } }, inputs: [], plots: [{ id: "plot_0", // plot類型應設置為 'bar_colorer' type: "bar_colorer", // 這是定義的調色板的名稱 // 在 'palettes' 和 'defaults.palettes' 部分 palette: "palette_0" }], palettes: { palette_0: { colors: [ { name: "Color 0" }, { name: "Color 1" } ], // 值之間的映射 // 返回腳本和調色板顏色 valToIndex: { 100: 0, 200: 1 } } } }, constructor: function() { this.main = function(context, input) { this._context = context; this._input = input; var valueForColor0 = 100; var valueForColor1 = 200; // 在這里執行計算并返回其中一個常量 // 在'valToIndex'映射中指定為鍵 var result = Math.random() * 100 % 2 > 1 ? // we randomly select one of the color values valueForColor0 : valueForColor1; return [result]; } } } ]; ```