2013年12月5日木曜日

Smartyでjqueryを使うときの注意

Smarty使ってると$や{がキャンセルらしい。
拾ってきたコードを使うときには注意が必要だそう。
http://curious-everything.com/204-entry.html

2013年11月6日水曜日

Rによる統計解析Webサービスの作成(4) Shinyホスティングサービスに登録する

まず以下のサイトからshinyホスティングサービスに登録する
https://rstudio.wufoo.com/forms/shiny-server-beta-program/

1日ほどでメールが届く。
発行されたアカウントとパスワードでR studioにログインする。












home直下にShinyAppsというフォルダを作成する。













その下に、作成したShinyアプリを配置する。
http://spark.rstudio.com/ユーザ名/アプリ名/
でアクセス出来る。
メモリは2GBまでらしく、それ以上使う際はメッセージを送る必要があるらしい。

2013年10月18日金曜日

Rによる統計解析Webサービスの作成(3) 回帰分析プログラムの作成

csvを読み込んで回帰分析を行ってみた。
ソースは以下の通り。

index.html
<html>

<head>
  <script src="shared/jquery.js" type="text/javascript"></script>
  <script src="shared/shiny.js" type="text/javascript"></script>
  <link rel="stylesheet" type="text/css" href="shared/shiny.css"/>
</head>

<body>
  <div id="wrapper">
  <div id="header">
     <h2>回帰分析</h2>
    <a href="#">ホームに戻る</a>
  </div>
  <div id="container">
      <p>CSVファイルは1行目を列名とし、説明変数の列名はyとしてください。</p>
      <h4>CSV取り込み</h4>
      <p><input type="file" name="datafile"></p>  
      <p>結果</p>
      <div style="margin:-20 0 0 0 ;float:left;width:300px">
          <pre id="summary" class="shiny-text-output"></pre>
      </div>
      <div style="float:right">
          <div id="plot" class="shiny-plot-output"
           style="width: 100%; height: 350px; width:350px"></div>
      </div>
  </div>
  </div>
</body>

</html>

server.R
library(shiny)
shinyServer(function(input, output) {
    output$summary <- renderPrint({
        file <- input$datafile
        if(is.null(file)) {
            "CSVデータを入力してください"
        } else {
            filepath <- file$datapath
            data <- read.csv(filepath, header=T)
            data.lm <- lm(y~.,data=data)
            summary(data.lm)
        }
    })
    output$plot <- renderPlot(function() {
        file <- input$datafile
        if(is.null(file)) {
        } else {
            filepath <- file$datapath
            data <- read.csv(filepath, header=T)
            plot(data)
        }
  })
})

実行した画面が以下の通り


















csvを入力する前にもplot部分が表示されてしまうが、そのあたりはどうすればよいかわからなかった。


















次回はこれをwebにアップしたいと思う。

2013年10月16日水曜日

Rによる統計解析Webサービスの作成(2) サンプルの作成

まずはRのコンソールからShinyをインストール

options(repos=c(RStudio='http://rstudio.org/_packages', getOption('repos')))
install.packages('shiny') 
 









ui.Rで表示部分を実装
今回はhtmlで記述

index.html
<html>

<head>
  <script src="shared/jquery.js" type="text/javascript"></script>
  <script src="shared/shiny.js" type="text/javascript"></script>
  <link rel="stylesheet" type="text/css" href="shared/shiny.css"/> 
</head>
 
<body>
  <h1>TEST</h1>
 
  <p>
    <label>Distribution type:</label><br />
    <select name="dist">
      <option value="norm">Normal</option>
      <option value="unif">Uniform</option>
      <option value="lnorm">Log-normal</option>
      <option value="exp">Exponential</option>
    </select> 
  </p>
 
  <p>
    <label>Number of observations:</label><br /> 
    <input type="number" name="n" value="500" min="1" max="1000" />
  </p>
 
  <pre id="summary" class="shiny-text-output"></pre> 
  
  <div id="plot" class="shiny-plot-output" 
       style="width: 100%; height: 400px"></div> 
  
  <div id="table" class="shiny-html-output"></div>
</body>

</html> 
 
続いて、server.Rを実装
library(shiny)

# Define server logic for random distribution application
shinyServer(function(input, output) {

  # Reactive expression to generate the requested distribution. This is 
  # called whenever the inputs change. The output renderers defined 
  # below then all used the value computed from this expression
  data <- reactive({  
    dist <- switch(input$dist,
                   norm = rnorm,
                   unif = runif,
                   lnorm = rlnorm,
                   exp = rexp,
                   rnorm)

    dist(input$n)
  })

  # Generate a plot of the data. Also uses the inputs to build the 
  # plot label. Note that the dependencies on both the inputs and
  # the data reactive expression are both tracked, and all expressions 
  # are called in the sequence implied by the dependency graph
  output$plot <- renderPlot({
    dist <- input$dist
    n <- input$n

    hist(data(), 
         main=paste('r', dist, '(', n, ')', sep=''))
  })

  # Generate a summary of the data
  output$summary <- renderPrint({
    summary(data())
  })

  # Generate an HTML table view of the data
  output$table <- renderTable({
    data.frame(x=data())
  })
}) 
 
Rのコンソールから実行 
runApp("dir") 


 
 
 
 
 
 
 
 
 
 
 
 
 
ブラウザ上で表示することができた。
次回は試しに回帰分析が出来るものを作ってみる。 

Rによる統計解析Webサービスの作成(1) 概要

学生時代Rを少し使ったことがあるので、これで簡単な解析サービスを作れないか考えてみた。
いろいろ調べた結果、Shinyを使うのが簡単そう。

とりあえずローカルで試すには
1.Rをインストール
2.RのコンソールからShinyをインストール
3.ui.R(ブラウザ側の処理)、server.R(サーバー側の処理)の実装
4.Rのコンソールで実行し、ブラウザが立ち上がる
5.さらにShinyホスティングサービスを利用することでWeb上にアップロードできる

アプリの最小構成は以下のようになる
<application-dir>
|-- ui.R (ブラウザ側の処理)
|-- server.R (サーバ側の処理)

ちなみにブラウザ側の処理はHTMLでも記述できる

<application-dir>
|-- www
    |-- index.html
|-- server.R


[参考]
・はじめてのShiny
http://www.slideshare.net/wdkz/shiny-16178934

・github
https://github.com/rstudio/shiny

・Shinyを使ってRだけでWebアプリケーション
http://ixixi.hateblo.jp/entry/2012/11/10/150759

2013年8月14日水曜日

mysqlの文字化け対策

phpmyadmin側
デフォルトでlatin1_swedish_ciになっている
utf8_general_ciに変更

phpソース側
         mysql_connect
で、データベースに接続し、
   mysql_select_db
で、データベースを選択し、

   mysql_query("set names utf8");
で、ユニコードを設定 

2013年8月5日月曜日

0バイトファイルの作り方

コマンドプロンプトで以下を入力

type nul > 任意のファイル名

以上。たまには更新してこー

2013年6月14日金曜日

disabled 属性と readonly 属性の違い

inputの内容がフォームで送れていないものがあったので調べた。

disabled:inputのフォームが送られない
readonly:フォームは送られる

全部まとめると以下のようになる
項目disabledread-only
サポートする要素BUTTON/INPUT/OPTGROUP/OPTION/SELECT/TEXTAREAINPUT/TEXTAREA
フォーカス受け取れない受け取れる
ユーザーは変更できない
タブ移動含まれる含まれない
満足なコントロールならないなる
レンダリングユーザエージェントに依存
動的に変更する方法JavaScript

2013年6月13日木曜日

配列のどれか1つに一致する条件

配列にどれか1つに一致する条件にはsomeメソッドを用います


var a = ['test', 'hoge', 'hello', 'world'];
var b = ['aaa', 'bbb', 'ccc', 'hoge'];
a.some(function(v){ return b.some(function(vv){ return vv == v }) });
->true
phpの場合はarray_searchが使えます

2013年5月23日木曜日

デバッグの基礎

ステップ実行について違いがよくわからなかったのでメモ
 以下はeclipseの場合

















・再開
次のブレークポイントまでプログラムを実行する。





・ステップイン
次の1行を実行する。次の1行にメソッド呼び出しが含まれている場合は、そのメソッド内部に入った状態でプログラムが中断する。

 


・ステップオーバー(F6)

次の1行を実行する。次の1行にメソッド呼び出しが含まれている場合でも、そのメソッド呼び出しを終えた状態でプログラムが中断する。





・ステップリターン(F7)
今実行中のメソッドの実行を終えて、呼び出し元へ戻ります。ただし、次にステップインやステップオーバーを実行しても、単に次の行に矢印が移るだけでcalcurateメソッド自体は実行 されない。

2013年5月9日木曜日

Titaniumでアプリ開発(13) 起動画面とアイコンの設定

起動画面とアイコンは/Resources/iphoneを設定する。
サイズは以下の通り。


ファイル名サイズ説明
appicon.png57 x 57for non-retina iPhone/iPod touch (3/3G/3GS)
appicon@2x.png114 x 114for retina iPhone/iPod touch
appicon-72.png72 x 72for non-retina iPad
appicon-72@2x.png144 x 144for retina iPad
appicon-Small.png29 x 29for non-retina iPhone/iPod touch Spotlight and Settings (optional)
appicon-Small@2x.png58 x 58for retina iPhone/iPod touch Spotlight and Settings (optional)
appicon-Small-50.png50 x 50for non-retina iPad Spotlight and Settings (optional)
appicon-Small-50@2x.png100 x 100for retina iPad Spotlight and Settings (optional)
iTunesArtwork1024 x 1024for Ad Hoc, iTunes
PNGで作成し、拡張子は付けない
サイズは512×512でもいいけど1024×1024が推奨


ファイル名サイズ説明
Default.png320 x 480for non-retina iPhone/iPod touch (3/3G/3GS)
Default@2x.png640 x 960for retina iPhone/iPod touch
Default-568h@2x.png640 x 1136for iPhone 5/iPod touch (4inch)
Default-Portrait.png768 x 1004for non-retina iPad (portrait)
ステータスバー(20px)を除いたサイズ
Default-Portrait@2x.png1536 x 2008for retina iPad (portrait)
ステータスバー(40px)を除いたサイズ
Default-Landscape.png1024 x 748for non-retina iPad (landscape)
ステータスバー(20px)を除いたサイズ
Default-Landscape@2x.png2048 x 1496for retina iPad (landscape)
ステータスバー(40px)を除いたサイズ

Titaniumでアプリ開発(12) メール画面を開く


メール画面を開くにはTi.UI.createEmailDialog()を用います。
Titanium.Geolocation.getCurrentPositionと組み合わせて現在地の緯度経度をメール本文に入れてみました。

function postMail () {
Titanium.Geolocation.getCurrentPosition(
function(e) {
if(!e.success || e.error){
alert('位置情報が取得できませんでした');
return;
}
// 現在地をセット
latitude = e.coords.latitude;
       longitude = e.coords.longitude;
        }
     );
var emailDialog = Ti.UI.createEmailDialog();
    // メールの宛先
    emailDialog.setToRecipients(['to@example.com']);
    // メール本文
    emailDialog.setMessageBody("緯度:"+latitude+"\n経度:"+longitude);
    // メールの題名
    emailDialog.setSubject('');
    // メール送信画面を起動
    emailDialog.open();
}


うまく本文に表示出来ました。



Titaniumでアプリ開発(11) labelを変更する

前回表示された緯度経度のlabelをクリアボタンで消したい。

























色々方法がありそうだけど、labelを張っていたview自体を上書いてみます。

var clearButton = Ti.UI.createButton(
    {
        top: 190,
        right: 115,
        width: 90,
        height: 44,
        title: 'クリア'
    }
);
clearButton.addEventListener(
    'click',
    clearData
);
view.add(clearButton);


function clearData () {
var topView = Ti.UI.createView(
{
height:150,
        width:300,
       top:20,
        font:{fontSize:20},
        borderWidth:2,
        borderColor:'#bbb',
        backgroundColor:'#fff',
        borderRadius:5
}
);
view.add(topView);
}


上書きに成功しました。


























調べていると、win.remove()してどうこうって方法もあったけど、エラーが出てだめでした。





2013年5月6日月曜日

Titaniumでアプリ開発(10) 位置情報を表示する

ひとまず緯度経度を表示するアプリが完成しました。





























ソースの一部

③の部分
タブを作成する
// タブの作成
var tabGroup = Ti.UI.createTabGroup();

var tab1 = Ti.UI.createTab({
    icon: 'KS_nav_views.png',
    title: 'いどけーど',
    window: win1
});

var tab2 = Ti.UI.createTab({
    icon: 'KS_nav_ui.png',
    title: 'ヘルプ',
    window: win2
});

tabGroup.addTab(tab1);
tabGroup.addTab(tab2);
tabGroup.open();

// 現在地ボタンを押したときの処理
function setCurrentPosition () {
Titanium.Geolocation.getCurrentPosition(
function(e) {
if(!e.success || e.error){
alert('位置情報が取得できませんでした');
return;
}
// 現在地をセット
latitude = e.coords.latitude;
            longitude = e.coords.longitude;
// 現在地を動的に表示する
var currentPos = Titanium.Map.createAnnotation({
latitude: latitude,
longitude: longitude,
pincolor: Titanium.Map.ANNOTATION_RED,
animate: true
});
①の部分
                現在地をラベルとして表示する
               \でなく¥を使うとエラーになる
var lolabel = {
text: "緯度:"+latitude+"\r経度:"+longitude,
height: Ti.UI.SIZE
};
var label = Ti.UI.createLabel(lolabel);
topWindow.add(label);
    mapview.addAnnotation(currentPos);
        mapview.show(); // 隠していた地図を表示する
        mapview.setLocation({   // 現在地まで地図をスクロールする
            latitude:latitude,
            longitude:longitude,
            latitudeDelta:0.01,
            longitudeDelta:0.01
        });
}
);
}

②の部分
topのwindowを作成する
var topWindow = Ti.UI.createWindow(
    {
        height:150,
        width:300,
        top:20,
        font:{fontSize:20},
        borderWidth:2,
        borderColor:'#bbb',
        backgrondColor:'#fff',
        borderRadius:5
    }
);

④の部分
ボタンを作成
var locationButton = Ti.UI.createButton(
    {
        top: 190,
        left: 10,
        width: 90,
        height: 44,
        title: '現在地'
    }
);
ボタンを押したときに関数をsetCurrentPosition()を実行
locationButton.addEventListener(
    'click',
    setCurrentPosition
);

クリアボタン、メールボタン、ヘルプとかを一通り実装した段階で試しにAppleStoreに申請してみます。

2013年4月30日火曜日

Titaniumでアプリ開発(9) 現在地を表示する


GPSから現在地情報を取得するにはgetCurrentPositionメソッドを用います

var win = Ti.UI.createWindow({
title: 'Home',
backgroundColor: '#F4F4F4'
});

var view = Ti.UI.createView();

// 最初に中心となる位置をセットしておく
var mapview = Ti.Map.createView({
mapType: Ti.Map.STANDARD_TYPE,
region: {latitude:35.6911, longitude:139.7067, latitudeDelta:0.01, longitudeDelta:0.01},
animate: true,
regionFit: true,
width: 300,
height: 400
});

view.add(mapview);
win.add(view);

Titanium.Geolocation.purpose = 'サンプル';

Titanium.Geolocation.getCurrentPosition(
function(e) {
if(!e.success || e.error){
alert('位置情報が取得できませんでした');
return;
}
// 現在地をセット
latitude = e.coords.latitude;
             longitude = e.coords.longitude;
// 現在地を動的に表示する
var currentPos = Titanium.Map.createAnnotation({
latitude: latitude, 
longitude: longitude, 
pincolor: Titanium.Map.ANNOTATION_RED,
animate: true
});
    mapview.addAnnotation(currentPos);
           mapview.show(); // 隠していた地図を表示する
            mapview.setLocation({   // 現在地まで地図をスクロールする
            latitude:latitude,
            longitude:longitude,
            latitudeDelta:0.01,
            longitudeDelta:0.01
            });
}
);

win.open();

2013年4月29日月曜日

Titaniumでアプリ開発(8) Mapを表示する

MapViewを用いるとMapが表示できます

MapViewを用いた例
var win = Ti.UI.createWindow({
backgroundColor: '#F4F4F4'
});

var view = Ti.UI.createView();

var map = Ti.Map.createView({
mapType: Ti.Map.STANDARD_TYPE,
region: {latitude:35.6911, longitude:139.7067, latitudeDelta:0.01, longitudeDelta:0.01},
animate: true,
regionFit: true,
width: 300,
height: 400
});

view.add(map);
win.add(view);
win.open();

[説明]
mapType:以下の3つが用意されています。
  • Titanium.Map.STANDARD_TYPE:全ての道路と一部の道路名を表示する、衛生画像は表示しない。
  • Titanium.Map.SATELLITE_TYPE:衛星画像を表示する。
  • Titanium.Map.HYBRID_TYPE:衛星画像や道路の名前を表示する。
region:latitude(緯度),longitude(経度),latitudeDelta,longitudeDelta(縮尺)

[実行結果]
新宿周辺が表示される。





















ピンの操作
var shinjuku = Titanium.Map.createAnnotation({
latitude: 35.6911, longitude: 139.7067, 
pincolor: Titanium.Map.ANNOTATION_RED,
})


[説明]
pincolor:ピンの色。以下の3つが用意されている。
  • Titanium.Map.ANNOTATION_GREEN
  • Titanium.Map.ANNOTATION_PURPLE
  • Titanium.Map.ANNOTATION_RED

[実行結果]
ピンが追加された。

























ひとまず、現在地の緯度経度を確認出来るという簡単なアプリを作ってみようと思います。

2013年4月27日土曜日

Titaniumでアプリ開発(7) PROVファイルの読み込みとビルド













前提:対象のアプリのtiapp.xmlに前回取得したAppIDを入力しておく。
1. Titanium Studioを起動しiOS Deviceをクリックします。

























2. Browseから前回ダウンロードしたPROVファイルを選択します。




 3. Finishでビルドされ、iTunesからデバイスに自動で転送されます。

なんとか転送できた。全く未経験だったので、初回は結構大変でした。
以下、参考にしたサイト。
http://tande.jp/lab/2012/01/1621
http://www.kayakinglifestyle.jp/
http://kentaro-shimizu.com/lecture/iphone/step3.html
http://www.adobe.com/jp/devnet/flash/articles/iphone_flash_1.html#articlecontentAdobe_numberedheader_2

Titaniumでアプリ開発(6) AppIDの登録とProvisioning Profile の作成

AppIDの登録
1. Developerサイトから[Identifiers]-[AppID]-右上の[+]をクリックします。











2. 「Description」:説明文
 「Bundle ID」:アプリ固有の名前
        ドメイン名を逆さまにした「com.domainname.appname」などが推奨。
        Titaniumの設定でも使う









































Provisioning Profileの作成
1. Developerサイトから[Provisioning Profiles]-[Distribution]-右上の[+]をクリックします。
















2. 指示に従ってすすめていく。前回までで登録した、Developer、AppID、デバイスを選択する。全て入力したらGenerateしてPROVファイルをダウンロードします。




Titaniumでアプリ開発(5) 開発デバイスの登録

1. 前回と同様にDevelopサイトへアクセスします。
2. Devicesから[+]をクリックし登録を開始します。
 Name:デバイス名(何でもOK)
 UDID:デバイスとiTuneをつなげて確認
    →シリアルNoのとこをクリックすると変わります
    →右クリックでコピー可です
































3. Submitして確定させます。

アカウント1つにつき、100個までデバイス登録できるそうでsy。

2013年4月26日金曜日

Titaniumでアプリ開発(4) 証明書の取得と登録

@yktmnbさんの全体図を拝借。
http://j.mp/kJpj8r

1. Macで[アプリケーション]-[ユーティリティ]-[キーチェーンアクセス]を起動し、「証明書署名要求ファイル(CSRファイル)」を生成する。
下記サイト参照
http://www.adobe.com/jp/devnet/flash/articles/iphone_flash_1.html#articlecontentAdobe_numberedheader_2

2. iPhone Developer Programで1.で作ったCSRを登録
















3.  登録すると証明書がダウンロードできるようになるのでダウンロード。

4. 3. でダウンロードした証明書をダブルクリックするとインストールされる。
キーチェーンアクセス


[2013/4/27追記]
4.の証明書をデスクトップなどに書き出しておく必要あり。

あとやることは・・・
・iPhoneのデバイス情報の登録
・AppIDの取得
・Titanium Studioプロジェクトの設定
・Provisioning Profilesの登録
わりと大変?

2013年4月23日火曜日

Titaniumでアプリ開発(3) Developer登録

iPhoneにアプリを転送するにはDeveloper登録が必要です(年8400円)
https://developer.apple.com/jp/













登録するとメールでIDが届きます。メールのIDをクリックしてアクティベート!
が、失敗。赤線部分をクリックして確認してみます。



問い合わせしないといけないらしい。。。
















日本語でもOKだそうです。



[2013/4/25追記]
どうやらAppleIDをローマ字表記にして、Developerサイトと紐付けしないといけないようです。

Titaniumでアプリ開発(2) Hello Worldを表示する

がんばって環境構築したら、HelloWorldを表示してみます。
右クリック-[New]から[Titanuim Project]を選択し、プロジェクトを作成。

1. app.jsを開く
2. コーディング
 ・windowの作成
 ・viewの作成
 ・labelの作成
 ・labelをviewに追加
 ・viewをwindowに追加
3.iphoneシミュレータを起動



















HelloWorldが表示された。
簡単!


















参考:http://dotinstall.com/lessons/basic_titanium

2013年4月16日火曜日

Titaniumでアプリ開発(1) 環境構築

アプリ作ってみたいと思いJSで手軽に作れるということで、Titanumについてちょっと勉強してみます。
まずは環境構築。

Titaniumとは?
iPhoneアプリ→Objective-C
Androidアプリ→Java
Titanium→Javascriptで開発が可能に!

出来ること
・加速度センサや電子コンパスなどのハードウェアへアクセス
・音声や動画の再生・録画・録音
・HTTPClientによる通信
・SQLiteによるデータベース処理
→無料で利用出来る

参考にするサイト

2013年4月12日金曜日

APIの一括置換

ソースをeclipseで一括置換する方法をメモ
  1. [プロジェクト・エクスプローラー]で対象とするフォルダを選択
  2. メニューの[検索]-[ファイル]をクリック
  3. 以下のような画面が表示されるので、置換前のテキストを入力しスコープをエンクロージング・プロジェクトに設定












よく使う正規表現もついでに記載
\s  ... 半角空白もタブも同一扱い
( ) ... 検索パターンでこれを使うと、置換パターンで\1,\2,\3,...と利用できる。

例:
検索パターン:(<TESTTAG.*type[\s]*=[\s]*)("checkbox")
置換パターン:\1"input" style=\2





2013年4月10日水曜日

SVNでのバージョン情報などの自動埋め込み(その2)

コミット時に自動でプロパティ設定を反映させることが、うまくいかなかったので別の方法をメモ。
eclipse上でキーワード展開したいファイルを含むフォルダを右クリック-[チーム]-[プロパティの設定]
  • プロパティ名をsvn:keywords
  • テキストプロパティに展開したいキーワード
  • 一番下にチェック












これでフォルダ配下のファイルが一括で設定される。
もちろん1ファイルだけでも可能。手順は同じ。

2013年4月9日火曜日

SVNでのバージョン情報などの自動埋め込み



Subversionではコメントに特定キーワードを入れておいてコミットすることで情報を置換させることができる。

使用できるキーワードは以下の通り。
  • Date:commit日時
  • Revision:コミット時のリポジトリのRevision
  • Author:コミットしたユーザ名
  • HeadURL:ファイルのURL
  • Id:ファイル名、Rev、ユーザ名の組み合わせ

使用例
/**
* @fileoverview 画面名
* @author ascii
* $Date$
* $Revision$
* $Author$
* $HeadURL$
* $Id$
*/


なお上記を自動で設定するには、.subversion/configファイルを以下のように修正する必要がある。
enable-auto-props = yes
### Section for configuring automatic properties. [auto-props]
*.js = svn:keywords=HeadURL Date Revision
*.html = svn:keywords=HeadURL Date Revision
js,htmlをinput/addしたときに自動で
svn propset svn:keywords="HeadURL Date Revision"
をするようになる。

eclipseの設定として[ウィンドウ]-[設定]-[ツール]-[SVN]で上記configファイル
のパスを設定ファイルの場所で指定する。




















[2013/04/10:追記]
上記設定でコミットしたが、うまくキーワード展開されない。
パスが間違っている?謎?