Question

已编辑

我有一个代码可以在wxPython WebView中显示html，但它只是加载html文件，而没有css和javascript。这是我的代码。

gui.py

class MainFrame(wx.Frame):
    def __init__( self, parent ):
        wx.Frame.__init__ ( self, parent, id = wx.ID_ANY, title = u"PlagDetect", pos = wx.DefaultPosition, size = wx.Size( 493,389 ),
        self.htmlSummary = wx.html2.WebView.New(self)

        page = """
            <!DOCTYPE html>
            <html lang="en">
            <head>
                <meta charset="UTF-8">
                <title>Summary</title>
            </head>
            <body>
                <h1>Summary</h1>

                <div id="piechart"></div>

                <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>

                <script type="text/javascript">
                    // Load google charts
                    google.charts.load('current', {'packages':['corechart']});
                    google.charts.setOnLoadCallback(drawChart);

                    // Draw the chart and set the chart values
                    function drawChart() {
                      var data = google.visualization.arrayToDataTable([
                      ['Task', 'Hours per Day'],
                      ['Work', 8],
                      ['Eat', 2],
                      ['TV', 4],
                      ['Gym', 2],
                      ['Sleep', 8]
                    ]);

                      // Optional; add a title and set the width and height of the chart
                      var options = {'title':'My Average Day', 'width':550, 'height':400};

                      // Display the chart inside the <div> element with id="piechart"
                      var chart = new google.visualization.PieChart(document.getElementById('piechart'));
                      chart.draw(data, options);
                    }
                </script>
            </body>
            </html>
        """

        summary.htmlSummary.SetPage(page, "")

由于萨克森的@Rolf先生，我找到了用PieCtrl而不是WebView来创建饼图的答案。答案写在下面。

Answer 1

要回答您的评论，“是否还有其他方法可以在wxpython中创建饼图”，可以，请参见：https://wxpython.org/Phoenix/docs/html/wx.lib.agw.piectrl.PieCtrl.html

最简单的方法：

import wx
import wx.lib.agw.piectrl
from wx.lib.agw.piectrl import PieCtrl, PiePart

class Frame(wx.Frame):

    def __init__(self, parent):
        wx.Frame.__init__ (self, parent, -1, "Simple Pie Chart")

        panel = wx.Panel(self, -1, size=(650,650))
        # Create A Simple PieCtrl With 3 Sectors
        self._pie = PieCtrl(panel, -1, wx.DefaultPosition, wx.Size(180,270))

        self._pie.GetLegend().SetTransparent(True)
        self._pie.GetLegend().SetHorizontalBorder(10)
        self._pie.GetLegend().SetWindowStyle(wx.STATIC_BORDER)
        self._pie.GetLegend().SetLabelFont(wx.Font(10, wx.FONTFAMILY_DEFAULT,
                                                   wx.FONTSTYLE_NORMAL,
                                                   wx.FONTWEIGHT_NORMAL,
                                                   False, "Courier New"))
        self._pie.GetLegend().SetLabelColour(wx.Colour(0, 0, 127))

        self._pie.SetHeight(10)
        self._pie.SetAngle(0.35)

        part = PiePart()

        part.SetLabel("Label_1")
        part.SetValue(300)
        part.SetColour(wx.Colour(200, 50, 50))
        self._pie._series.append(part)

        part = PiePart()
        part.SetLabel("Label 2")
        part.SetValue(200)
        part.SetColour(wx.Colour(50, 200, 50))
        self._pie._series.append(part)

        part = PiePart()
        part.SetLabel("Label 3")
        part.SetValue(50)
        part.SetColour(wx.Colour(50, 50, 200))
        self._pie._series.append(part)
        self.Show()

app = wx.App()
frame = Frame(None)
app.MainLoop()

Answer 2

在对您发布的代码进行少量清理之后，它似乎可以正常工作。尽管我看不到任何css，但是javascript部分有效
注意：我在Linux上运行

import wx
import wx.html2


class MainFrame(wx.Frame):
    def __init__( self, parent ):
        wx.Frame.__init__ ( self, parent, id = wx.ID_ANY, title = u"PlagDetect", pos = wx.DefaultPosition, size = wx.Size( 600,450 ))
        self.htmlSummary = wx.html2.WebView.New(self)
        page = """
            <!DOCTYPE html>
            <html lang="en">
            <head>
                <meta charset="UTF-8">
                <title>Summary</title>
            </head>
            <body>
                <h1>Summary</h1>

                <div id="piechart"></div>

                <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>

                <script type="text/javascript">
                    // Load google charts
                    google.charts.load('current', {'packages':['corechart']});
                    google.charts.setOnLoadCallback(drawChart);

                    // Draw the chart and set the chart values
                    function drawChart() {
                      var data = google.visualization.arrayToDataTable([
                      ['Task', 'Hours per Day'],
                      ['Work', 8],
                      ['Eat', 2],
                      ['TV', 4],
                      ['Gym', 2],
                      ['Sleep', 8]
                    ]);

                      // Optional; add a title and set the width and height of the chart
                      var options = {'title':'My Average Day', 'width':550, 'height':400};

                      // Display the chart inside the <div> element with id="piechart"
                      var chart = new google.visualization.PieChart(document.getElementById('piechart'));
                      chart.draw(data, options);
                    }
                </script>
            </body>
            </html>
        """

        self.htmlSummary.SetPage(page, "")

if __name__ == "__main__":

    app = wx.App()
    frame_1 = MainFrame(None)
    frame_1.Show()
    app.MainLoop()

wxPython创建饼图的另一种方法

2 个答案: