2017-02-02 4 views
1

私のdjangoモデルからクエリを設定すると、Google Chartを使用してXの値で日付時間を使ってLineChartを印刷したいと思います。Querysetリストを日付時刻フィールドのあるjavascript関数に渡します

javascriptを必要としている日時は、この形式にする:私のジャンゴviews.pyファイルで

data.addRows([ 
    [new Date(2000, 8, 5), 1200], 
    [new Date(2001, 8, 5), 1223], 
    [new Date(2002, 8, 5), 1240] 
] 

new Date(YEAR, MONTH, DAY, HOUR, MINUTE) 

は、私はGoogleのチャートには、この1のようにリストを渡す必要があります、

私のDjangoテンプレートで

def Function(request, page_id): 

    query_set = MyModel.objects.filter(page__pk=page_id) 

    list_impressions = query_set.values_list('created_at', 'page_impressions') 
    context = {'impressions': list_impressions} 

    return render(request, 'datacenter/facebook/impressions.html', context) 

:、私はこれをやっています

(datetime.datetime(2017, 2, 1, 8, 17, 49, 732016, tzinfo=<UTC>), 219482) 
(datetime.datetime(2017, 2, 1, 8, 52, 11, 912992, tzinfo=<UTC>), 219482) 

しかし、私はJavaScriptに渡す必要があります:

{% for record in impressions %} 
    {{ record }} 
{% endfor %} 

は私が手

var data = google.visualization.arrayToDataTable(
    [new Date(2017, 2, 1, 8, 17, 49), 1200], 
    [new Date(2017, 2, 1, 8, 52, 11), 1223] 
); 
私はジャンゴとJavaScriptで日付時刻の表現の間のリンクを作るべき

?ビュー、テンプレート?

スタックオーバーフローで他の多くの質問を使用しようとしましたが、成功しませんでした。私はまた、文字列のリストを作成し、それをテンプレート内で変換するように醜いものを構築しようとしました。

+0

[JsonResponse](https://docs.djangoproject.com/en/1.10/ref/request-response/#jsonresponse-objects)とjsonのシリアルデータで応答するビューを提供することができます。次に、あなたのjavascriptで、このURLからajaxリクエストでデータを取得し、それらをデシリアライズすることができます。 – trixn

答えて

1

JavaScriptを次のように変換することができます。例:temp_datetimeというキーでdatetime値を取得した場合、それを次のように使用してjavascriptの日付オブジェクトに変換します。 new Date("{{ temp_datetime|date:"Y, m, d, H, i, s" }}")このようにして、datetimeをjavascriptのDateオブジェクトに変換することができます。

+0

[date、value]のリストがあります。ビューやテンプレートでリストを変換しないようにしたいと思います。 –

+0

あなたのソリューションを使用しようとしていますが、テンプレートのロード後に次のフォーマットがあります。[新しい日付(mer、01Fév2017 08:17:49)、219482] –

+0

@YassineBelmamounが私の答えを更新しました。 – MicroPyramid

1

JavascriptのDateクラスでは、ISO形式の値を直接受け入れることができます。したがって、その形式で日付を出力し、コンストラクタに渡すことができます。

あなたはテンプレートで直接これを行うことができます:

var data = google.visualization.arrayToDataTable(
    {% for row in list_impressions %}[new Date("{{ row.0.isoformat }}"), {{ row.1 }}]{% if not forloop.last %},{% endif %}{% endfor %} 
); 

あなたはより多くのビューで行う場合、それが明確になるかもしれませんが。

+0

私はそれをして、今私はこのエラーメッセージが表示されます: "少なくとも1桁が小数点の後に最も発生します"。ここにjavascriptがあります: var data = google.visualization.arrayToDataTable( [新しい日付(2017-02-01T08:17:49.732016 + 00:00)、219482]、[新しい日付(2017-02-01T08:52: 11.912992 + 00:00)、219482] ); –

+0

日時をビューで直接的に変換するとはどう思いますか? –

+0

申し訳ありませんが、タイムスタンプの前後に引用符があるはずです。 –

関連する問題