緯度・経度と測地系について
はじめに モバイル端末が増えるにつれ、Webサイトでも位置情報を扱うことがあります。例えば、現在地周辺の店舗やホテルを探すサイトなど、よく見かけませんか？今回は、そんな位置情報を使う際に知っておきたいマメ知識、「測地系」について簡単にまとめてみました。今更ながら、結構重要です。 測地系 緯度・経度を扱う際には、聞きなれない単語が出てきます。例えば、 日本測地系(Tokyo Datum, TKY) 日本測地系2000(The Japanese Geodetic Datum 2000, JGD2000) 世界測地系(World Geodetic System 1984, WGS84) などなど。これらのことを理解していないと、思わぬ落とし穴にはまってしまいます。そもそも「測地系」という言葉すら、一般的には聞きなれません。 では、測地系とは何か？ 地理や測地学に疎い人は、緯度・経度は場所によって
JavaScriptで日付を扱うならこれ！「moment.js」
■ つかいかた（基礎編） ダウンロードしたmoment.jsをscriptタグで読み込ませたら準備完了です。 あとは下記のような実装で使用できます。 // momentオブジェクトを初期化して・・・ var m = moment(); // formatで出力! var output = m.format("YYYY年MM月DD日 HH:mm:ss dddd"); console.log(output); // => 2013年05月15日 12:34:56 Wednesday // 現在時刻 moment(); // ミリ秒で指定 moment(1368543600000); // タイムスタンプ（秒）で指定 moment.unix(1368543600); // Date.parseで解析可能な文字列を指定 moment("May 15, 2013"); // Dateオブジェクトか
PHPからChromeにログ出力「Chrome Logger」
こんにちは、中川です。 PHPでの開発中のちょっとしたデバッグに、echo や var_dumpで画面に値を出力して確認することがありますよね。 このデバッグ方法は簡単でいいのですが、出力した配列の値などはパッと見で確認しやすいとは言えませんし、画面の表示内容が崩れたりします。 画面に出力しない方法としては、 error_log関数を使ってapacheログやファイルに出力する方法もありますが、 この場合は、サーバ側にログインしてtailなどでファイル内容を確認する必要がでてきます。 そんなちょっとした問題を解決してくれるツール 「Chrome Logger」をご紹介したいと思います。 Chrome Loggerを使えば、JavaScriptのconsole.logのように、 表示画面には影響を与えないでブラウザのデベロッパコンソールにPHPから値を出力できます。 ■Chrome Logge
JavaScriptのコードを測ろう「plato」
こんにちは、中川です。 PHPよりもJavaScriptを書く機会が多いこの頃です。 さて、JavaScriptといえば、何も考えずにアプリを作ると プロジェクトがカオスになることで有名な言語ですね。 気を使って作っていてもちょっとした油断で、 気付いた時にはメンテナンス不可能なコードが出来上がっていたりします。 今回ご紹介するのは、不幸にもそんな状態になってしまったたくさんのコードの どこがどのような状況なのかをパッと確認できるツールをご紹介します。 ■plato https://github.com/jsoverson/plato platoはNode.jsで動作します。 プロジェクトのJSファイルを解析して、 コードの行数や複雑度、メンテナンス性、jshintの警告などをHTMLレポートとしてまとめてくれます。 実際のレポート画面は以下で確認できます。 ・jquery ( http:
【CSS】ハイブリッドアプリを作成するときにいつも書くようにしているCSSプロパティいくつか！
こんにちは、相変わらずドラクエ10三昧の橋本です。 最近はライノス道場に通っています。 さて、今日はハイブリッドアプリのCSSを書く際に毎回指定するようにしているプロパティを備忘録がてらいくつか書いていこうと思います（いつも忘れるので）。 -webkit-tap-highlight-color: rgba(0, 0, 0, 0) iPhoneやAndroidでリンクなどの要素をタップしたときに、iPhoneでは薄いグレー、Androidでは緑やオレンジの枠がデフォルトで表示されます。 -webkit-tap-highlight-colorというプロパティに色を指定することで、この枠の色を変えることができます。 ハイブリッドアプリを作成する際には、この枠が出ると如何にもWebっぽくなってしまうため、透明色を-webkit-tap-hightlight-colorに指定して、枠が表示されないよ
成功するPhoneGapアプリを開発するための高速化＆UXテクニック
興味深いブログ記事が海外で掲載されていました。拙訳で恐縮ですが紹介したいと思います。 内容はPhoneGapアプリを高速化するための手法の解説で、具体的な事例とともに、いくつかのテクニックの紹介が行われています。少し長い記述になりますが、是非PhoneGapやMonacaを用いた開発の参考にしてください。 成功するPhoneGapアプリを開発するための高速化＆UXテクニック Performance & UX Considerations For Successful PhoneGap Apps PhoneGapアプリを開発する方から、下記のような質問をよく尋ねられます。 ・アプリを高速化する方法は？ ・どうやってネイティブアプリのような質感を出せるか？ ・プラットフォームに違和感のないアプリを作るためのテクニックは？ ・OSのルック＆フィールとマッチさせるためには？ この記事では、素晴らし
CSSだけで簡単に吹き出しを作成する方法4つ！
こんにちは、橋本です。 今日はCSSだけでお手軽に吹き出しを作る方法をご紹介したいと思います。 今回ご紹介するサンプルは4つ 一般的な三角の吹き出し 一般的な三角の吹き出し（ボーダー付き） ぽわわーんとした吹き出し 丸い（曲線の）吹き出し 4つのサンプルの実行結果は、ここで確認できます。 IE9以上とIE以外のブラウザであればちゃんと表示されるかと思います。 IE8以下はborder-radiusが使用出来ないため、サンプル3とサンプル4がちゃんと表示されません。 それでは1つ1つ見て行きましょう。 1.一般的な三角の吹き出し まずはソースから。 <!DOCTYPE HTML> <html lang="ja"> <head> <meta charset="UTF-8"> <style type="text/css"> * { box-sizing: border-box; } .wrapp
イラストでわかる！git入門の入門
こんにちは、アシアルの志田です。 社内でもgitが浸透し、皆バージョン管理といえばgitだよね、という空気になってきました。 ですが、これまでバージョン管理システムを使ったことがない人にオススメしても、 「gitて…まあ…そりゃ…ねえ、いつかやらないといけないけど…」 「ギット？ジット？俺はgiはジと読む派なので、gitは胡散臭いと思う」 「そもそもバージョン管理して何が嬉しいの？なんか難しそうでいやだ」 というような反応ばかりでした。 きっとみんな、gitって難しくて訳のわからんもんだと思っているのでは？と思い、 今回はgit入門の入門、gitってなんだ？というところから、簡単にgitを使う際の流れについてご説明します。 ちょっと不安を覚えるようなイラストがついていますので、頑張って読んでください。 バージョン管理ってなに？ プログラムを書いていて、こんなことありませんか？私はあります…
手軽にレンダリング！テンプレートエンジンTransparency
はじめに Transparencyは、Javascriptで記述されたテンプレートエンジンです。クライアント側にて機能します。このテンプレートエンジンは以下の特徴を持っています テンプレートをHTMLの一部として記述（DOM構造内に記述） 属性値に基づくデータの結合（<%= foo %>や{{foo}}などは不要） 繰り返し構造の描画（ループ処理の記述不要） 一般的なJavaScriptテンプレートエンジン（Underscore.js、Mustache、jQuery Templateなど）では、テンプレートをSCRIPTタグ内に記述します。レンダリング時にはテンプレートからHTML文字列を生成します。これらのエンジンを使った場合、HTMLファイルを編集しずらかったり、読み込みが遅れて画面がブレることが多々あります。 一方で、Transparencyを使うと、HTMLを編集しやすい上、レンダ
WEBデザイナー/コーダーでも15分で導入出来るSCSS+Compass
下記、画面のように表示されれば、Rubyがインストールされています。 続けて、Rubyのパッケージ管理システムが最新かどうかのチェックを行います。 最新の状態であれば、下記のように表示されます。 最新でなくても、上記コマンドで最新になりますので、Rubyのインストールはひとまず完了です。 SassとCompassのインストールに移りますが、そのままコマンドプロンプトを使用するので、 ウィンドウは閉じずにいてください。 ● SassとCompassインストール そういえば、ここまで何の説明もなく来てしまいましたが、 SassとかSCSSとかComapssって何？という方もいるかと思いますので、 ちょっとだけ説明をします。 Sassはコンパイル(変換)を行うと、普通のCSSになる言語で、 ミックスイン(機能テンプレートのようなもの？)や変数を扱えたりしますが、 CSSとは似て非なるものなので、
Webデザイン 配色をイメージで学ぶ【基本11色】
こんにちは、高橋です。 近頃、ユーザが製品を経験してどれだけ満足を得れるのかといった仕組みが注目を浴びています。UXですね。配色もUXの範疇とすれば、理解を深めておいて損はないと思います。今回は基本的は色と使われるWebサイトのタイプも併せてザックリと紹介していきます。 ・色紹介 ◯赤（Red） 情熱や活気といった気持ちを高ぶらせる色です。 インパクトを与えたいイベント・キャンペーンサイトで使われています。またサイトカラーだけでなく、強調したいコンテンツ・危険を促す削除ボタン等にも使えます。艶のある赤は上品さを感じさせますが、使い過ぎると落ち着きのない雰囲気になってしまいまいます。反対に暗い赤は気持ちを落ち着かせる効果があります。 ◯緑（Green） 健康や自然といった癒しを連想させる気持ちを落ち着かせる色です。 自然やエコをモチーフとしたサイトで使われています。また安心のカラーとも呼ばれ
自動テストするぞ！tmux + PHPUnit + watchmedoで構築する自動ユニットテスト環境
自動テストするぞ！tmux + PHPUnit + watchmedoで構築する自動ユニットテスト環境 こんにちは、斉藤です。 前回はテスト駆動開発という開発方法をご紹介しました。 その中では”ユニットテストの実行”を主体に開発を行っていくことをお伝えしました。 今回は（余計な話も交えつつ）そのユニットテストの実行を自動化する方法をご紹介します。 * なぜ自動化？ ユニットテストを手動で走らせていませんか？ ユニットテストなど、開発プロセスの中で機械がやれることを手動で行うと、そこでスピード（and 効率）がガクッと下がります。機械任せにできるものは、以下のようなタスクがあります。 手動で行うことにしていると、そのプロセスを実行することを忘れてしまったり、「めんどくさいよー」ってなってしまい、実行回数が減ってしまいます。 その結果、品質の低いアプリが生まれますよね・・・。 近年では、それら
Standard PHP Libraryの例外クラスを活用しよう！
はじめに 今回はPHPでの例外の扱い方、特にSPL (Standard PHP Library)の例外クラスの使い方を見ていきます。例外を投げる際には、エラー種別により例外クラスを切り替え、受け取る側での処理も分けます。Javaなどではごく当たり前です。しかし、PHPプログラマの中には、そこまで切り分けない人も意外といます。Exceptionクラスだらけのコードもしばしば見かけます。 SPLの例外クラス アプリケーションによっては、例外クラスを独自に作成することもあります。とはいえ、いきなり例外クラスを複数定義して使いまわすことは、若干ハードルが高いかもしれません。まずは、SPL (Standard PHP Library)の例外クラスを使ってみましょう。SPLでは以下の例外クラスを提供しています。 SPL 例外クラスツリー LogicException (extends Exceptio
iPhoneアプリ開発開始時に気をつけるべきファイルの取り扱い (2)
こんにちは、亀本です。 今回も、1回目に続いて、iPhoneアプリ申請まわりの、各種ファイルの取り扱いについての話の続きを書いていきたいと思います。 必要なファイル群 まず、前回も紹介したファイル群を改めて列挙しておきます。 ・ 秘密鍵 --> hoge.p12 ・ 秘密鍵に対応したCSR(証明書要求) --> CertificateSigningRequest.certSigningRequest ・ CSRに対応した証明書(開発用) --> development_identity.cer ・ CSRに対応した証明書(申請用) --> distribution_identity.cer ・ 中間証明書 --> AppleWWDRCA.cer ・ デバイスID --> iPhone実機から取得 ・ AppID --> 任意に設定 ・ development用Provisioning Pr
iPhoneアプリ開発開始時に気をつけるべきファイルの取り扱い (1)
こんにちは、亀本です。 今回から何回かに分けて、iPhoneの申請まわりの事に関するファイルの取り扱いノウハウを書いてみたいと思います。 ここでのファイルの取り扱い方の紹介方法は、ファイル一つ一つについて個別に言及するようなまとめ方はしません。 代わりに、そのファイルを作成・利用するタイミングを切り口として紹介し、その際にファイルをどう取り扱うべきかを、その理由とともに説明していきます。 (※なお、あくまでも個人的に感じたノウハウであって、必須事項ではありません。) １回目は、まず触れるべきファイルの説明と、一番最初のCSR発行時に気をつけておくことを紹介します。 はじめに iPhoneの開発を始めようとすると、最初にCSRやらProvisioning Profileやら、いまいちパッとつかみづらい概念が出てきます。 このあたりのよくわからない事、けっこう悩まされてしまいますよね。 とはい
ウェブ制作に重要なワイヤフレームを書けるツール&ウェブサービス6選
wireframe-zoning.jpg by luc legay, on Flickr こんにちは、久保田です。 ウェブサイトのデザインやコーディングを始める前にワイヤフレームは作っていますか?ワイヤフレームは、以下の様な内容を設計するのに利用されます。 ・ページ間の遷移 ・ページの内容 ・ページの大まかなレイアウト これらの項目についてチームやクライアントと予め合意しておくと、後に続くビジュアルデザインやコーディング時の前提を共有でき、作業をスムーズに進めることが出来ます。これからどのようなウェブサイトを作るのか?ということをきちんと共有することでデザイナーやコーダーや関係者と意思統一することができるわけです。 この記事では、このワイヤフレームを書けるツールやウェブサイトを紹介します。 OmniGraffle 古くからある使いやすいMacOSX用のアプリケーションです。ワイヤフレームだ
準備が簡単。JavaScriptテストツール「Testacular」
各質問に答えていくと設定ファイルができあがります。 今回はテストフレームワークはjasmine、 ブラウザはChrome、Firefox、Safariとしています。 ※各質問の選択肢はタブで切り替えられます。 Which testing framework do you want to use ? Press tab to list possible options. Enter to move to the next question. > jasmine Do you want to capture a browser automatically ? Press tab to list possible options. Enter empty string to move to the next question. > Chrome > Firefox > Safari > Whic
ちょっと便利なJavascriptオブジェクトの作り方
今回は、ちょっと便利なJavascriptオブジェクトの作り方をご紹介します。いわゆるモジュール・パターンと呼ばれている方法です。 はじめに 最近、HTML5への注目と共に、Javascriptを使用する機会が増えてきました。以下のように適用範囲は多岐に渡っています。 通常のWebサイトでのユーザビリティ向上 スマートフォン用Webサイト開発 HTML5アプリによるクライアント・アプリ開発 スマートフォンのハイブリッドアプリ開発 Node.jsによるサーバサイド・プログラミング このように、Javascriptが基幹となる仕組みが広がっています。クライアント側とサーバ側を同じ言語で作れることは、開発側にとってはとても有難いことです（学習コストの低減、人的リソース配分の柔軟性など）。もちろん、発注者やエンドユーアにとっても開発速度などの面で利益が生まれます。 Javascriptプログラミン
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://blog.asial.co.jp/1115
コマンドラインの引数解析を簡単に！ : アシアルブログ