0

我是一个 Python 人,但尝试在 Visual Studio 代码中使用 node.js 来绘制由交易视图提供支持的烛台图。

TradingView 提供了一个名为轻量级图表的包,我正在尝试在我的 node.js 项目中使用它。但是在运行项目文件时,我遇到了一个我无法理解的错误。我也尝试在谷歌上搜索它,不幸的是没有解决方案。

错误是 ReferenceError: document is not defined。

我从一个运行良好的 youtube 视频中复制了代码。还使用 npm install light-charts 安装了包轻量级图表。

我的项目中有两个文件名为 index.html 和 index.js。文件中的内容

index.js

const log = console.log;

const chartProperties = {
  width:1500,
  height:600,
  timeScale:{
    timeVisible:true,
    secondsVisible:false,
  }
}

const domElement = document.getElementById('tvchart');
const chart = LightweightCharts.createChart(domElement,chartProperties);
const candleSeries = chart.addCandlestickSeries();
const data = [
    { time: '2018-10-19', open: 180.34, high: 180.99, low: 178.57, close: 179.85 },
    { time: '2018-10-22', open: 180.82, high: 181.40, low: 177.56, close: 178.75 },
    { time: '2018-10-23', open: 175.77, high: 179.49, low: 175.44, close: 178.53 },
    { time: '2018-10-24', open: 178.58, high: 182.37, low: 176.31, close: 176.97 },
    { time: '2018-10-25', open: 177.52, high: 180.50, low: 176.83, close: 179.07 },
    { time: '2018-10-26', open: 176.88, high: 177.34, low: 170.91, close: 172.23 },
    { time: '2018-10-29', open: 173.74, high: 175.99, low: 170.95, close: 173.20 },
    { time: '2018-10-30', open: 173.16, high: 176.43, low: 172.64, close: 176.24 },
    { time: '2018-10-31', open: 177.98, high: 178.85, low: 175.59, close: 175.88 },
    { time: '2018-11-01', open: 176.84, high: 180.86, low: 175.90, close: 180.46 },
    { time: '2018-11-02', open: 182.47, high: 183.01, low: 177.39, close: 179.93 },
    { time: '2018-11-05', open: 181.02, high: 182.41, low: 179.30, close: 182.19 },
    { time: '2018-11-06', open: 181.93, high: 182.65, low: 180.05, close: 182.01 },
    { time: '2018-11-07', open: 183.79, high: 187.68, low: 182.06, close: 187.23 },
    { time: '2018-11-08', open: 187.13, high: 188.69, low: 185.72, close: 188.00 },
    { time: '2018-11-09', open: 188.32, high: 188.48, low: 184.96, close: 185.99 },
    { time: '2018-11-12', open: 185.23, high: 186.95, low: 179.02, close: 179.43 },
    { time: '2018-11-13', open: 177.30, high: 181.62, low: 172.85, close: 179.00 },
    { time: '2018-11-14', open: 182.61, high: 182.90, low: 179.15, close: 179.90 },
    { time: '2018-11-15', open: 179.01, high: 179.67, low: 173.61, close: 177.36 },
    { time: '2018-11-16', open: 173.99, high: 177.60, low: 173.51, close: 177.02 },
    { time: '2018-11-19', open: 176.71, high: 178.88, low: 172.30, close: 173.59 }]

candleSeries.setData(data);

索引.html

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>Static Chart</title>
  </head>
  <body>
    <h2>Binance BTCUSDT Chart</h2>
    <div id="tvchart"></div>
  </body>
  <script src="https://unpkg.com/lightweight-charts/dist/lightweight-charts.standalone.production.js"></script>
  <script type="text/javascript" src="index.js"></script>
</html>

运行 index.js 文件时出现错误。错误是:

ReferenceError:文档未定义。

另外,如果我删除“const domElement = document.getElementById('tvchart');”行 从代码中,我得到的下一个错误是:

ReferenceError:未定义 LightweightCharts。

虽然已经安装了轻量级图表库。

我还尝试将 index.js 文件的扩展名更改为 index.mjs,同时通过添加“type”:“module”来编辑 package.json

我已经尝试了很多使这段代码工作但不能。您的任何帮助就像有人解决了对我来说确实是火箭科学的事情。

4

1 回答 1

1

“ReferenceError:文档未定义。” 您可能正在尝试通过节点运行 js 文件,节点无法访问文档对象(它是浏览器特定对象“),除非您将代码与 webpack / parcel / snowpack 之类的东西捆绑在一起,否则它将无法工作,

但是,如果您只是通过服务器提供静态文件,它将(我自己尝试了您的代码更改为 0 并且它可以工作),尝试将Live Server安装到您的 vscode 扩展,然后在您的目录中单击它以启动服务器(右下角)

于 2021-10-16T10:15:26.473 回答