Kevin
Kevin

Reputation: 152

how do I render PyChart.JS charts in web2py?

So I'm trying to make use of the PyChartJS module and so far I have this. This is the class for the PieChart:

class newPieChart(BaseChart):

def setData(self, _data: dict):
    self.data.data = [_ for _ in _data.values()]
    return

def setLabels(self, _labels: list):
    self.labels.labels = [_ for _ in _labels]
    return

type = ChartType.Pie

class labels:
    labels = []

class data:
    data = []

And I'm using setData() to fill the chart with data

{'Allowance': 20.0, 'Bonus': 30.0, 'Other': 80.0, 'Salary': 300.0}

Now, whenever I try newPieChart.get() I get the JSON back needed for the render in JS. This is what it returns:

{'type': 'pie', 'data': {'labels': [], 'datasets': [{'data': [20.0, 30.0, 80.0, 300.0]}]}, 'options': {'plugins': {}}}

The chart however doesn't render, as this is how it shows up in my JS code:

{'type': 'pie', 'data': {'labels': [], 'datasets': [{'data': [20.0, 30.0, 80.0, 300.0]}]}, 'options': {'plugins': {}}}

My question is, how do I render this chart correctly? How do I fix this? This is how I implemented it in my JavaScript code:

var ctx = document.getElementById('expense').getContext('2d');
var expensechart = new Chart(ctx, {{=chart}})

Upvotes: 0

Views: 515

Answers (1)

Kevin
Kevin

Reputation: 152

I fixed the issue by calling the built-in XML() helper

var expensechart = new Chart(ctx, {{=XML(chart)}})

This fixes the issue of JSON not rendering correctly inside the HTML

Upvotes: 1

Related Questions