【git】マージ済、マージ未のブランチを確認
# ブランチ確認 $ git branch develop * master # マージ済のブランチ確認 $ git branch --merged # developブランチで作業 $ git checkout develop 〜なにか修正 $ git commit -m "hoge" # マージ未のブランチ確認 $ git checkout master $ git branch --no-merged develop # マージ $ git merge develop $ git branch --merged develop 〜 以降、developブランチに新たなコミットが加わると--no-mergedに表示される
以上です
【emacs】find-diredでファイル名検索
M-x find-dired Run find in directory: path/to Run find (with args): -name "hoge.php" -print
これだけなんだけど、以下みたいにやっててエラー出てた。。findコマンドで使ってるオプションそのまま投げればよいだけだったのか。。
M-x find-dired Run find in directory: path/to Run find (with args): "hoge.php" # エラー find . \( "hoge.php" \) -ls find: hoge.php: unknown primary or operator
以上です
【angularjs】外部スクリプトの読込が完了してからコントローラを実行する
今回はGoogleMapを扱う際に気になったのでちゃんと実装してみたのでその時のメモ。htmlにscriptタグを埋め込むやり方が普通なのだろうが、そこでネットワークエラー等が発生するとhtmlを再読み込みしない限り2度と読み込むタイミングがないのではないかということを懸念してこのような形としてみた。
Router
angular.module('starter', ['ionic'])
.config(function($stateProvider) {
$stateProvider
.state('map', {
url: '/map',
controller: 'MapCtrl',
resolve: {
map: function(GoogleMapService) {
return GoogleMapService.load();
}
}
})
})Service
angular.module('starter')
.service('GoogleMapService', function($q) {
this.flag = false
this.load = function() {
var deferred = $q.defer()
if (this.status) {
deferred.resolve();
} else {
var self = this;
var url = 'https://maps.googleapis.com/maps/api/js';
var head = document.getElementsByTagName('head')[0];
var script = document.createElement('script');
script.src = url + '?key=APIキー';
head.appendChild(script);
script.onload = function() {
self.status = true;
deferred.resolve();
};
script.onerror = function() {
deferred.reject();
};
}
return deferred.promise
}
})さらにちゃんとやるなら、script.onerrorになったときに何度かリトライも実装した方がよいかもしれないが、今回はこんな感じで。以上です。
【JavaScript】GoogleMapで日本地図全体を中心にして全て表示
なんかのネタっぽいけどコピペ用にメモ
var div = var div = document.getElementById('map');
var map = new google.maps.Map(
div, {
mapTypeId: google.maps.MapTypeId.ROADMAP,
disableDefaultUI: true
}
);
var latLngs = [
[45.52289, 141.9366],
[30.9943, 130.6605],
[43.385351, 145.817545],
[33.21787, 129.5525]
];
var bounds = new google.maps.LatLngBounds();
latLngs.forEach(function(latLng) {
bounds.extend(
new google.maps.LatLng(latLng[0], latLng[1]);
)
});
map.fitBounds(bounds);以上です。
「You must pass a component to the function returned by connect. Instead received」エラー対応
不慣れで相変わらず細かい事にはまってる。1つずつメモしていくしかない。コンテナとかコンポーネントとかはReactの勉強中なのでReactのそれ。ただ今回は単純にJavaScriptの使い方の問題だった。
エラーメッセージ
You must pass a component to the function returned by connect. Instead received undefined.
問題のコード
コンテナ（呼ぶ側）
・・・
import { user } from './components/user' // ★ここでエラーになってる
・・・コンポーネント（呼ばれる側）
import React from 'redux'
class User extends React.Component {
render() {
return (
<div />
)
}
}
export default User
解決作
コンテナ（呼ぶ側）
・・・ import user from './components/user' // 中括弧とる ・・・
以上です
【javascript】GoogleMapの基本的な使い方まとめておく
GoogleMap使う機会があったので簡単な地図アプリならこれくらいわかれば作れるだろうということを簡単にまとめておく。っていっても本当に基本的なことだけだけど。
地図を埋め込む要素を用意
<script src="https://maps.googleapis.com/maps/api/js?key=APIキー"></script> <!-- ライブラリを使う場合は、librariesパラメータも設定--> <!-- <script src="https://maps.googleapis.com/maps/api/js?key=APIキー&libraries=&geometry"</script> --> <div id="map" />
地図表示
// 地図のオプションを1つずつ指定して生成
var map = new google.maps.Map(
document.getElementById("map"), {
zoom: 16,
mapTypeId: google.maps.MapTypeId.ROADMAP,
mapTypeControl: false,
fullscreenControl: false,
zoomControl: false,
streetViewControl: false,
streetViewControlOptions: false
}
);
// 地図のオプションを一括で設定して生成
var map = new google.maps.Map(
target, {
mapTypeId: google.maps.MapTypeId.ROADMAP,
disableDefaultUI: true
}
);
マーカーを置く
var marker = new google.maps.Marker({
position: new google.maps.LatLng({
lat: 緯度
lng: 経度
}),
map: map
});
マーカーを移動させる
marker.setPosition( new google.maps.LatLng(緯度, 経度) );
マーカーに画像を設定する
// マーカー作成時に画像を設定
marker = new google.maps.Marker({
position: new google.maps.LatLng(
緯度,
経度
),
map: map,
icon: {
url: 画像URL
scaledSize: new google.maps.Size(
幅,
高さ
)
}
});
// 既存のマーカに画像を設定
marker.setIcon({
url: 画像URL,
size: {
width: 幅
height: 高さ
}
});
マーカーの表示・非表示
marker.setVisible(true); marker.setVisible(false);
マーカーへのクリックイベントを制御
marker.addListener('click', function(e) {
// クリックされると呼ばれる
});
マーカーの削除
marker.setMap(null);
複数マーカーがあるときの位置調整
全ての位置が地図に表示されるように
var latLngs = [
[緯度, 経度],
[緯度, 経度],
[緯度, 経度],
・・・
];
var bounds = new google.maps.LatLngBounds();
latLngs.forEach(function(latLng) {
bounds.extend(
new google.maps.LatLng(
latLng[0],
latLng[1]
)
);
});
map.fitBounds(bounds);
円を描画
var circle = new google.maps.Circle({
strokeColor: '#FF0000',
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: '#FF0000',
fillOpacity: 0.35,
map: map,
center: {
lat: 緯度,
lng: 経度
},
radius: 半径(メートル)
);
2点間の距離を求める
var distance = google.maps.geometry.spherical.computeDistanceBetween( new google.maps.LatLng(緯度, 経度), new google.maps.LatLng(緯度, 経度) );
2点間の角度を求める
var direction = google.maps.geometry.spherical.computeHeading( new google.maps.LatLng(緯度, 経度), new google.maps.LatLng(緯度, 経度) );
ざっくり、こんなところ。以上です。
ES2015（ES6）で読めなかった構文
Reactをちゃんと勉強しようかと今どきのJavascriptのコードを見ているとわからない(というか読めない)ことが多々あった。記号とかの意味がわからないと検索もしずらかったのでメモしておく。
プロパティの略記法(ES6)
オブジェクトにプロパティをセットするときに代入する変数名と代入される変数名を同じにすると省略できる。オブジェクトの中にプロパティがない？値がセットされているのかと思って混乱した。
// ES6
var newUser = (id, greet) => {
return {
flag: true,
id,
greet
}
}
// ES5
var newUser = function(id, greet) {
return {
flag: true,
id: id,
greet: greet
}
}
// 呼び出す
var user = newUser(1, () => console.log('おはよう'))
user.greet() // => "おはよう"
スプレット演算子(ES6)
「...」で配列を展開してくれる。
// ES6 var items1 = [1, 2, 3] var items2 = [4, 5, 6] var items = [...items1, ...items2] // ES5 var items = items1.concat(items2)
分割代入(ES6)
「プロパティの略記法」の逆のイメージ。
オブジェクトのプロパティ名と同じ変数名を{・・・}内に定義すると代入してくれる。
// ES6
var props = {
user: {
id: 1,
flag: true,
greet: () => console.log('おはよう')
}
}
var { user } = props
var { id, flag, greet } = user
user.greet() // => "おはよう"
計算されたプロパティ名(ES6)
const column = "age"
obj = {
[column]: 18
}
console.log(obj) // { age: 18 }
returnのカッコ (おまけ)
これはES6とか関係なく単に頭がおかしかった。Reactのコードでよくあるこんな感じのコード。returnという関数が引数をとるのかと錯覚してしまった。。式を返してるだけですね。。
class Hoge extends Component {
render() {
return (
<div />
);
}
}基本ができてない。。以上です。
