Question

我试图通过Flask渲染一个简单的Highchart，一切正常，但它向我显示y轴上的x轴，反之亦然！我想在X轴上有几个月，在Y轴上有温度。这就是我得到的（见图）。有谁知道我做错了什么？这是我的代码： app.py：

from flask import Flask, render_template
app = Flask(__name__)

@app.route("/chart3/")
def chart_3():
    chartID = 'chart_ID'
    chart = {"renderTo": chartID, "type": 'bar', "height": 450}
    title = {"text": 'Average Monthly Temperature'}
    xAxis = {"categories": ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']}
    yAxis = {"labels": {"format": '{value}°C'}, "title": {"text": 'Temperature'}}
    series = [ {"name": 'City', "data": [1,2,3,4,5,6,7,80,9,10,11]} ]  
    return render_template("chart3.html", chartID=chartID, chart=chart, title=title, xAxis=xAxis, yAxis=yAxis, series=series)

if __name__ == "__main__":
    app.run()

这是我的graph.js：

$(document).ready(function() {
    $(chart_id).highcharts({
        chart: chart,
        title: title,
        xAxis: xAxis,
        yAxis: yAxis,
        series: series
    });
});

这是我的chart3.html：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="description" content="">
        <meta name="keywords" content="">
        <meta name="author" content="">
        <meta charset="utf-8">
    </head>

    <body>
        <div id = {{ chartID|safe }} class="chart" style="height: 100px; width: 500px"></div>
        <script>
            var chart_id = {{ chartID|safe }}
            var series = {{ series|safe }}
            var title = {{ title|safe }}
            var xAxis = {{ xAxis|safe }}
            var yAxis = {{ yAxis|safe }}
            var chart = {{ chart|safe }}
        </script>
        <script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8="
        crossorigin="anonymous"></script>
        <script src="https://code.highcharts.com/highcharts.js"></script>
        <script src="../static/js/graph.js"></script>
    </body>
</html>

Answer 1

我找到了答案。图表类型必须为column而不是bar。对于每个正在努力解决同一问题的人来说，这里是代码：

chart = {“renderTo”：chartID，“type”：'column'，“height”：450}

Highcharts中的轴（Python / Flask）

1 个答案: