なぜPythonのjson.dumpsがオブジェクトから文字列をシリアル化しないのですか？

Question

Pythonのjson.dumps()を使用すると、私のオブジェクトがDjangoサイトから正しくシリアル化されていません。呼び出し元のメソッドは、入力としてQuizをとり、それに関連するSubject項目からデータを追加

class ChartData: 
    def __init__(self): 
     self.labels = [] 
     self.data = [] 
     self.background_colours = [] 
     self.hover_background_colours = [] 

    def add_datum(self, label, datum, background_colour=None, hover_background_colour=None): 
     self.labels.append(label) 
     self.data.append(datum) 
     self.background_colours.append(background_colour) 
     self.hover_background_colours.append(hover_background_colour) 

    def get_converted_data(self): 
     return json.dumps({'labels': self.labels, 'data': self.data, 'background_colours': self.background_colours, 
          'hover_background_colours': self.hover_background_colours}) 

：

def get_subject_chart_data(quiz): 
    subjects = Subject.objects.filter(question__quizquestion__quiz=quiz).distinct() 
    chart_data = ChartData() 
    for subject in subjects: 
     chart_data.add_datum(subject.name, subject.question_set.filter(quizquestion__quiz=quiz).count()) 

    return chart_data.get_converted_data() 

私は Chart.jsコンポーネントへのデータの注入を行うために設計されたクラスを持っています

この変換されたデータは、レンダリングされるページのcontextに送信されます。これに続いて

def get_context_data(self, **kwargs): 
    context = super(QuizDetail, self).get_context_data(**kwargs) 
    quiz = self.get_object() 

    context['subject_chart_data'] = self.get_subject_chart_data(quiz) 

    return context 

、それがchart_data引数として渡される{% include %}文にレンダリングだ：

{% include 'snippets/pie_chart.html' with chart_data=subject_chart_data chart_id='subject_chart' chart_height=400 chart_width=400 %} 

最後に、HTMLが渡されたchart_dataを使用してグラフを描画：

<canvas id="{{ chart_id }}" width="{{ chart_width }}" height="{{ chart_height }}"></canvas> 
<script> 
    var ctx = document.getElementById("{{ chart_id }}"); 
    var chart = new Chart(ctx, { 
     type: 'doughnut', 
     data: { 
      labels: {{ chart_data.labels|safe }}, 
     datasets: [ 
      { 
       data: {{ chart_data.data|safe }}, 
       backgroundColor: {{ chart_data.background_colours|safe }} 
      }] 
     } 
    }); 
</script> 

json.dumps()が以下の例ではPython docsからどのように見えたのでしょうか？

>>> json.dumps(['foo', {'bar': ('baz', None, 1.0, 2)}]) 
'["foo", {"bar": ["baz", null, 1.0, 2]}]' 

しかし、それは次のように判明：

var chart = new Chart(ctx, { 
    type: 'doughnut', 
    data: { 
     labels: , 
    datasets: [ 
     { 
      data: , 
      backgroundColor: 
     }] 
    } 
}); 

しかし、私のような、json.dumps()にChartDataの各属性を渡す場合：

def get_converted_data(self): 
    return {'labels': json.dumps(self.labels), 'data': json.dumps(self.data), 
      'background_colours': json.dumps(self.background_colours), 
      'hover_background_colours': json.dumps(self.hover_background_colours)} 

それは問題なく動作します：

var chart = new Chart(ctx, { 
     type: 'doughnut', 
     data: { 
      labels: ["Geo"], 
     datasets: [ 
      { 
       data: [2], 
       backgroundColor: [null], 
       hoverBackgroundColor: [null] 
      }] 
     } 
    }); 

Answer 1

get変換されたデータの2番目のバージョンはdictであり、テンプレートはchartdataドットデータとチャートデータドットの背景色を必要とするため動作します。テンプレートはこれらの値を取得するためにdictにアクセスしています。そのため、jsonでエンコードされた値でdictを使用すると、その値が機能します。最初のバージョンのjsonはdict全体を、djangoテンプレートが読み込めない文字列としてエンコードします。

次のようなJSONエンコードされた変数の辞書へのpython変数のあなたの辞書を変換することができます。

data = {'labels': self.labels, 'data': self.data, 'background_colours': self.background_colours, 'hover_background_colours': self.hover_background_colours} 
data_json = {k:json.dumps(v) for k, v in data.items()}