隗より始めよ

今後はいろいろ考え始めます。

早速トランプ大統領の支持率表示アプリを作ってみた

f:id:mazarimono:20180805095138p:plain

さてこれまでこのブログにトランプ大統領の支持率を画像で貼り付けてきました。

しかしあれは美しくなかった。というわけで、ハンズオンも一段落したので、ちょっと作ってみました。ここからサイトに飛べます

数値データはローカルでパンダスで読み込み、csvにしてへロクにおいてあります。当初は読み込みのたびになんてパンダスで整形してデータを加工してみたいな感じにしていましたが、そのうち怒られやなーと思ったのでやめました。

簡単にできたかと思われましょうが、何か意外に手こずりました。

手こずりポイント1

チャートを下に4つ並べたのですが、ここがなかなか横に並びませんでした。display: inline-floatだけだと横に並ばず、float: leftを入れたら横に並んでくれました。

Dashはコミュニティー掲示板みたいなのが充実していて、調べたらちゃんとした回答が出てきます。私は自分で適当に考えながらやっていたのですが、検索したらすぐできました。

無駄に時間を消費しないよう、すぐにコミュニティー掲示板を調べましょう。 コミュニティーの回答を見ていると、横に並べるとかするときにDash用のcssがあり、それを使うと良いということが書かれていました。次はそれも試してみたいです。

community.plot.ly

community.plot.ly

herokuにあげるときにserverを忘れる

これは完全にポカミスですが、へロクにgit pushするときに'server=app.server'ってプログラムに入れるのを忘れて、へロクでアプリが動かない現象に陥りました。

幸いログを見たらserverがどうのこうの書いてあり、Dashのヘロクへのデプロイ方法を読むとそれが書かれていたので4回ほどミスった後に直せました。

dash.plot.ly

完成ではないですが

動くアプリケーションができました

ここから線の色を変えたりしたいと思っています。見栄えを考えるのって以外に難しい。

あと、マイクロソフト社のキーボードをマックにつないでいるのですが、挙動がUSキーボードになってどれを押したらどの記号が出るのか全然わからず苦労した・・・。これは本当にストレスでしたが、一応完成したということで満足してます。

あと、ヘロクってすごいなーと思いました。VPSでやろうかと調べたら色々と設定が必要なようで、それがへロクだと一瞬で終わる。へロクのアドベントカレンダーに参加してみます。内容はこれとは違うものになるかもです。

クラウド開発徹底攻略 (WEB+DB PRESS plus)

クラウド開発徹底攻略 (WEB+DB PRESS plus)