VueとMathJaxで数式エディタを作ってみた

jp.vuejs.org

Vueの勉強のために、↑このMarkdownエディタをマネして数式エディタを作ってみました。

Markdownエディタをちょっと変更すればいいだろうと思っていたけど、MathJaxTeXのテキストをHTMLテキストに変換するようにはなっていないので、Vueと相性が悪くて、いろいろ試してwatchを使う形にしました。

やりたいこととしては、HTMLの数式を画像に変換してtwitterに投稿することなのですが、ちょっと調べると簡単ではなさそうです。

週刊少年ジャンプの掲載順データを見てると楽しい

qiita.com

を読んでwj.jsonをRで読み込んで遊んでいたところ、wj.jsonで遊んでいる人の記事が出ていました。

ima.goo.ne.jp

この記事で書いているグラフはシンプルで見やすくてイイですね。Tableau Publicでマネしてみました。

1週間毎のグラフだとギザギザすぎるので、移動平均をとってなめらかにしたグラフもつけてみましたよ。今回は掲載順に関する時系列のグラフを作っただけですが、wj.jsonのようなデータがあればいくらでも遊べますね!

オープンデータ、とは言わないのかもしれないけど、データが公開されているということのパワーを改めて思い知りました。

マストドンのインスタンスを立てたけどそのあとどうすればいいのか

話題のマストドンインスタンスを立ててみました。 

akiyah.com

↑ここです。おひとりさまインスタンスのつもりです。(ただ、会員登録は閉じていません。)

AWSでつくりました。↓のチュートリアルをバッチリ参考にさせていただきました。ドメイン(akiyah.com)は以前とっていたので、それ以外はほぼ完全にこのまま作業しました。

webfood.info

インスタンスを立ててはみたけど、実はマストドンのユーザーとしての使い方がいまいちよくわかっていないです。

アカウントはインスタンス毎に取るものだとおもって、 akiyah@mstdn.jp、 akiyah@mathtod.online、 akiyah@everydon.com、 と作ったのですが、それぞれ連動するものではないらしいですね。じゃあ、どれかをメインにしたらいいのかなと考えて、せっかくだからと自分のインスタンスを立てて、自分のドメインで作ったアカウントをメインアカウントにしようとしてみました。

で、いざ、立てたインスタンスを見てみると、、、

f:id:Akiyah:20170430202034p:plain

さみしい、、、

てっきり、連合タイムラインにガンガン流れてきて、それを見ながらリモートフォローをしていけばいいと思っていたのですが、連合タイムラインにも自分の発言しか存在しないのです。

f:id:Akiyah:20170430201757p:plain

サーバー情報を見ると、接続中が2個のインスタンスです。最初は0個でした。これが少ないから連合タイムラインが流れないのでしょうね。ただこの接続中インスタンスを増やす方法知らないです。なぜ0から2に増えたのかもわからない。。。他のインスタンスの親切な管理者の方に接続してもらった、とかですかね。

まあ、インスタンスの接続は別にいいとしても、 メインアカウントakiyah@akiyah.com )でリモートフォローを増やしていかなければ。akiyah.comの連合タイムラインはなにも流れていないのでmstdn.jpの連合タイムラインを見てリモートフォローすればいいのかな。とはいえ2つのドメインのアカウントを使い分けて作業しないといけないので面倒なのですが。。。

いろいろわかっていないのですが、せっかくインスタンスも立ち上げたことだし、手探りでやっていこうと思っています。

日本の高校数学の四分位数の求め方はRの9種類のどれとも違う

こんな驚きのツイートを見かけました。

まず、Rに9種類も四分位数が実装されているのがびっくりですよね。

?quantilesで調べてみると、

type

an integer between 1 and 9 selecting one of the nine quantile algorithms detailed below to be used.

と書いてあります。9種類もあるのは本当だった!

英語のWikipediaのQuantileをみるとわかりやすく9種類を解説してありました。ちなみに、たまたま気になってR-2の式を確認したのだけど、ちょっと間違えていると思います。

もっと丁寧に書いてあるのがQuartiles_in_R.pdfです。9種類のtypeに違いが出る場合を4種類のデータで示しています。下の画像は、data12の表で、data11、data10、data9もあります。

f:id:Akiyah:20170420092903p:plain

 

さて、本題です。日本の高校数学の四分位数は、これらとは違うのでしょうか。高校の教科書は持っていないのですが、ベネッセの解説を見つけました。

kou.benesse.co.jp

データを小さい方から順に並べたとき,中央値に相当するのが「第2四分位数」であり,

下位(中央値より小さい方)のデータの中央値が「第1四分位数」
上位(中央値より大きい方)のデータの中央値が「第3四分位数」

となります。

と書いてあります。なるほど、定義としてはわかりやすいですね。でもRのquantileとは定義は違いますね。quantileはn分位数が出せるけど、この高校定義だとn=4の四分位数に限定されています。

さて、定義は違うけど、計算結果はRの9種類のどれとも違うのでしょうか。確認するために、Quartiles_in_R.pdfで使っているdata12, data11, data10, data9で計算してみました。 

DATA Q1 MEDIAN Q3
data12 <- c(2,3,5,7,11,13,17,19,23,29,31,37) 6 15 26
data11 <- c(2,3,5,7,11,13,17,19,23,29,31) 5 13 23
data10 <- c(2,3,5,7,11,13,17,19,23,29) 5 12 19
data9 <- c(2,3,5,7,11,13,17,19,23) 4 11 18

Quartiles_in_R.pdfと見比べてみると、確かに全部一致するものはないですね。type=2に一番近いですがdata9の時にtype=2は5,11,17ですのでちょっと違います。というわけで最初のツイートは正しいことが確認できました。

Rは9種類も四分位数の定義があるのに、なんで日本の高校はさらに新しい定義を作るのだろう、と最初は思ったのですが、ここまで計算してみるとちょっと考えが変わってきました。Rは9種類の四分位数(quantile)を実装しているけど、四分位数じゃなくてn分位数に対応しているために定義は少しややこしくなっています。一方、日本の高校の定義は、「中央値より下の中央値」「中央値より上の中央値」という感じで、わかりやすいんですよね。n=4の四分位数に限定の定義ですが、確かに教科書に載せるにはこっちの方が適切なのかも。と思いました。

 

実践のための基礎統計学 (KS理工学専門書)

実践のための基礎統計学 (KS理工学専門書)

 

ちなみに、今読んでいるこの本の四分位数は、定義の形はちょっと違うけど、Rのquantileのtype=7(default)と同じ値になるようでした。よかった。

AgileJapan2017でモブプログラミングに飛び入り参加しました。

AgileJapan2017でモブプログラミングに飛び入り参加しました(飛び入りというか、後ろで見てようかなと思ったら座らされちゃった)。参加者は、7人くらい。

お題というか言語はelmというもので、参加者全員が知らない言語でした。みんなで調べながら動くものを作るという場を作るためにそういうマイナー言語を選んだみたいです。

まずJoshが紹介してくれたのがモブプログラミング用のタイマー、モブスターです。

github.com

指定した時間が来たらディスプレイを黒くして、次のドライバーを教えてくれます。

f:id:Akiyah:20170414172004p:plain

elmは、初めてだったけどどうやら関数型言語で、HTMLを作るのに便利だそうです。オンラインの実行環境があったのでここでモブプログラミングしました。

f:id:Akiyah:20170414172404p:plain

最初にハローワールド書いて(これはサンプルを実行しただけ)、assertメソッド書いて単体テストできるようにして、ローマ数字の足し算のお題を解き始めました(I、II、III、IVのみ出てくる演算に関してはできた)。

まあ、わけわからないですよ、初めての言語だし。でもみんなで知恵を出し合って、なんとかそこまでできたのでした。パチパチ。

モブプログラミングのコツ(教えてもらったこと、私の思ったこと)
  • 周りのナビゲーターが次にやることを指示して、ドライバーは手を動かすだけにする
  • モブスターを使ってドライバーを(10分とか)定期的に交代する
  • 周りのナビゲーターはみんなに聞こえるように大きな声で指示する
  • そこ、その行、と言ってもわからないので、行番号を数字で指摘すると良い
感想

やってみて、elmのような初見の言語や技術をみんなで学ぶ場としてモブプログラミングをするのはすごく良いなと思いました。デバッグとか、設計の方針の共有とかもそうだと思います。

あと、今までも同僚とやっていたみんなでディスプレイを見ながらプログラミングするという状態は、だいたいのところモブプログラミングだなと思いました。今までやっていたよと。ただ上に書いたようなコツを使った方がより効果的なんだなとも思いました。

モブプログラミングは普通の開発でも使うものなのですかね。そこらへんが不明でした。ずっとモブプログラミングでも良さそうでもあるし、週に1日というような運用でもありそうだし。そのあたり、詳しい人に聞いてみたいです。

AgileJapan2017 【基調講演】 “モダンアジャイル”

AgileJapanに参加して、おめあての基調講演のモダンアジャイルを聞きました。

www.agilejapan.org

最近はアジャイルバズワードっぽくてアジャイルの話をするとずれていることが多くて困っていたし、アジャイルソフトウェア開発宣言も「いままでのウォーターフォールとはちがう!」というアンチテーゼっぽさが気になっていたのでした。なのでモダンアジャイルというアイデアを聞いた時から期待していました。とくに心理的安全を聞きたかったのです。

で、聞いてみると、ソフトウェアに限っていたアジャイルソフトウェア開発宣言をソフトウェアに限らない領域に広げて、ユーザーのAWSOME!(すごい!)をいかに作るかを目指すのがモダンアジャイルなのかなと思いました。わかりやすい差分をまとめてみると、

  • アジャイル → モダンアジャイル
  • ソフトウェア開発 → 何らかのサービス
  • いかに作り上げるか(DONE) → いかにすごいか(AWSOME)

という感じかなと。だいぶリーンスタートアップに近い印象を受けました。モダンアジャイルの4項目

  • 人々を最高に輝かせる
  • 安全を必須条件にする
  • 高速に実験&学習する
  • 継続的に価値を届ける

のうち、下の二つはリーンスタートアップぽいですよね。一方で、上の二つの、「関係する人々」や「安全」に注目しているのが今までのアジャイルの流れを汲み取っていますね。

 

Joshuaのプレゼンテーションは印象的な例が多くてとても面白かったです。そのうち一つを紹介しますね。

Joshuaには娘さんがいて、子供達は水風船の投げ合いで遊んでいるのだそうです。水風船バトルでは、水風船を準備するのが大変なんですよね。そこで、その娘さんにパパ(Joshua)が水風船をいっきに作れる商品をプレゼントしたのだそうです。

www.gizmodo.jp

「パパ最高!(AWESOME!)」

となるわけですね。これですね。この商品はまさに「パパ最高!」を作るものなんですよね(gizmodeの紹介もそうなっていますね〜)。ちなみに、これ、うちでは去年買いましたよ。AWESOME済みです。

 

講演を聞いている人に、モダンアジャイルステッカーがプレゼントされました。

 

そういえば以前こんなエントリーを書いていたことを思い出しました。

akiyah.hatenablog.com

心理的安全は、2017年度の流行語の予感。今回の講演でも心理的安全についてもおしえてもらいましたが、また別のエントリーで。

Docker内でbundle exec rspecがやけに遅かったけどなおった件

Docker Compose使ってRailsのプロジェクトをしています。

ある時から突然bundle exec rspecが遅くなってしまって、テスト自体は10秒程度なのにコマンドとしては2分くらい待たされるという現象になってしまいました。rspecに限らずbundle execが何やっても遅いという状態でした。

それもプロジェクトの一人が最初にその現象に当たって、数日後に私もなって、また数日後にもう一人が同様になって、という、感染しているんじゃないかという不思議な現象でした。でも、その3人目の人が解決策を見つけてくれました。

rails.hatenadiary.jp

細かいところは違いますが、Docker側とホスト側(Mac)の共有フォルダにvender/bundleがあるとこうなるようです。上記の3人目の感染者はグローバルにインストールしたらなおったと教えてくれました。

でも2番目の感染者である私はグローバルインストールを避けたかったので、ちょっと違う方法を考えました。docker-compose.ymlのvolumesで指定した共有フォルダにrailsプロジェクトを入れているのですが、gem置き場をたとえばvender/bundleというように指定すると結局共有フォルダ内に置くことになってしまうので、bundle installする時に--path=~/project1/vender/bundleとしてみました。そうするとDocker側とホスト側で~/project1/vender/bundleがgem置き場として指定されるけど、実態は共有フォルダじゃない別々のところに管理されます。

グローバルインストールじゃないし、遅い件もなおったしで、ひとまず満足です。

ちなみに、なぜ最初から遅いわけじゃなくて、一人ずつ感染が広がっていったのかは、不明なままです。。。