質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
D3.js

D3.jsとは、データに基づいてHTMLやSVGドキュメントを編集するために作られた、小規模なオープンソースのJavaScript可視化ライブラリです。

JSON

JSON(JavaScript Object Notation)は軽量なデータ記述言語の1つである。構文はJavaScriptをベースとしていますが、JavaScriptに限定されたものではなく、様々なソフトウェアやプログラミング言語間におけるデータの受け渡しが行えるように設計されています。

Python

Pythonは、コードの読みやすさが特徴的なプログラミング言語の1つです。 強い型付け、動的型付けに対応しており、後方互換性がないバージョン2系とバージョン3系が使用されています。 商用製品の開発にも無料で使用でき、OSだけでなく仮想環境にも対応。Unicodeによる文字列操作をサポートしているため、日本語処理も標準で可能です。

Q&A

解決済

1回答

23725閲覧

Pythonのlistから、JSONファイルを生成したい

WasedaGhost

総合スコア16

D3.js

D3.jsとは、データに基づいてHTMLやSVGドキュメントを編集するために作られた、小規模なオープンソースのJavaScript可視化ライブラリです。

JSON

JSON(JavaScript Object Notation)は軽量なデータ記述言語の1つである。構文はJavaScriptをベースとしていますが、JavaScriptに限定されたものではなく、様々なソフトウェアやプログラミング言語間におけるデータの受け渡しが行えるように設計されています。

Python

Pythonは、コードの読みやすさが特徴的なプログラミング言語の1つです。 強い型付け、動的型付けに対応しており、後方互換性がないバージョン2系とバージョン3系が使用されています。 商用製品の開発にも無料で使用でき、OSだけでなく仮想環境にも対応。Unicodeによる文字列操作をサポートしているため、日本語処理も標準で可能です。

0グッド

0クリップ

投稿2019/03/02 12:46

編集2019/03/02 12:51

前提・実現したいこと

Pythonで分析したデータを、D3.jsで可視化したいと考えています。
その中で、listのデータをjsonに変換する必要があるのですが、
グラフの関数が動くためには、以下のようにデータを出力する必要があります。

必要なデータ

json

1[ 2 {axis:"Email",value:0.59}, 3 {axis:"Social Networks",value:0.56}, 4 {axis:"Internet Banking",value:0.42}, 5 {axis:"News Sportsites",value:0.34}, 6 ...

そこで、私は以下のようにコードを作りました。

該当のソースコード

python

1import json 2import collections as cl 3 4label = ["Email","Social Networks","Internet Banking","News Sportsites",...] 5ratio = [0.59,0.56,0.42,0.34,...] 6 7list=[] 8 9def main(): 10 for i in range(len(label)): 11 dic = cl.OrderedDict() 12 dic["axis"] = label[i] 13 dic["value"] = ratio[i] 14 list.append(dic) 15 #print("{}".format(json.dumps(ys,indent=4))) 16 17 f = open('data.json','w') 18 json.dump(list,f,indent=2,ensure_ascii=False) 19 20if __name__=='__main__': 21 main()

すると以下のような結果になります。

出力結果(少し見やすく改行しています)

json

1[ 2 {"axis":"Email","value":0.59}, 3 {"axis":"Social Networks","value":0.56}, 4 {"axis":"Internet Banking","value":0.42}, 5 {"axis":"News Sportsites","value":0.34}, 6 ...

お分かりの通り、このコードではkeyとなるaxisとvalueがstrになってしまうんですね。
これだと関数は動かないので、なんとかkeyを変えようと思ったのですが、
調べても文字列の例しか出てこないので、質問させていただきました。

初歩的なことかもしれませんが、ご回答よろしくお願いします。

補足情報

グラフは、こちらを使いたいと思っています。
https://gist.github.com/nbremer/6506614

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

Lhankor_Mhy

2019/03/02 13:22

「これだと関数は動かない」とありますが、D3.jsが動かない、ということですか? これは、JSONの仕様どおり( http://www.json.org/json-ja.html )なので、何かのお間違いでは?
tachikoma

2019/03/02 13:22

D3.jsのこと知らないのですが、必要なデータの形式は一般的なJSON形式じゃないんですね。
WasedaGhost

2019/03/02 14:18

>Lhankor_Mhy様 言葉が足りず申し訳ありません。追記させていただきます。 そうですね、D3.jsが動きません。補足情報のリンクにある、グラフを実際に表示するためのindex.htmlで、axisやvalueを変数として扱っているので、該当のコードで出力されるstr型の'axis','value'では動かないという状況です。JASONの仕様も確認させていただきます。
WasedaGhost

2019/03/02 14:18

>Lhankor_Mhy様 言葉が足りず申し訳ありません。追記させていただきます。 そうですね、D3.jsが動きません。補足情報のリンクにある、グラフを実際に表示するためのindex.htmlで、axisやvalueを変数として扱っているので、該当のコードで出力されるstr型の'axis','value'では動かないという状況です。JASONの仕様も確認させていただきます。
guest

回答1

0

ベストアンサー

json はキーは引用符で括る仕様になってますから、作ろうとしているのは json ではなく、javascript のオブジェクトではないでしょうか?

キーの引用符を外したいのであれば、やや強引ですが、json.dump() で json を生成したあとに正規表現でキーの引用符を除いてしまえばいいのではないでしょうか。

python

1import json 2import re 3from collections import OrderedDict 4 5labels = ['Email', 'Social Networks', 6 'Internet Banking', 'News Sportsites'] 7values = [0.59, 0.56, 0.42, 0.34] 8 9 10def main(): 11 data = [] 12 for l, v in zip(labels, values): 13 data.append(OrderedDict(axis=l, value=v)) 14 15 j = json.dumps(data, indent=2, ensure_ascii=False) 16 # 正規表現でキーの引用符を消す。 17 j = re.sub(r'"(\w+?)":', r'\1:', j) 18 19 with open('data.json', 'w') as f: 20 f.write(j) 21 22 23if __name__ == '__main__': 24 main()
[ { axis: "Email", value: 0.59 }, { axis: "Social Networks", value: 0.56 }, { axis: "Internet Banking", value: 0.42 }, { axis: "News Sportsites", value: 0.34 } ]

投稿2019/03/02 13:30

編集2019/03/02 13:34
tiitoi

総合スコア21956

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

tiitoi

2019/03/02 13:55 編集

コメントありがとうございます。 自分は javascript や D3js は知らないのですが、ライブラリの使い方など別の問題があるかもしれませんね。 ちらっと調べたところ、データを csv から読み込んで描画できるみたいなので、質問にある出力形式にこだわる必要もないように感じました。
WasedaGhost

2019/03/02 14:35

ご回答ありがとうございます。無事実行できました。 ご指摘の通り、D3.jsのグラフの中にも、csvから直接読み込めるように設計されたものもあります。今回使用したいグラフは、描画するindex.htmlの出力形式が上記のように限定されてしまっていたため、行き詰まっておりました。もちろん自分にjsの知識さえあれば、出力形式にこだわらず、csvから直接グラフを生成するようなモデルを作れたかもしれませんが、時間の関係で、データから合わせることにした次第です。説明が足りず申し訳ありませんでした。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問