2014/08/25

[jQuery][jqplot]グラフの影を表示しない

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="./jquery.jqplot.min.js"></script>
<script>
jQuery(function($){
  $.jqplot('chartdiv',[...],{
      grid: {
        shadow:false
      }
  }
});
</script>
<div id="chartdiv" style="height:500px;width:1000px; "></div>
shadowキーの値をfalseにすればおk
逆にデフォルトor trueにすれば表示されます。

2014/08/24

[jQuery][jqplot]グラフの枠線の色を変更

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="./jquery.jqplot.min.js"></script>
<script>
jQuery(function($){
  $.jqplot('chartdiv',[...],{
      grid: {
        borderColor:'#fbfbfb'
      }
  }
});
</script>
<div id="chartdiv" style="height:500px;width:1000px; "></div>
borderColorキーの値を変更すればおk

2014/08/23

[jQuery][jqplot]グラフの背景色を変更

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="./jquery.jqplot.min.js"></script>
<script>
jQuery(function($){
  $.jqplot('chartdiv',[...],{
      grid: {
        background:'white'
      }
  }
});
</script>
<div id="chartdiv" style="height:500px;width:1000px; "></div>
gridキーの値を変更すればおk

2014/08/22

[jQuery][jqplot]円の影を調整

円の影を調整する方法

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="./jquery.jqplot.min.js"></script>
<script src="./plugins/jqplot.pieRenderer.min.js"></script>
$.jqplot('piechart', [['bar',97],['hoge',3]], {
  seriesDefaults: {
    renderer: $.jqplot.PieRenderer,
    rendererOptions: {
      showDataLabels: true,
      shadowOffset:0
    }
  },
  legend: { show:true, location: 'e' }
});
shadowOffsetキーの値を変更すればおk

ちなみに上の場合は影が表示されない。

2014/08/21

[jQuery][jqplot]円グラフを開始地点を変更

デフォルトでは、円グラフの開始位置は、0度となっているが、変更したい場合は、どうすればいいのだろうか?

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="./jquery.jqplot.min.js"></script>
<script src="./plugins/jqplot.pieRenderer.min.js"></script>

$.jqplot('piechart', [['bar',97],['hoge',3]], {
  seriesDefaults: {
    renderer: $.jqplot.PieRenderer,
    rendererOptions: {
      showDataLabels: true,
      startAngle: -90
    }
  },
  legend: { show:true, location: 'e' }
});
というような形でstartAngleキーの値を変更すればおk

2014/08/20

[jQuery][jqplot]円グラフの色を変更

jqplotを使って円グラフの各部分の色を変更する方法。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="./jquery.jqplot.min.js"></script>
<script src="./plugins/jqplot.pieRenderer.min.js"></script>
$.jqplot('piechart', [[['bar',97],['hoge',3]]], {
  seriesColors:['#ff0000','#00ff00'],
  seriesDefaults: {
    renderer: $.jqplot.PieRenderer,
    rendererOptions: {
      showDataLabels: true
    }
  },
  legend: { show:true, location: 'e' }
});
seriesColorsキーに配列形式で色を設定すればおk

2014/08/19

[jQuery][jqplot]円グラフを描画

jqplotを使って円グラフを描画する方法

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="./jquery.jqplot.min.js"></script>
<script src="./plugins/jqplot.pieRenderer.min.js"></script>
$.jqplot('piechart', [[['bar',97],['hoge',3]]], {
  seriesDefaults: {
    renderer: $.jqplot.PieRenderer,
    rendererOptions: {
      showDataLabels: true
    }
  },
  legend: { show:true, location: 'e' }
});

2014/08/18

[Android]Activityのアニメーションをキャンセル

startActivity()メソッドを使ってActivityをロードしたときのアニメーションが無茶苦茶ダサい。

そこで、このアニメーションを中止するにはどうすればいいのだろうか?

[Android]Activityの画面遷移のアニメーションを無効化するを参考にすると以下の方法でいけるようだ。

<style name="noActivityAnimation" parent="android:Animation.Activity">
    <!-- 呼び出される activity の Enter アニメーション -->
    <item name="android:activityOpenEnterAnimation">@null</item>
    <!-- 他の activity を呼び出す activity の Exit アニメーション -->
    <item name="android:activityOpenExitAnimation">@null</item>
    <!-- 他の activity を閉じる際に表示される activity の Enter アニメーション -->
    <item name="android:activityCloseEnterAnimation">@null</item>
    <!-- activity を閉じる際の Exit アニメーション -->
    <item name="android:activityCloseExitAnimation">@null</item>
</style>
<item name="android:windowAnimationStyle">@style/noActivityAnimation</item>
上ように実装したら確かにアニメーションがなくなった。

2014/08/17

[Android][XML]ActionBarの背景色を変更

AndroidManifest.xmlのapplicationタグのthemeが下の場合

<application
android:theme="@style/AppTheme" >
</application>
style.xml
<resources>
    <!-- ActionBar styles -->
    <style name="MainActionBar"
           parent="@style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
        <item name="android:background">@color/actionbar_background</item>
        
        <!-- Support library compatibility -->
        <item name="background">@color/actionbar_background</item>

    </style>
    
    <!--
        Base application theme, dependent on API level. This theme is replaced
        by AppBaseTheme from res/values-vXX/styles.xml on newer devices.
    -->
    <style name="AppBaseTheme" parent="@style/Theme.AppCompat.Light">
        <!--
            Theme customizations available in newer API levels can go in
            res/values-vXX/styles.xml, while customizations related to
            backward-compatibility can go here.
        -->

         <item name="android:actionBarStyle">@style/MainActionBar</item>
         <!-- Support library compatibility -->
         <item name="actionBarStyle">@style/MainActionBar</item>
        
    </style>

    <!-- Application theme. -->
    <style name="AppTheme" parent="AppBaseTheme">
        <!-- All customizations that are NOT specific to a particular API-level can go here. -->
    </style>
    
</resources>
colors.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <item name="actionbar_background" type="color">#FF0000</item>
</resources>

2014/08/16

[Android]Action Buttonが表示されない件

いくら頑張ってもActionBarにAction Buttonが表示されない。

<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    tools:context="com.example.test.MainActivity" >
    <item
          android:id="@+id/hoge"
          android:icon="@drawable/ic_foo"
          android:showAsAction="always"
     />
</menu>
上のように組んでも表示されない。

なぜかなーっと考えていたら
Actionbar not shown with AppCompat
に答えがありました。ずばり下のようにしたら表示された。
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:compat="http://schemas.android.com/apk/res-auto"
    tools:context="com.example.test.MainActivity"
>
    <item
          android:id="@+id/hoge"
          android:icon="@drawable/ic_foo"
          compat:showAsAction="always"
     />
</menu>
単純にライブラリを使っているので、XML名前空間をそっちに設定しないといけないようです。

2014/08/15

[Android]Unable to resolve target ‘android-16′エラーについて

なんか、ビルドする度にエラーが発生するAndroidですが、今度は、Unable to resolve target ‘android-16′というエラーが発生。
android-support-v7-appcompat] Unable to resolve target ‘android-16′
を読んでみると、API 16がインストールされていないからかなーっと思って、Android SDK Managerでインストールしたらエラーが取れました。

よかった、よかった。

2014/08/14

[Android]android.support.v7.appcompat.R$styleableエラーについて

下の画像のようにMinimus Required SDKをAPI 8:Android 2.2(Froyo)にしてビルドしたら
 photo android_new_application_01_zps1ea26837.png

android.support.v7.appcompat.R$styleable
というエラーが発生した。

原因をさぐってみると、どうやらAndroidのLibraryを入れていなかったからで、下ように「Android SDK Manager」から「Android Support Library」をInstallし
 photo android_new_application_02_zps1d1277bd.png
「File」→「Import」→「Android」→「Existing Android Code Into Workspace」を選択後
 photo android_new_application_03_zps92f1f38d.png
<sdk>/extras/android/support/v7/appcompat
を選択したら、コンパイルエラーが取れた。

2014/08/12

[iOS][Obejective-C]MWPhotoBrowserを使って1枚の写真を表示する

前回、MWPhotoBrowserの導入方法について書きましたが、今回は、1枚の写真を表示するViewとして使ってみることに。

MWPhotoBrowser *photoBrowser = [[MWPhotoBrowser alloc] initWithDelegate:self];

// Set options
photoBrowser.displayActionButton = NO;
photoBrowser.displayNavArrows = NO;
photoBrowser.displaySelectionButtons = NO;
photoBrowser.zoomPhotosToFill = YES;
photoBrowser.alwaysShowControls = NO;
photoBrowser.enableGrid = NO;
photoBrowser.startOnGrid = NO;
photoBrowser.wantsFullScreenLayout = NO;

// Present
[self.navigationController pushViewController:photoBrowser animated:YES];

// Manipulate
[browser showNextPhotoAnimated:NO];
[browser showPreviousPhotoAnimated:NO];
[browser setCurrentPhotoIndex:0];

//MWPhotoBrowserDelegate
- (NSUInteger)numberOfPhotosInPhotoBrowser:(MWPhotoBrowser *)photoBrowser {
    return 1;
}

- (id <MWPhoto>)photoBrowser:(MWPhotoBrowser *)photoBrowser photoAtIndex:(NSUInteger)index {
    if (index == 0){
        UIImage *image;
        return [MWPhoto photoWithImage:image];
    }
    return nil;
}
上のように組めば単発のViewerとして機能します。

2014/08/11

[jQuery]jqplotを使って複数グラフを描画する

一つの表上で複数グラフを表示するには、どうすればいいのだろうか?

下のように組んだらできた

<!--[if lt IE 9]><script src="//cdnjs.cloudflare.com/ajax/libs/flot/0.8.2/excanvas.min.js"></script><![endif]-->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="./jquery.jqplot.min.js"></script>
<script src="./jqplot.dateAxisRenderer.min.js"></script>
<script>
jQuery(function($){
  $.jqplot('chartdiv',
    [
      [
        ['2014/08/01', 2],
        ['2014/08/02',5.12],
        ['2014/08/03',13.1],
        ['2014/08/04',13.1],
        ['2014/08/05',13.1],
        ['2014/08/06',13.1],
        ['2014/08/07',13.1],
        ['2014/08/08',13.1],
        ['2014/08/09',13.1],
        ['2014/08/10',13.1],
        ['2014/08/11',13.1],
        ['2014/08/12',13.1],
        ['2014/08/13',13.1],
        ['2014/08/14',13.1],
        ['2014/08/15',13.1],
        ['2014/08/16',13.1],
        ['2014/08/17',13.1],
        ['2014/08/18',13.1],
        ['2014/08/19',13.1],
        ['2014/08/20',13.1],
        ['2014/08/21',13.1],
        ['2014/08/22',13.1],
        ['2014/08/23',13.1],
        ['2014/08/24',13.1],
        ['2014/08/25',13.1],
        ['2014/08/26',13.1],
        ['2014/08/27',13.1],
        ['2014/08/28',13.1],
        ['2014/08/29',19.1],
        ['2014/08/30',0],
        ['2014/08/31',0]
      ],
      [
        ['2014/08/01', 12],
        ['2014/08/02',15.12],
        ['2014/08/03',23.1],
        ['2014/08/04',23.1],
        ['2014/08/05',23.1],
        ['2014/08/06',23.1],
        ['2014/08/07',23.1],
        ['2014/08/08',23.1],
        ['2014/08/09',23.1],
        ['2014/08/10',23.1],
        ['2014/08/11',23.1],
        ['2014/08/12',23.1],
        ['2014/08/13',23.1],
        ['2014/08/14',23.1],
        ['2014/08/15',23.1],
        ['2014/08/16',23.1],
        ['2014/08/17',23.1],
        ['2014/08/18',23.1],
        ['2014/08/19',23.1],
        ['2014/08/20',23.1],
        ['2014/08/21',23.1],
        ['2014/08/22',23.1],
        ['2014/08/23',23.1],
        ['2014/08/24',23.1],
        ['2014/08/25',23.1],
        ['2014/08/26',23.1],
        ['2014/08/27',23.1],
        ['2014/08/28',23.1],
        ['2014/08/29',29.1],
        ['2014/08/30',0],
        ['2014/08/31',0]
      ],
      [
        ['2014/08/01', 13],
        ['2014/08/02',16.12],
        ['2014/08/03',24.1],
        ['2014/08/04',24.1],
        ['2014/08/05',25.1],
        ['2014/08/06',25.1],
        ['2014/08/07',25.1],
        ['2014/08/08',25.1],
        ['2014/08/09',25.1],
        ['2014/08/10',25.1],
        ['2014/08/11',25.1],
        ['2014/08/12',25.1],
        ['2014/08/13',25.1],
        ['2014/08/14',25.1],
        ['2014/08/15',25.1],
        ['2014/08/16',25.1],
        ['2014/08/17',25.1],
        ['2014/08/18',25.1],
        ['2014/08/19',25.1],
        ['2014/08/20',25.1],
        ['2014/08/21',25.1],
        ['2014/08/22',25.1],
        ['2014/08/23',25.1],
        ['2014/08/24',25.1],
        ['2014/08/25',25.1],
        ['2014/08/26',25.1],
        ['2014/08/27',25.1],
        ['2014/08/28',25.1],
        ['2014/08/29',30.1],
        ['2014/08/30',0.1],
        ['2014/08/31',0.1]
      ]
    ],
    {
      axes:{
        xaxis:{
          renderer:jQuery.jqplot.DateAxisRenderer,
          min:'2014/08/01',
          max:'2014/08/31',
          tickOptions:{
            formatString: '%#d日',
          },
          tickInterval: '1 days'
        },
        yaxis:{
          min:0,
        }
      },
      grid: {
        background:'white'
      },
      series:[{color:'red'},{color:'blue'},{color:'pink'}]
    }
  );
});
</script>
<div id="chartdiv" style="height:500px;width:1000px; "></div>
第二引数を下のように配列で設定すればおk
[
  [
    ['2014/08/01', 2],
    ['2014/08/02',5.12],
    ['2014/08/03',13.1],
    ['2014/08/04',13.1],
    ['2014/08/05',13.1],
    ['2014/08/06',13.1],
    ['2014/08/07',13.1],
    ['2014/08/08',13.1],
    ['2014/08/09',13.1],
    ['2014/08/10',13.1],
    ['2014/08/11',13.1],
    ['2014/08/12',13.1],
    ['2014/08/13',13.1],
    ['2014/08/14',13.1],
    ['2014/08/15',13.1],
    ['2014/08/16',13.1],
    ['2014/08/17',13.1],
    ['2014/08/18',13.1],
    ['2014/08/19',13.1],
    ['2014/08/20',13.1],
    ['2014/08/21',13.1],
    ['2014/08/22',13.1],
    ['2014/08/23',13.1],
    ['2014/08/24',13.1],
    ['2014/08/25',13.1],
    ['2014/08/26',13.1],
    ['2014/08/27',13.1],
    ['2014/08/28',13.1],
    ['2014/08/29',19.1],
    ['2014/08/30',0],
    ['2014/08/31',0]
  ],
  [
    ['2014/08/01', 12],
    ['2014/08/02',15.12],
    ['2014/08/03',23.1],
    ['2014/08/04',23.1],
    ['2014/08/05',23.1],
    ['2014/08/06',23.1],
    ['2014/08/07',23.1],
    ['2014/08/08',23.1],
    ['2014/08/09',23.1],
    ['2014/08/10',23.1],
    ['2014/08/11',23.1],
    ['2014/08/12',23.1],
    ['2014/08/13',23.1],
    ['2014/08/14',23.1],
    ['2014/08/15',23.1],
    ['2014/08/16',23.1],
    ['2014/08/17',23.1],
    ['2014/08/18',23.1],
    ['2014/08/19',23.1],
    ['2014/08/20',23.1],
    ['2014/08/21',23.1],
    ['2014/08/22',23.1],
    ['2014/08/23',23.1],
    ['2014/08/24',23.1],
    ['2014/08/25',23.1],
    ['2014/08/26',23.1],
    ['2014/08/27',23.1],
    ['2014/08/28',23.1],
    ['2014/08/29',29.1],
    ['2014/08/30',0],
    ['2014/08/31',0]
  ],
  [
    ['2014/08/01', 13],
    ['2014/08/02',16.12],
    ['2014/08/03',24.1],
    ['2014/08/04',24.1],
    ['2014/08/05',25.1],
    ['2014/08/06',25.1],
    ['2014/08/07',25.1],
    ['2014/08/08',25.1],
    ['2014/08/09',25.1],
    ['2014/08/10',25.1],
    ['2014/08/11',25.1],
    ['2014/08/12',25.1],
    ['2014/08/13',25.1],
    ['2014/08/14',25.1],
    ['2014/08/15',25.1],
    ['2014/08/16',25.1],
    ['2014/08/17',25.1],
    ['2014/08/18',25.1],
    ['2014/08/19',25.1],
    ['2014/08/20',25.1],
    ['2014/08/21',25.1],
    ['2014/08/22',25.1],
    ['2014/08/23',25.1],
    ['2014/08/24',25.1],
    ['2014/08/25',25.1],
    ['2014/08/26',25.1],
    ['2014/08/27',25.1],
    ['2014/08/28',25.1],
    ['2014/08/29',30.1],
    ['2014/08/30',0.1],
    ['2014/08/31',0.1]
  ]
]
ちなみに、複数グラフを表示すると当然のごとく線の色を変更したくなるのですが、その時は、
{
  series:[{color:'red'},{color:'blue'},{color:'pink'}]
}
とすることで変更することができます。

さらに、グラフの背景を変更したい場合は、
{
  grid: {
    background:'white'
  }
}
とすることで変更することができます。

2014/08/10

[jQuery]jqplotで日付別データを表示する

日付ごとに折れ線グラフを表示するにはどうすればいいだろうか?

下のように組んだら、日付別に表示できた。

<!--[if lt IE 9]><script src="//cdnjs.cloudflare.com/ajax/libs/flot/0.8.2/excanvas.min.js"></script><![endif]-->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="./jquery.jqplot.min.js"></script>
<script src="./jqplot.dateAxisRenderer.min.js"></script>
<script>
jQuery(function($){
  $.jqplot('chartdiv',
    [
      [
        ['2014/08/01', 2],
        ['2014/08/02',5.12],
        ['2014/08/03',13.1],
        ['2014/08/04',13.1],
        ['2014/08/05',13.1],
        ['2014/08/06',13.1],
        ['2014/08/07',13.1],
        ['2014/08/08',13.1],
        ['2014/08/09',13.1],
        ['2014/08/10',13.1],
        ['2014/08/11',13.1],
        ['2014/08/12',13.1],
        ['2014/08/13',13.1],
        ['2014/08/14',13.1],
        ['2014/08/15',13.1],
        ['2014/08/16',13.1],
        ['2014/08/17',13.1],
        ['2014/08/18',13.1],
        ['2014/08/19',13.1],
        ['2014/08/20',13.1],
        ['2014/08/21',13.1],
        ['2014/08/22',13.1],
        ['2014/08/23',13.1],
        ['2014/08/24',13.1],
        ['2014/08/25',13.1],
        ['2014/08/26',13.1],
        ['2014/08/27',13.1],
        ['2014/08/28',13.1],
        ['2014/08/29',19.1],
        ['2014/08/30',0],
        ['2014/08/31',0]
      ]
    ],
    {
      axes:{
        xaxis:{
          renderer:jQuery.jqplot.DateAxisRenderer,
          min:'2014/08/01',
          max:'2014/08/31',
          tickOptions:{
            formatString: '%#d日',
          },
          tickInterval: '1 days'
        },
        yaxis:{
          min:0,
        }
      },
    }
  );
});
</script>
<div id="chartdiv" style="height:500px;width:1000px; "></div>
1日ごとに、gridを描いてグラフを表示させています。
{
  axes:{
    xaxis:{
      min:'2014/08/01',
      max:'2014/08/31',
    },
    yaxis:{
      min:0,
      max:200
    }
  },
}
とすることで、軸上の最大値と最小値を設定することができる。

これは便利だなー。

2014/08/09

[jQuery]jqplotプラグインを使ってグラフを描画する

jqplotを使ってグラフを描画する方法

下のように組んだら何も考えずに出力された。

<!--[if lt IE 9]><script src="//cdnjs.cloudflare.com/ajax/libs/flot/0.8.2/excanvas.min.js"></script><![endif]-->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="./jquery.jqplot.min.js"></script>
<script>
jQuery(function($){
  $.jqplot('chartdiv',
    [
      [
        [1, 2],[3,5.12],[5,13.1],[7,33.6],[9,85.9],[11,219.9]
      ]
    ]
  );
});
</script>
<div id="chartdiv" style="height:400px;width:300px; "></div>
しかもこれIE8でも対応してくれるので、なんとも便利。

2014/08/08

[iOS][Objective-C]MWPhotoBrowserの導入方法

MWPhotoBrowserのAdding to your projectのMethod 3を読みながら導入しようとしたのですが、なぜかエラーが発生していまいます。

どうやら、MapKit.frameworkが必要なようです。

というわけで、Method 3で導入する場合は、下のフレームワークを入れないといけないみたです。

QuartzCore.framework
MessageUI.framework
ImageIO.framework
AssetsLibrary.framework
MapKit.framework

2014/08/07

[本]生命保険のカラクリ

読了

生命保険のカラクリ (文春新書)
岩瀬 大輔
文藝春秋
売り上げランキング: 4,329

第1章 生保のGNP―義理・人情・プレゼント
第2章 煙に巻かれる消費者―誤解だらけのセイホ
第3章 儲けのカラクリ―生命保険会社の舞台裏
第4章 かしこい生保の選び方
生保をさらによく知るためのコラム集
ネット生命保険の可能性―あとがきにかえて

via:目次
ここまで保険業界の構造を暴露してもいいのか!!

今後の生命保険選びの参考になった。

2014/08/06

[iOS][Objective-C]Warning: Multiple build commands for output file

普通にオープンソースを色々とくっつけてビルドしていたら下のようなエラーが発生。

"Warning: Multiple build commands for output file"
で何でかなーっと検索していたら、Xcode:" Warning: Multiple build commands for output file〜"に対処するというエントリーがあって、どうやら、ビルドする時に同じファイルがあるとこの警告がでるようです。

というわけで、必要のないファイルを「Build Phases」の「Copy Bundle Resources」で削除したらビルドが通りました。

今度から気をつけたいですね。

2014/08/05

[iOS][Objective-C]パラメータ付DELETEリクエストができない件

昨日書いたNSMutableURLRequestでDELETEリクエストを送信では、パラメータがなかったのですが、パラメータを付与することはできるのだろうか?

下のように実装してみる。

NSData *data;
NSMutableURLRequest *request = [NSMutableURLRequest requestWithURL:[NSURL URLWithString:@"url"]];
[request setHTTPMethod:@"DELETE"];
[request setHTTPBody:data];
NSURLResponse *response;
NSError *error;
[NSURLConnection sendSynchronousRequest:request returningResponse:&response error:&error];
上を実行するとリクエストが飛ばない。

なんでかなーっと原因を探ってみると、どうやらそもそもDELETEメソッドはbody付パラメータは想定されていなケースがあるようです。

参考URL
body付きHTTP DELETE
4.10 DELETEメソッド