Fusioncharts入门指南页仍为空

2024-10-04 11:29:57 发布

您现在位置:Python中文网/ 问答频道 /正文

我刚刚安装了fusionchartsuitextv3.13.4,以便在(Python)Django应用程序中使用。我已经完成了入门指南(https://www.fusioncharts.com/dev/getting-started/django/your-first-chart-using-django#installation-2),但我似乎无法让它工作。我没有得到一个错误,但我的网页仍然是完全空的。我不知道我做错了什么,我完全遵循了教程。你知道吗

你知道吗破折号.html你知道吗

<!-- Filename: app_name/templates/index.html -->
<!DOCTYPE html>
<html>

<head>
<title>FC-python wrapper</title>
{% load static %}
<script type="text/javascript" src="{% static "https://cdn.fusioncharts.com/fusioncharts/latest/fusioncharts.js" %}"></script>
<script type="text/javascript" src="{% static "https://cdn.fusioncharts.com/fusioncharts/latest/themes/fusioncharts.theme.fusion.js" %}"></script>
</head>

<body>
<div id="myFirstchart-container">{{ output|safe }}</div>
</body>

</html>

你知道吗视图.py你知道吗

from django.shortcuts import render
from django.http import HttpResponse


from collections import OrderedDict

# Include the `fusioncharts.py` file that contains functions to embed the charts.
#from fusioncharts import FusionCharts
from vsdk.dashboard.fusioncharts import FusionCharts

def myFirstChart(request):

    #Chart data is passed to the `dataSource` parameter, like a dictionary in the form of key-value pairs.
    dataSource = OrderedDict()

    # The `chartConfig` dict contains key-value pairs of data for chart attribute
    chartConfig = OrderedDict()
    chartConfig['caption'] = 'Countries With Most Oil Reserves [2017-18]'
    chartConfig['subCaption'] = 'In MMbbl = One Million barrels'
    chartConfig['xAxisName'] = 'Country'
    chartConfig['yAxisName'] = 'Reserves (MMbbl)'
    chartConfig['numberSuffix'] = 'K'
    chartConfig['theme'] = 'fusion'

    # The `chartData` dict contains key-value pairs of data
    chartData = OrderedDict()
    chartData['Venezuela'] = 290
    chartData['Saudi'] = 260
    chartData['Canada'] = 180
    chartData['Iran'] = 140
    chartData['Russia'] = 115
    chartData['UAE'] = 100
    chartData['US'] = 30
    chartData['China'] = 30

    dataSource['chart'] = chartConfig
    dataSource['data'] = []

    # Convert the data in the `chartData`array into a format that can be consumed by FusionCharts.
    #The data for the chart should be in an array wherein each element of the array
    #is a JSON object# having the `label` and `value` as keys.

    #Iterate through the data in `chartData` and insert into the `dataSource['data']` list.
    for key, value in chartData.items():
        data = {}
    data['label'] = key
    data['value'] = value
    dataSource['data'].append(data)


# Create an object for the column 2D chart using the FusionCharts class constructor
# The chart data is passed to the `dataSource` parameter.
    column2D = FusionCharts("column2d", "ex1" , "600", "400", "chart-1", "json", dataSource)

    return  render(request, 'dash.html', {'output' : column2D.render(), 'chartTitle': 'Simple Chart Using Array'})

你知道吗网址.py你知道吗

from django.shortcuts import render
from django.urls import path

from vsdk.dashboard.fusioncharts import FusionCharts
from . import views

from django.conf.urls import url, include

urlpatterns = [
    url(r'^$', views.myFirstChart, name = 'demo'),
]

Tags: thedjangokeyinfromimportdatavalue
1条回答
网友
1楼 · 发布于 2024-10-04 11:29:57

“入门指南”中的说明有点混乱,并且有一些错误。这是我的Fusionchart示例的工作版本。你知道吗

Fusionchart示例

可以使用FusionCharts以html格式呈现图表。我已经在Getting Started Guide的基础上构建了这个示例,并在这里和那里进行了调整以使其工作。要复制,只需执行以下操作:

复制我的github代码,这将创建一个新的项目目录fusionchart_example。你知道吗

git clone https://github.com/bvermeulen/fusionchart_example

树状结构应如下所示:

enter image description here

转到这个文件夹并为Django创建一个虚拟环境,注意我使用的是python3.6.8,但是其他python3.6或3.7也可以。你知道吗

python -m venv ./venv

激活环境(Linux)

source ./venv/bin/activate

(或窗口)

./venv/scripts/activate

启用虚拟环境后,安装Django

pip install django==2.2.3

你现在可以运行应用程序了

python manage.py runserver

并在127.0.0.1:8000的浏览器中查看结果,结果如下所示:

enter image description here

当您克隆了我的github时,您可以查看源代码,特别是settings.py,但是我将下面的urls.pyviews.pychart.html作为第一个参考。你知道吗

你知道吗网址.py地址:

from django.urls import path
from render_graph import views

urlpatterns = [
    path('', views.chart, name='chart'),

]

你知道吗视图.py地址:

from django.shortcuts import render
from django.http import HttpResponse
from collections import OrderedDict

# Include the `fusioncharts.py` file that contains functions to embed the charts.
from fusioncharts import FusionCharts
from pprint import pprint

def chart(request):

    #Chart data is passed to the `dataSource` parameter, like a dictionary in the form of key-value pairs.
    dataSource = OrderedDict()

    # The `chartConfig` dict contains key-value pairs of data for chart attribute
    chartConfig = OrderedDict()
    chartConfig["caption"] = "Countries With Most Oil Reserves [2017-18]"
    chartConfig["subCaption"] = "In MMbbl = One Million barrels"
    chartConfig["xAxisName"] = "Country"
    chartConfig["yAxisName"] = "Reserves (MMbbl)"
    chartConfig["numberSuffix"] = "K"
    chartConfig["theme"] = "fusion"

    # The `chartData` dict contains key-value pairs of data
    chartData = OrderedDict()
    chartData["Venezuela"] = 290
    chartData["Saudi"] = 260
    chartData["Canada"] = 180
    chartData["Iran"] = 140
    chartData["Russia"] = 115
    chartData["UAE"] = 100
    chartData["US"] = 30
    chartData["China"] = 30

    dataSource["chart"] = chartConfig
    dataSource["data"] = []

    # Convert the data in the `chartData`array into a format that can be consumed by FusionCharts.
    #The data for the chart should be in an array wherein each element of the array
    #is a JSON object# having the `label` and `value` as keys.

    #Iterate through the data in `chartData` and insert into the `dataSource['data']` list.
    for key, value in chartData.items():
        dataSource["data"].append({'label':key, 'value': value})

    # print the datasource to see what will be rendered
    pprint(dataSource)

    # Create an object for the column 2D chart using the FusionCharts class constructor
    # The chart data is passed to the `dataSource` parameter.
    column2D = FusionCharts("column2d", "Oil_Reserves", "600", "400", "Oil_Reserves-container", "json", dataSource)

    context = {'output': column2D.render(), }

    return render(request, 'chart.html', context)

你知道吗图表.html地址:

<!DOCTYPE html>
<html>
  <head>
    <title>Oil Reserves</title>
    {% load static %}
    <script type="text/javascript" src="{% static 'fusioncharts/types/fusioncharts.js' %}"></script>
    <script type="text/javascript" src="{% static 'fusioncharts/themes/fusioncharts.theme.fusion.js' %}"></script>

  <link rel="icon" href="data:,">
  </head>

  <body>
    <div id="Oil_Reserves-container">{{ output|safe }}</div>
  </body>

</html>

Fusioncharts说这是一个试用版,所以最好检查一下是否涉及任何费用。如果你需要更多的信息,请告诉我。祝你好运。。。你知道吗

布鲁诺·维梅伦 布鲁诺·维梅伦@hotmail.com 2019年7月8日

相关问题 更多 >