2020-04-01から1ヶ月間の記事一覧

Chart.jsのdayjs用アダプターを書いてみた

Chart.jsの時間軸グラフに使用するアダプターを、他の日時ライブラリ用のアダプターを参考に、dayjsバージョンを書いてみた。 環境 Chart.js: 2.9.3 dayjs: 1.8.22 アダプター Chart.js date adapter using dayjs (Local Time Version) · GitHub Chart.js da…

YAMLのblock記法でインデント(行頭スペース)をキープする

ブロックのインデント数を明示的に指定すると、指定文字数を超える行頭スペースをYAMLの出力文字列にできる。 インデント数を明示しない場合、行頭のスペースは、YAMLのblockのインデントとみなされてしまうようだ。 Ansibleのblockinfileモジュールを使用す…

Vuetifyのdatatableのカラム数を動的に変更する

headersをcomputedにして、filterの条件でカラム数を制御する。 環境 Vuetify 2.1.0 サンプル <template> <v-data-table :headers="headers" :items="items" :options="options" > </v-data-table> <script> export default { computed: { headers() { return [ { text: 'Important', align: 'center', sortable: true, value: 'important', }, { tex…</template>

Vuetifyでレスポンシブなwidth、heightを取得する

以下のプロパティからレスポンシブな値が取得できる。 $vuetify.breakpoint.width $vuetify.breakpoint.height 環境 Vuetify 2.1.0 サンプル <template> <v-data-table :headers="headers" :items="items" :options="options" :height="$vuetify.breakpoint.height - 200" > </v-data-table> </template> 参考 Breakpoints — Vuetify.js

iOSのSafariでWebKitBlobResource error 1

JavascriptからAPIを叩いて、ファイルをダウンロードしていたところ、iOSのSafariから以下のように言われてしまった。 Safari cannot open the page. The error was: "The operation couldn't be completed. (WebKitBlobResource error 1)". MacのSafari、Ch…