首页 > 解决方案 > 将动态数据传递到 apexcharts

问题描述

我在绘制从 API 获得的数据时遇到问题。我成功地将数据显示在屏幕上,但无法在 Apexcharts 中使用。请帮帮我。

views.py

from django.shortcuts import render, HttpResponse
from api.models import stocks
import requests

# Create your views here.


def index(request):
    if request.method =="POST":
        symbol=request.POST.get('symbol',None)
        print()
        url='something....'

        data = {   
        "ticker": symbol
            }
        r = requests.post(url = url, data = data)

        something = r.json()
        param = {
            'strike':something['strike'],
            'calloi':something['calloi'],
            'putoi':something['putoi'],
        }
        return render(request,'index.html',param)
    return render(request,'index.html')


因此 URL 将数据提供为这种格式。我将这些数据传递到我的 Html 页面中,并希望使用这些数据在我的 index.html 页面中构建图表。我知道从 apexcharts 的官方文档中复制基本代码的过程,但没有找到使用从 API 获得的变量的方法。

```index.html```
<!DOCTYPE html>
<html lang="en">
<head>
  <title>IS test</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/css/bootstrap.min.css" rel="stylesheet">
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/js/bootstrap.bundle.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/apexcharts"></script>
  <script src="https://cdn.jsdelivr.net/npm/chart.js@3.5.1/dist/chart.min.js"></script>
</head>
<body>

<div class="container mt-3">
  <h2>Open Interest</h2>
  <form method="POST" action="">
    {% csrf_token %}
    <div class="mb-3 mt-3">
      <label for="symbol">Symbol:</label>
      <select class="form-select" id="symbol" name="symbol">
      <option value="RELIANCE">RELIANCE</option>
      <option value="SBIN">SBIN</option>
      <option value="INFY">INFY</option>
    </div>
    <br>
    <br>
    
     <div class="mb-3">
      <label for="date">Expiry:</label>
      <input type="date" class="form-control" id="date" name="date">
    </div> 
    <input type="submit" value="submit">
  </form>
</div>
{% if strike %}
<h1>strike</h1>
{% for i in strike %}
<h4>
  {{i}}
</h4>
{% endfor %}
<h1>calloi</h1>
{% for i in calloi %}
<h4>
  {{i}}
</h4>
{% endfor %}
<h1>putoi</h1>
{% for i in putoi %}
<h4>
  {{i}}
</h4>
{% endfor %}
{% endif %}
</body>
</html>

现在我该怎么办?

标签: apidjango-rest-frameworkdjango-viewsdynamic-dataapexcharts

解决方案


推荐阅读