https://labs.cybozu.co.jp/blog/akky/tags/%E9%AD%9A%E7%9C%BC/ Recent content in 魚眼 on akky@サイボウズラボ・ブログ Hugo ja Fri, 15 Aug 2014 00:00:00 +0000 https://labs.cybozu.co.jp/blog/akky/2014/08/csv-fingerprints/ Fri, 15 Aug 2014 00:00:00 +0000 https://labs.cybozu.co.jp/blog/akky/2014/08/csv-fingerprints/ <p><a href="https://twitter.com/vicapow">Victor Powellさん</a>が提案した <a href="http://setosa.io/blog/2014/08/03/csv-fingerprints/">CSV Fingerprints (CSVの指紋)</a>は、CSVファイルのデータをデータの有無やデータの型(文字、数字など)に合わせて色づけすることで、日々の事務などで自動生成されているCSV出力の異常な部分を、目視で発見できるようになるのでは、という提案です。</p> <p><a href="https://labs.cybozu.co.jp/blog/akky/2014/08/csv-fingerprints/csv-fingerprints-example.png"><picture> <source type="image/webp" srcset="https://labs.cybozu.co.jp/blog/akky/2014/08/csv-fingerprints/csv-fingerprints-example_hu_ebc4f007e4882b7d.webp 480w, https://labs.cybozu.co.jp/blog/akky/2014/08/csv-fingerprints/csv-fingerprints-example_hu_59aedb2625df3484.webp 768w, https://labs.cybozu.co.jp/blog/akky/2014/08/csv-fingerprints/csv-fingerprints-example_hu_d982b13ed19f056c.webp 957w" sizes="(max-width: 56rem) 100vw, 54rem"> <img src="https://labs.cybozu.co.jp/blog/akky/2014/08/csv-fingerprints/csv-fingerprints-example.png" width="957" height="429" alt="csv-fingerprints-example" loading="lazy" decoding="async"> </picture></a></p> <p>カラムのデータの型によって異なる色で塗ったのが上のような例。</p> <p>図の上でクリックしながらマウスを動かすと、指している辺りが拡大表示され、セルの内容を確認することができます。</p> <p><a href="https://labs.cybozu.co.jp/blog/akky/2014/08/csv-fingerprints/csv-fingerprints-2.png"><picture> <source type="image/webp" srcset="https://labs.cybozu.co.jp/blog/akky/2014/08/csv-fingerprints/csv-fingerprints-2_hu_4499ccde37b256d8.webp 480w, https://labs.cybozu.co.jp/blog/akky/2014/08/csv-fingerprints/csv-fingerprints-2_hu_32821c3cf242a407.webp 492w" sizes="(max-width: 56rem) 100vw, 54rem"> <img src="https://labs.cybozu.co.jp/blog/akky/2014/08/csv-fingerprints/csv-fingerprints-2.png" width="492" height="255" alt="csv-fingerprints-2" loading="lazy" decoding="async"> </picture></a></p> <p>大きなデータセットの中から、異常になっている部分をすばやく特定し、その前後の値を含めて確認できるというわけです。</p> <p><a href="https://labs.cybozu.co.jp/blog/akky/2014/08/csv-fingerprints/csv-fingerprints.gif"><img src="https://labs.cybozu.co.jp/blog/akky/2014/08/csv-fingerprints/csv-fingerprints.gif" width="216" height="190" alt="csv-fingerprints" loading="lazy" decoding="async"></a></p> <p><a href="http://setosa.io/csv-fingerprint/">こちらのページ</a>で、好きなCSVデータを貼り付けてfingerprint を作成してみることができます。</p> <p>ビューワーはAngular.js および D3.js で作られており、<a href="https://github.com/setosa/csv-fingerprint">GitHubで公開</a>されています。</p> <p>CSVを編集するExcelなどのアプリに、こういう可視化ツールがついているといいのかもしれませんね。</p> <p>via Hacker News</p>