.bowerrcの設定例
デフォルトのディレクトリではなく、指定の場所にインストールしたいときはdirectory設定。
registryは入れておいたほうが吉。
あとよくproxyにひっかかるので。
(環境変数に入れてるはずなんだけどなぁ。。
- example
{ "directory": "public/components", "json": "bower.json", "registry": "http://bower.herokuapp.com", "proxy":"http://user:pass@proxy.com:port/", "https-proxy":"http://user:pass@proxy.com:port/" }
chart.js メモ
chart.jsで開発したときのメモ
棒×2本と線グラフで描画
var data ={ labels: ['2017/01','2017/02','2017/03','2017/04','2017/05'], lineLabel: '線グラフのラベル' linedata: ['100','200','300','400','500'], bar1Label: '棒グラフ1のラベル' bar1data: ['10','20','30','40','50'], bar2Label: '棒グラフ2のラベル' bar2data: ['50','40','30','20','10'], }; var chartData = { labels: data.labels, datasets: [{ type: 'line', label: data.lineLabel, data: data.linedata, fill: false, backgroundColor: '#fff', yAxisID: 'y-axis-right', }, { type: 'bar', label: data.bar1Label, data: data.bar1data, yAxisID: 'y-axis-left', }, { type: 'bar', label: data.bar2Label, data: data.bar2data, yAxisID: 'y-axis-left', }, ], }; var complexChartOption = { responsive: true, scales: { yAxes: [{ id: 'y-axis-left', type: 'linear', position: 'left', }, { id: 'y-axis-right', type: 'linear', position: 'right', gridLines: { borderDash: [2], borderDashOffset: 0.0, }, }], }, }; var ctx = document.getElementById("canvas").getContext("2d"); window.myBar = new Chart(ctx, { type: 'bar', data: chartData, options: complexChartOption, });
html:
<canvas id="canvas"></canvas>
参考:
javascript - Grouped bar charts, in chart.js - Stack Overflow
おまけ
数値のカンマを入れたい。
var complexChartOption = { responsive: true, tooltips: { callbacks: { label: function(tooltipItem, data) { var value = data.datasets[tooltipItem.datasetIndex].data[tooltipItem.index]; return String(value).split(/(?=(?:...)*$)/).join(','); } } }, scales: { yAxes: [{ id: 'y-axis-left', type: 'linear', position: 'left', ticks: { callback: function(label, index, labels) { return String(label).replace(/\B(?=(\d{3})+(?!\d))/g, ","); } }, scaleLabel: { display: true, labelString: data.bar1Label + ' & ' + data.bar2Label, } }, { id: 'y-axis-right', type: 'linear', position: 'right', gridLines: { borderDash: [2], borderDashOffset: 0.0, }, ticks: { callback: function(label, index, labels) { return String(label).replace(/\B(?=(\d{3})+(?!\d))/g, ","); } }, scaleLabel: { display: true, labelString: data.lineLabel, } }], }, };
YYYY/MMからYYYYMMにしたい
momentを使っていればformatで変えられるけど、
直前の処理で正しい日付であることが担保されているので単純に正規表現をつかってみたり。
const yyyy_mm = '2017/05' const foo = moment(yyyy_mm).format('YYYYMM'); console.log(foo); // 201705 const hoge = yyyy_mm.replace(/\u002f/g, ''); // スラッシュ=u002f console.log(hoge); // 201705 const hogehoge = yyyy_mm.split('/'); // スラッシュの前後の値が配列としてそれぞれの要素に入る。 console.log(`${hogehoge[0]}${hogehoge[1]}`); // 201705
オブジェクトの判定
Javascriptで中身がないオブジェクトを判定する際のメモ。
const hoge = {};
空でもIFで判定するとtrueになる。
if (hoge) { // true }
中身がないことを判定するにはキーの数がゼロかどうかで見分ける。
if (Object.keys(hoge).length === 0) { }
標準出力&標準エラーどちらもロギングしたい
node + express で作成したアプリを起動時からの標準エラーも含めたログを延々取りたくなったときのコマンド。
npm run dev 2>&1 | tee test.log
openstreetmap + Leaflet.js memo
openstreetmap
https://openstreetmap.jp/
API
http://leafletjs.com/reference.html
レイヤーについて
http://leafletjs.com/examples/layers-control/
プラグイン紹介
http://qiita.com/pokohide/items/6329f1f92253ced23599
ルートの描画
https://github.com/leaflet/Leaflet.Draw#readme
https://leaflet.github.io/Leaflet.draw/docs/leaflet-draw-latest.html#l-draw
上のサンプル
https://leaflet.github.io/Leaflet.draw/docs/examples/snapping.html
Using GeoJSON with Leaflet(つかうかな?
http://leafletjs.com/examples/geojson/
http://s.kitazaki.name/docs/geojson-spec-ja.html
カスタマイズ
http://qiita.com/ShingoOikawa/items/41a522c1361e33c3c3dd
CentOS7にzipが入っていなかった件
検証用のCentOSにzipコマンドが含まれているスクリプトを動かしたら
zip: コマンドが見つかりません
え?入ってないんかい。
$ yum list installed | grep zip
bzip2-libs.x86_64 1.0.6-13.el7 @anaconda
gzip.x86_64 1.5-8.el7 @anaconda
ほんとに入ってなかった。
yumでインストールできるかinfoオプションをつけて確認。
$ sudo yum --enablerepo=epel,remi,rpmforge info zip 読み込んだプラグイン:fastestmirror Loading mirror speeds from cached hostfile * base: ftp.iij.ad.jp * epel: ae.mirror.rasanegar.com * extras: ftp.iij.ad.jp * updates: centos.usonyx.net 利用可能なパッケージ 名前 : zip アーキテクチャー : x86_64 バージョン : 3.0 リリース : 11.el7 容量 : 260 k リポジトリー : base/7/x86_64 要約 : A file compression and packaging utility compatible with : PKZIP URL : http://www.info-zip.org/Zip.html ライセンス : BSD 説明 : The zip program is a compression and file packaging : utility. Zip is analogous to a combination of the UNIX : tar and compress commands and is compatible with PKZIP (a : compression and file packaging utility for MS-DOS : systems). : : Install the zip package if you need to compress files : using the zip program.
お、あるある。
じゃあインストール。
$ sudo yum install zip 読み込んだプラグイン:fastestmirror base | 3.6 kB 00:00 extras | 3.4 kB 00:00 updates | 3.4 kB 00:00 updates/7/x86_64/primary_db | 2.2 MB 00:00 Loading mirror speeds from cached hostfile * base: ftp.iij.ad.jp * extras: ftp.iij.ad.jp * updates: centos.usonyx.net 依存性の解決をしています --> トランザクションの確認を実行しています。 ---> パッケージ zip.x86_64 0:3.0-11.el7 を インストール --> 依存性解決を終了しました。 依存性を解決しました ================================================================================ Package アーキテクチャー バージョン リポジトリー 容量 ================================================================================ インストール中: zip x86_64 3.0-11.el7 base 260 k トランザクションの要約 ================================================================================ インストール 1 パッケージ 総ダウンロード容量: 260 k インストール容量: 796 k Is this ok [y/d/N]: y Downloading packages: zip-3.0-11.el7.x86_64.rpm | 260 kB 00:00 Running transaction check Running transaction test Transaction test succeeded Running transaction インストール中 : zip-3.0-11.el7.x86_64 1/1 検証中 : zip-3.0-11.el7.x86_64 1/1 インストール: zip.x86_64 0:3.0-11.el7 完了しました!
p.s. unzipも入ってなかった。。。