vue TradingView设置均线和隐藏均线

最新推荐文章于 2026-03-24 00:30:38 发布

原创最新推荐文章于 2026-03-24 00:30:38 发布 · 4k 阅读

2 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#前端 #vue

Vue 专栏收录该内容

13 篇文章

订阅专栏

这篇博客详细介绍了如何在VueTradingView组件中创建和配置不同周期的移动平均线（MA），包括绿色的5日MA，红色的10日MA和蓝色的20日MA。同时，提供了代码示例展示如何在后期隐藏这些均线，只需调用setVisible(false)方法即可。文章还附带了两个相关的VueTradingView教程链接，分别涉及k线标记和自定义周期设置。

该文章已生成可运行项目，

设置均线

在这里插入图片描述

       //均线
          _this.MALine5 = widget
            .chart()
            .createStudy("Moving Average", false, false, [5, "close", 0], null, {
              "Plot.color": "green",
              "Plot.linewidth": 0,
            });
          _this.MALine10 = widget
            .chart()
            .createStudy("Moving Average", false, false, [10, "close", 0], null, {
              "Plot.color": "red",
              "Plot.linewidth": 0,
            });
          _this.MALine20 = widget
            .chart()
            .createStudy("Moving Average", false, false, [20, "close", 0], null, {
              "Plot.color": "#409EFF",
              "Plot.linewidth": 0,
            });

位置截图：

在onChartReady里面和自定义周期同级
在这里插入图片描述

隐藏均线

在这里插入图片描述

在设置的下面.setVisible(false)即可

  //均线
          _this.MALine5 = widget
            .chart()
            .createStudy("Moving Average", false, false, [5, "close", 0], null, {
              "Plot.color": "green",
              "Plot.linewidth": 0,
            });
          _this.MALine10 = widget
            .chart()
            .createStudy("Moving Average", false, false, [10, "close", 0], null, {
              "Plot.color": "red",
              "Plot.linewidth": 0,
            });
          _this.MALine20 = widget
            .chart()
            .createStudy("Moving Average", false, false, [20, "close", 0], null, {
              "Plot.color": "#409EFF",
              "Plot.linewidth": 0,
            });

          widget.chart().getStudyById(_this.MALine5).setVisible(false);

          widget.chart().getStudyById(_this.MALine10).setVisible(false);

          widget.chart().getStudyById(_this.MALine20).setVisible(false);