TradingView 自定义按钮

自定义按钮

var widget = new TradingView.widget;
widget.createButton({align: "left"})
                    .attr('title', "分时")
                    .on('click', function (e) {
                        chart.setResolution("1");  //1分钟
                        chart.setChartType(3);  //type为3  是面积图（可以省略此行）
}).append($('<span>分时</span>'));

以下是自定义时间分辨率并指定分时显示面积图：

var widget = new TradingView.widget;
widget.onChartReady(() => {

          const _self = this;
          let chart = widget.chart();
          const btnList = [
            {
              label:'分时',
              resolution: "1",
              chartType: 3
            },
            {

              label:'5min',
              resolution: "5",
            },
            {
              label:'15min',
              resolution: "15",
            },
            {
              label:'30min',
              resolution: "30",
            },
            {
              label:'1h',
              resolution: "60",
            },
            {
              class:'selected',
              label:'日线',
              resolution: "1D"
            },
          ];
          chart.onIntervalChanged().subscribe(null, function (interval, obj) {
            widget.changingInterval = false;
          });
          btnList.forEach(function (item) {
            let button = widget.createButton({
              align: "left"
            });
            item.resolution === widget._options.interval && updateSelectedIntervalButton(button);
            button.attr('class', "button " + item.class).attr("data-chart-type", item.chartType === undefined ? 8 : item.chartType).on('click', function (e) {
              // if (!_self.widget.changingInterval && !button.hasClass("selected")) {
              let chartType = +button.attr("data-chart-type");
              // let resolution = button.attr("data-resolution");
              if (chart.resolution() !== item.resolution) {
                // _self.widget.changingInterval = true;
                chart.setResolution(item.resolution);
              }
              if (chart.chartType() !== chartType) {
                chart.setChartType(chartType);
              }
              updateSelectedIntervalButton(button);
              // }
            }).append(item.label);
          });
          widget.chart().createStudy('Moving Average', false, true, [5, "close", 0], null, {'Plot.color': "#7D53A8"});
          widget.chart().createStudy('Moving Average', false, true, [10, "close", 0], null, {'Plot.color': "#7699C2"});
          widget.chart().createStudy('Moving Average', false, true, [30, "close", 0], null, {'Plot.color': "#A0D75B"});
          function updateSelectedIntervalButton(button) {
            widget.selectedIntervalButton && widget.selectedIntervalButton.removeClass("selected");
            button.addClass("selected");
            widget.selectedIntervalButton = button;
          }
        })