ysugiyama12 のアーカイブ

Atomでsvgファイルを表示する

2017年6月23日

インターネット上のサイトでも出来ると思われるが、atomのパッケージ「svg-preview」を用いると更新があるとすぐに反映する svgの表示ができる。 表示したいsvgのファイルを開き、Command+fn+option+vで開くことができる。
続きを読む

hiddenのinput要素で値をPOSTする

2017年6月21日

見えないinput要素を設定してそのvalueを保持しておいてリクエスト先で取得することができる。 ``` ``` リクエスト先ではgetDataを用いて値を取得する。 ``` $data = $this->request->getData('delete_data'); //valueに入っている値(ここでは"F")が取得できる。 ```
続きを読む

crontabについて

2017年6月16日

決められた時刻にある処理を自動的に実行したい場合にcrontabというものを用いる。 * * * * * (command)の形式で入力する。それぞれ*には左からminutes(0-59),hour(0-23),day of manth(1-31),month(1-12),day of week(0-6)を当てはめることで日時を正確に指定できる。
続きを読む

CakePHPでエラー画面を変更する

2017年6月9日

デフォルトで表示される赤っぽいデザインの画面を表示させたくないとき,app.phpにある ``` 'debug' => filter_var(env('DEBUG', true), FILTER_VALIDATE_BOOLEAN), ``` この'true'を'false'にすることでデフォルトのエラー画面を表示しないように変更できる。
続きを読む

データの更新時にキャッシュをリセットする

2017年6月2日

データを更新した時にキャッシュを消去する関数を紐付かせておくことで更新した内容を取り損ねないようにする。 ``` add_action('save_post', 'reset_cache' ); ``` このようにadd_actionでreset_cacheという関数を紐付かせておいて、その関数内で ``` function reset_cache(){ delete_transient('data_key'); } ``` など
続きを読む

キャッシュとしてデータをデータベースに保存する

2017年5月31日

処理が重い関数を毎回呼び出すことは処理速度の低下を招くので一定期間キャッシュとして保存しておくとよい。 ``` ``` $transientにデータのキーを指定、$valueに保存したい配列など、$expirationに保存が有効な秒数を指定する(3600*24なら一日間) ``` ``` $transientに指定したキーを代入することでデータが存在すれば取り出すことができる。
続きを読む

d3.js でx軸のラベルを文字列にする

2017年5月24日

通常はラベルの数値を元に範囲を取得して均等に表示する処理をしているが、それをせずにデータ数に応じて均等に配置する。 いじる部分だけピックアップ ``` var xScale = d3.scale .ordinal() .domain(d3.range(gdp.length)) .rangeRoundBands([0, width], 0.05); ``` ``` var xAxi
続きを読む

ファイルやフォルダの取得、削除など

2017年5月19日

``` use Cake\Filesystem\Folder; use Cake\Filesystem\File; ``` これらを取り込むことでファイル操作が可能となる。 例えば、$image_pathにrootからのpathが入っているとすれば(フォルダの場合) ``` $dir = new Folder(ROOT . DS . $image_path); if ($dir_igp->find()) { $
続きを読む

in_arrayという関数

2017年5月17日

配列に該当する要素が含まれていればtrueを返す関数in_arrayは使い方に注意したほうがよい。 たとえば ``` $array = [0,1,2,3,4]; $input = 3; in_array($input, $array); ``` このようにすれば当然trueがかえってくる。 しかし、"3"(文字列)、3.0(数値),"3.0"でもtrueを返す。 初めの2つはわかるにしても、最後のtrueは違和感を感じるはず。 これはin_ar
続きを読む

placeholderに翻訳機能を適用させる

2017年5月10日

placeholderによって指定された文字列はそのままだと翻訳の対象とならずページ全体を翻訳してもそこだけ無視されてしまう。 そこで、stackoverflowにあった処理を行ったら上手くいったのでまとめておく。 ``` // Find all placeholders var placeholders = document.querySelectorAll('input[placeholder]'); if (placeholders.length) {
続きを読む

改行タグの置換

2017年4月28日

'\n'などを含む文字列をページに表示しても改行が反映されないことがある。 そのため、'\n'などは''に置き換える必要がある。 ``` var text = '改行\nします'; var new_text = text.replace(/\r\n|\n|\r/g, ''); ``` 改行タグは環境によって\n(Mac),\r(古いMac),\r\n(Windows)の三種類がある。\r\nは左端に戻してから1行スクロールするタイプライターに由来するらしい
続きを読む

日時の表記

2017年4月22日

CakePHPでデータベースから日時(createdなど)を取得するとFrozenTimeというクラスの状態で出力される。そのままechoすると ``` 4/21/2017 12:00 AM ``` のような形式で出力される。これを〜年〜月〜日と日本の形式にするには ``` echo $data->created->year,'年',$data->created->month,'月',$data->created->day,'日'; ``` な
続きを読む

ログイン認証ボタンの設置

2017年4月14日

cakePHPにおいて、controller, action, providerを指定して認証ページに飛ぶボタンの作成。 ```      ```
続きを読む

画像のalt属性

2017年3月31日

``` ``` alt属性はimage要素内の属性値で、主に画像に関する説明を記述する部分である。 もし何らかのエラーで画像が表示されなかった場合でもaltを登録しておくことでそこにどのような画像が表示されるはずだったかを知ることができる。記号などでも、altが未定義だと怒られてしまうので空の値にしておく必要がある。
続きを読む

地図や画像の上に透明なOverlayを配置

2017年3月28日

コンポーネントはnativeBaseのCardを用いて色を透明にすることで実現した。 ``` Overlay ``` そして、スタイルシートで背景:透明を指定 ``` overlay: { backgroundColor: 'rgba(0,0,0,0)', }, ```
続きを読む

地図上でdrag&dropできるマーカーの作成

2017年3月24日

react-native-mapsにおいて自分で移動させたマーカーの座標を取得できる。 ``` this.setState({ region: e.nativeEvent.coordinate })}//drag終了時の座標を読み取りstateにセット /> ``` 現時点ではdragの判定範囲が狭く移動しづらいので対策を考え中。
続きを読む

記事一覧などに便利なコンポーネント:Card

2017年3月22日

nativeBaseにあるCard要素を用いるとリスト形式のデザインが簡単に実現できる。 ``` No.1
続きを読む

文字が入力されている時だけ色が変わって押すことができるボタンの作成

2017年3月16日

割と使う機会が多いはずだが、綺麗にまとまっているサイトがなかったのでまとめておく。 ``` class Hoge extends Component { constructor() { super(); this.state = { text: ''}; } render() { return ( th
続きを読む

NativeBaseを用いたReact Native のデザイン設計

2017年3月15日

iOS,Androidそれぞれの様式に合わせたコンポーネントをシングルソースで提供するオープンライブラリがNativeBaseである。 npm install した後、各ファイルにおいて必要なコンポーネントを ``` import { Content, Button, Text, Input, getTheme } from 'native-base'; ``` などのようにしてインポートすることで使用することができる。 styleの設定も別ファイルに分け
続きを読む

PropsとStateについて

2017年3月10日

ここの理解がかなり怪しかったので自分なりにまとめます。 # Props コンポーネント利用時に属性として設定できる値で、一度定義したらその値を変更することはできない。 例えば ``` ``` として描画において設定したPropsはMyComponent内のメソッドで ``` Props : {this.props.PropsName} ``` このような方法で呼び出すことができる。 型の指定もできる。この型に
続きを読む