描画ツールを使うとユーザーが地図上に図形を描画することができます。
実際に使用するクラスは「DrawingManager」になります。

このツールは独立したAPIなので、別途使用することを明記しなくてはなりません。
API読み込みの際にパラメータを追加します。

GoogleMapAPI version 3.26

<script type="text/javascript"
  src="https://maps.googleapis.com/maps/api/js?key=[YOUR_API_KEY]&libraries=drawing">
</script>

実装方法は以下のようになります。

var drawingManager = new google.maps.drawing.DrawingManager();
drawingManager.setMap(map);

様々なオプションを指定して実装する

drawingManager = new google.maps.drawing.DrawingManager({
    drawingMode: google.maps.drawing.OverlayType.MARKER, //CIRCLE, MARKER, POLYGON, POLYLINE, RECTANGLE
    drawingControl: true,
    drawingControlOptions: {
        position: google.maps.ControlPosition.TOP_CENTER,
        drawingModes: ['polygon', 'rectangle'] //['marker', 'polyline', 'rectangle', 'circle', 'polygon']
    },
    polygonOptions: {
        fillColor: '#999999',
        fillOpacity: 0.5,
        strokeWeight: 3,
        clickable: false,
        editable: true,
        zIndex: 1
    },
    rectangleOptions: {
        fillColor: '#999999',
        fillOpacity: 0.5,
        strokeWeight: 3,
        clickable: false,
        editable: true,
        zIndex: 1
    }
});
drawingManager.setMap(map);

続きを読む…»

date関数とstrtotime関数で日付の加算・減算ができます。
同じようにDateTimeクラス・DateIntervalクラスを使っても実現できます。

まずはオブジェクトを生成します。

$date = new DateTime('2000-01-01');

10時間と30秒を加算してみます。

$date->add(new DateInterval('PT10H30S'));

表示書式を指定して出力します。

echo $date->format('Y-m-d H:i:s');

出力は以下のようになります。

2000-01-01 10:00:30

今度は7年、5ヶ月、4日、4時間、3分、2秒を加算してみます。

$date->add(new DateInterval('P7Y5M4DT4H3M2S'));

続きを読む…»

Xcode 9 Swift 4がリリースされたので、アップデートしてみました。
その際のマイグレーションについて参考になるかは分かりませんが、
私が開発しているアプリでの作業をメモしておきます。

今回のアプリはGoogleMapsとRealm、SVProgressHUDを使用したアプリですので
そのAPIパッケージもアップグレードする必要があります。

ターミナルでプロジェクトのディレクトリに移動します。

cd <path-to-project>

pod updateを実行します。

pod update

インストールしていたAPIがアップグレードされます。
iOSのターゲットを9.0としていたため、エラーが解消されなかったのでターゲットを10.0に変更しました。

Xcodeでプロジェクトを開くと色々と警告が表示されていました。

ビルドしてももちろん通らないので、修正をしていきます。
続きを読む…»

2つの日付の差を求めるサンプルです。
DateTimeクラスを使用します。

まずは2つの日付のオブジェクトを生成します。

$datetime1 = new DateTime('1981-04-22');
$datetime2 = new DateTime('1981-01-01');

DateTime::diffメソッドで日付の差を求めます。
返り値にはDateIntervalオブジェクトが返ります。

$interval = $datetime1->diff($datetime2);

DateIntervalオブジェクトのプロパティ

例）2つの日付の差となる日数を出力する

print $interval->days;

また、フォーマットした文字列を取得したい場合はDateInterval::formatメソッドを使用します。
続きを読む…»

スライドショーを実装してくれる「bxSlider」をご紹介します。
これまでにもスライドショーを実装できる色々なプラグインをご紹介しましたが、
最近はこれをよく使います。

bxSlider

まずはjQueryを読み込む。

<script src="./jquery-1.9.1.min.js"></script>

※ちなみに、jQueryが3.1.1だとエラーが発生しました。

続いてbxSliderのファイルを読み込みます。

<link href="./bxslider/jquery.bxslider.css" rel="stylesheet" />
<script type="text/javascript" src="./bxslider/jquery.bxslider.min.js"></script>

スライドさせたい内容を用意します。

<ul class="bxslider">

    <li>
        <img src="./images/exam_picture1.jpg">
    </li>

    <li>
        <img src="./images/exam_picture2.jpg">
    </li>

    <li>
        <img src="./images/exam_picture3.jpg">
    </li>

</ul>

まずは簡単に実装してみましょう。

<script type="text/javascript">
<!--//
(function($) {
    $(document).ready(function(){

        $('.bxslider').bxSlider({
            auto: true,
            autoHover: true,
        });

    });
})(jQuery);
//-->
</script>

続きを読む…»