2011年12月12日月曜日

WEBのテーブルをgvChartでグラフ化。

tableの内容を簡単にグラフ化するjQueryプラグイン「gvChart」

http://www.skuare.net/2010/06/tablejquerygvchart.html

●1)gvChartファイルをダウンロード&設置。

●2)ヘッダー記述。

<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="jquery.gvChart.js"></script>
<script type="text/javascript">
gvChartInit();
$(document).ready(function(){
$('#id名').gvChart({
chartType: 'ColumnChart',
//その他に AreaChart、LineChart、BarChart、ColumnChart、PieChartがあります。
gvSettings: {
vAxis: {title: 'No of players'}, //縦軸タイトル
hAxis: {title: 'Month'}, //横軸タイトル
width: 720, //幅
height: 300, //高さ
}
});
</script>


●3)テーブルを記述。

テーブルの数値でない部分はthでしっかり囲むこと。

<table id="id名">
<caption>Game players count</caption>
<thead>
<tr>
<th></th>
<th>Jan</th>
<th>Feb</th>
<th>Mar</th>
<th>Apr</th>
</tr>
</thead>
<tbody>
<tr>
<th>2010</th>
<td>125</td>
<td>185</td>
<td>327</td>
<td>359</td>
</tr>
<tr>
<th>2009</th>
<td>1167</td>
<td>1110</td>
<td>691</td>
<td>165</td>
</tr>
</tbody>
</table>


ついthをtdで記述してしまったりするが、ちゃんとthで囲まないと表示されないので注意!

2011年12月9日金曜日

MySQLでCASEを使って集計

年度別にセミナーA、セミナーB、合計の人数を出したい場合、

CASEを使う。


年度  A  B   計
---------------------
2011  350 200  550
2010  250 150  500
2009  125 120  245
2008  200 100  300


SELECT year_c,
SUM(CASE
WHEN seminar_c = 'A' THEN 1
ELSE 0
END
) as `A`,
SUM(CASE
WHEN seminar_c = 'B' THEN 1
ELSE 0
END
) as `B`,
SUM(CASE
WHEN seminar_c != '取消し' and seminar_c not in('A','B') THEN 1
ELSE 0
END
) as `計`
FROM `table`
GROUP BY year_c
ORDER BY year_c DESC

2011年12月8日木曜日

JQueryライブラリ

ダウンロードせず、Googleにリンクしたほうが簡単。


cssは、テーマがいくつかあり、見た目が変更出来ます。


<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/blitzer/jquery-ui.css
" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js
"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/jquery-ui.min.js
"></script>

jQueryやUI、PrototypeなどのライブラリーをGoogleライブラリAPIから読み込む方法
http://worldwidedeb.net/2011/05/09/jquery-ui-prototype-google-api-url

2011年10月6日木曜日

JQueryでEメールアドレスをカウント。その2

フィールドに入力したEメールアドレスの数をJQueryを使ってカウント。

アドレスの件数をインプットフィールドに表記する。

$("#num").val(count);

と、val() を使う。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=utf-8">
<TITLE></TITLE>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js
"></script>
<script type="text/javascript"><!--
$(function(){
$("#message").keyup(function(){
var txt = $(this).val();
$("#ct").val(
txt.replace(/[^@]/g,'')
);
var count = $("#ct").val().length;
$("#num").val(count);
});
});


// --></script>

</HEAD>
<BODY>

<br><br>
Eメール数をチェック
<br><br>


アドレス数: 
<input type="text" size="8" maxlength="" name="" value="" id="num">件
<br><br>
Eメール: 
<input type="text" size="80" maxlength="" name="" value="" id="message">
<br><br>

<input type="hidden" id="ct">
</div>
<br><br>


</BODY>
</HTML>

2011年10月5日水曜日

JQueryでEメールアドレスをカウント。

フィールドに入力したEメールアドレスの数をJQueryを使ってカウント。

実際はアドレスのチェックはせず、@の数をカウントしています。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=utf-8">
<TITLE></TITLE>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js
"></script>
<script type="text/javascript"><!--
$(function(){
$("#message").keyup(function(){
var txt = $(this).val();
$("#ct").val(
txt.replace(/[^@]/g,'')
);
var count = $("#ct").val().length;
$("#num").text(count);
});
});


// --></script>

</HEAD>
<BODY>

<br><br>
Eメール数をチェック
<br><br>


アドレス数: <div id="num">0</div>
<br><br>
Eメール
<input type="text" size="80" maxlength="" name="" value="" id="message">
<br><br>

<input type="hidden" id="ct">
</div>
<br><br>


</BODY>
</HTML>

2011年9月27日火曜日

スマホアプリ開発Monaca

Monaca
http://monaca.mobi/


WEBでスマートフォン用アプリの環境を提供。

どんなソフトが作れるんだろうか?

2011年9月15日木曜日

半角カタカナをチェック

データに含まれているかをチェック。

全角と違い意外と面倒!

●半角カタカナチェック
----------------------------------
SELECT field FROM `table`
WHERE field like '%ア%' or
field like '%イ%' or
field like '%ウ%' or
field like '%エ%' or
field like '%オ%' or
field like '%カ%' or
field like '%キ%' or
field like '%ク%' or
field like '%ケ%' or
field like '%コ%' or
field like '%タ%' or
field like '%チ%' or
field like '%ツ%' or
field like '%テ%' or
field like '%ト%' or
field like '%ナ%' or
field like '%ニ%' or
field like '%ヌ%' or
field like '%ネ%' or
field like '%ノ%' or
field like '%ハ%' or
field like '%ヒ%' or
field like '%フ%' or
field like '%ヘ%' or
field like '%ホ%' or
field like '%マ%' or
field like '%ミ%' or
field like '%ム%' or
field like '%メ%' or
field like '%モ%' or
field like '%ヤ%' or
field like '%ユ%' or
field like '%ヨ%' or
field like '%ラ%' or
field like '%リ%' or
field like '%ル%' or
field like '%レ%' or
field like '%ロ%' or
field like '%ワ%' or
field like '%ヲ%' or
field like '%ン%'

2011年8月26日金曜日

二重登録を予防

PHPで、データ登録する場合の二重登録を予防する方法


セッションを使って実行してみる。


----------------------------------

#セッションスタート
session_start();


#セッションチェック
if($_SESSION['toroku'] != "done"){
データ登録処理


#登録完了
$_SESSION['toroku'] = "done";
}

else{
echo "登録済みです。";
}


----------------------------------


数行加えるだけなので簡単!

2011年8月22日月曜日

Pupply Linuxをインストールしてみた

古いパソコンにPupply Linuxをインストール。

手順

1)Pupply Linuxをダウンロード。
http://openlab.ring.gr.jp/puppylinux/

2)UNetbootinをダウンロード。
http://www.forest.impress.co.jp/docs/review/20090907_312720.html

3)インストールUSBメモリを作成。上のUNetbootinを利用。

4)パソコンを起動。

5)接続で、Lanを選び、DHCPを自動で取得。


これでインターネットに接続されブラウザの表示が確認出来ました。


UNetbootinはかなり便利。
CDの代わりにUSBを使えます。

2011年8月8日月曜日

サーバ購入

格安のサーバを探す場合、良いサイトがないかなあと思っていたのですが


NTT-X Store
http://nttxstore.jp/


は良さ気です。


特価品などもあるのでコストを抑えてい場合などに利用出来そう。

2011年7月29日金曜日

DOCTYPE宣言

DOCTYPE宣言、あまり気にしてなかった。
が、cssが記述通りに表示されないので調べたらDOCTYPE宣言の記述に問題があったのがわ
かった。


DOCTYPE宣言
http://www.tagindex.com/html_tag/basic/doctype.html


レイアウトが崩れる原因
http://www.css-designsample.com/others/layout.html

正直、場所によってはCSSよりテーブルタグのほうが便利に使えたりもする。

どの程度CSSを使うのかは悩むところ。

2011年7月28日木曜日

今試したいOS

OS X Lion Server
centOS
freeNAS


ハードあってのOSなので空いていて自由に使える機器がないと試せません。

まあ安価な中古品を手に入れるのもいいんでしょうか?

2011年7月26日火曜日

MacのLionサーバ

マックから新しいOS X Lionがリリースされました。

サーバ版もありと。

http://www.apple.com/jp/

ウィンドウズも、マイクロソフトも新鮮味が薄れてます。

と、マックが魅力的に見えてきます。


OSがインストールも価格もシンプルで好感が持てます。
4,300円でサーバ版が購入出来るならWindowサーバを購入するのがばからしくなります。

特にファイルサーバなどで利用が増えるんじゃないでしょうか?

2011年7月15日金曜日

サーバー上のエクセルファイル

ウェブアプリでエクセルを使っている。
エクセルのテンプレートを作り、データを表示されるようにしている。


最近になってエラーメッセージが現れるようになった。

「このファイルを開こうとしたときに、Officeファイル検証機能によって問題が検出され
ました。このファイルを開くのはセキュリティー上危険である可能性があります。」


調べてみると原因は、マイクロソフトが配布したアドオン「KB2501584」だった。
http://asciidotpc.jp/blog/news/2003/

▼解決方法
Microsoft Office File Validation Add-In をアンインストール

これで大丈夫のようだ。

なんだかアナログテレビに表示される地デジのアナウンスのようで・・・

2011年7月14日木曜日

調べ物

商品などを調べるときたいがいアマゾンを使う。

http://www.amazon.co.jp/


品物の数が豊富で、ウェブ表示も快適だ。


たまに価格.comも使おうとしてみるがたいてい表示が止まったようになる。

なぜなんだろうか?

ちょっと改善してほしい。


他のサイト使ったほうがいいんだろうか?

2011年7月13日水曜日

ファイルサーバをマックで

意外といいかもしれない、マックでサーバ。

OS X Lion が7月に販売予定。
サーババージョン OS X Lion Serverも出る、しかも4,300円。
http://www.apple.com/jp/macosx/server/


注目点
・安価。
・インストール&設定などが簡単。
・バックアップソフトなど標準装備。


Windowsサーバよりいいような気がしてきた。


iPhone、iPadなど最近はアップルが市場のニーズをしっかり汲み取っている。


オススメ

2011年7月7日木曜日

ボタン作成

ウェブアプリケーション。


ウェブのボタンを簡単作成。

パソコンで画像ソフトがなくてもいいので重宝します。


Button Maker
http://box.aflat.com/buttonmaker/

2011年6月30日木曜日

バックアップ&リカバリー、テストを実施

EASEUS Todo Backupを使ったバックアップ


http://www.forest.impress.co.jp/lib/sys/file/syncbackup/easeustodobu.html


バックアップ&リカバリーのテストを実施。


バックアップは15分。
リカバリーは45分。


ただしリカバリー後、Windowsが起動せず、1年前のバックアップデータを元にリカバリ
ー。

リカバリー出来てこそのバックアップ。

2011年6月22日水曜日

Windowsのバージョン

細かなウィンドウズのバージョンの調べ方


▼1)
[スタート] ボタンをクリックし、[ファイル名を指定して実行] をクリックします。


▼2)
[名前] ボックスに winver と入力して [OK] をクリックします。

2011年6月21日火曜日

2011年6月20日月曜日

2011年6月16日木曜日

JQuery 画像スライド

JQuery、Light-boxを使う。

画像をスライドして表示します。


▼1)ソフトダウンロード。

http://leandrovieira.com/projects/jquery/lightbox/


▼2)ヘッダーの記述を追加。

<link href="css/jquery.lightbox-0.5.css" type="text/css" rel="stylesheet" media=
"screen" />
<script src="js/jquery.js" type="text/javascript"></script>
<script src="js/jquery.lightbox-0.5.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$('a[rel*=lightbox]').lightBox();
});
</script>


▼3)HTML部分を記述

<a href="img/001.jpg" rel="lightbox">画像1</a>


詳しくは、

jQuery LightBox Pluginの使い方
http://shanabrian.com/web/library/jlightbox.php

2011年6月15日水曜日

ページ全体をセンタリング

スタイルシートで、ページ全体をセンタリング。

id="contents" でページをコンテンツ内に収める。
横幅は widthで設定。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=utf-8">
<TITLE>センタリング</TITLE>

<STYLE TYPE="text/css">
<!--
body {
text-align: center;
}
h1{
text-align: left;
font-size: 150%;
}
#contents {
width: 800px;
margin: 1px auto;
padding: 15px;
text-align: left;
border: 1px dotted #FF0000;
}
-->
</STYLE>

</HEAD>
<BODY>


<div id="contents">

<h1>センタリング</h1>
サイト全体を中央に配置。

</div>


</BODY>
</HTML>

PHP フォルダ内のファイル一覧

フォルダのファイルを一覧表示


<?php

//ディレクトリの場所
$dirName = "../";


//ディレクトリハンドル取得
if ($dir = opendir($dirName)) {

//ファイル読み込み、表示
while (($file = readdir($dir)) !== false) {
if(is_file($dirName.$file)){
echo $file . "<BR>";
}
}
closedir($dir);
}


?>

2011年6月9日木曜日

データの引き算

アプリ、データの引き算を追加。


http://dou.moo.jp

データA - データB を計算します。

1行1データとなります。

2011年6月8日水曜日

PHP配列の比較

array_diff関数を使う。


<?php
$array1 = array("a" => "green", "red", "blue", "red");
$array2 = array("b" => "green", "yellow", "red");
$result = array_diff($array1, $array2);

print_r($result);
?>

この場合、green redが一致

2011年6月7日火曜日

MySQL2つのテーブルのデータ比較

MySQL


table_A と table_B を比較
table_A の table_B にないコードをリストアップ。


SELECT code
FROM `table_A`
WHERE code not in (SELECT code FROM `table_B`)


埋もれてしまっているデータ抽出などに利用。

2011年6月6日月曜日

入力フィールドの表示/非表示

JQuery処理

セレクトで、入力フィールドの表示を切替。

表示 or 非表示

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=utf-8">
<TITLE></TITLE>

<title>フィールドを表示/非表示</title>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></
script>

<script type="text/javascript">
$(function(){
$("#what").change(function(){
var val = $("#what").attr("value");
if(val == "表示"){
$("#txt").css("visibility","visible"); //見える化
$("#tx").text("コード "); //テキスト
}
else{
$("#txt").css("visibility","hidden"); //隠す
$("#tx").text(""); //隠す
}
});

});
</script>

</HEAD>

<BODY>

<br>
フィールドを表示/非表示
<br><br><br>

選択
<select name="" size="1" id="what">
<option value="">-------</option>
<option value="表示">表示</option>
<option value="非表示">非表示</option>
</select>

<font id="tx"></font>
<input type="text" name="mvto" size="5" maxlength="5" style="visibility:hidden"
id="txt" /><br>
<br><br>

</BODY>
</HTML>

アクセス解析

Googleアナリティクスを補ってリアルタイムアクセス解析してくれる感動の無料ツールた
ち3個+1

http://uguiss.com/posts/5


結構よさげ。

ちょっと株のトレーディング画面っぽい。

2011年6月4日土曜日

Chrome OS

Google Chrome OSだけで仕事できる?」最新版を古いノートPCで動かしてみる

http://getnews.jp/archives/118976



Chromeは使ってるのですが、OSはまだ。
これを試してみたいですね。

2011年6月2日木曜日

データの一部抽出

MySQL

データの一部分を取り出したい。locateとsubstringを使う。

例)名前
田中 次郎
山田 小五郎


氏名の間は全角スペース
 namej_c 名前フィールド
 table テーブル


SELECT namej_c, substring(namej_c,1,locate(' ',namej_c)-1)
FROM `table`

2011年6月1日水曜日

お問い合わせプログラム

dou.moo.jp のダウンロード

お問い合わせプログラムを設置。

1ファイルなので設定&設置が簡単です。


http://dou.moo.jp/

2011年5月31日火曜日

文字カウンターを追加

dou.moo.jp にプログラムを追加。


・文字カウンター


シンプルに文字数をカウント。

http://dou.moo.jp/

インド式昼食配達システム

インド式昼食配達システム「ダッバーワーラー」のエラー率の低さが驚異的らしい。

http://dailynewsagency.com/2011/05/28/dabbawallah/


テレビで見たのですがプライドを持って仕事している感じ。

組織、報酬、ルールなどすごくシンプルなのがいいんだろうか?


インドが世界に誇れる仕事ですね。

2011年5月30日月曜日

プログラムを2つ追加

dou.moo.jp に2つプログラムを追加。

・住所ラベル作成
・全角削除


ちょっとしたツールです。

お仕事に使ってください。

http://dou.moo.jp/

2011年5月26日木曜日

チャットワーク

仕事で使えそうなツール

http://www.chat-work.com/ja/


主な機能
・チャット
・タスク管理
・ファイル送信


シンプルなコミュニケーションツール。

HTML5

HTML5 最近よく目にする単語。

IEの対応が遅く、バージョン9から。

仕事用にはIE利用が多い。IEで完全対応となれば使えると思うが、バージョン9は
Windows XPでは使えない。

2011年5月25日水曜日

PCを仮想マシンへ変換

利用中のPCを丸ごとVMware形式の仮想マシンへ変換「VMware vCenter Converter」

http://www.forest.impress.co.jp/docs/review/20110518_446325.html


古いサーバ、又はサーバのバックアップとして有効かと。

動作がもっさりしなければ使えそう。

PHPのEメール抽出ライブラリ

Eメールアドレスの抽出を関数化。
使いやすく。


format_moji.php

<?
#Eメール抽出
function format_email($email) {
     #1行づつ読み込み
     $data = explode("\r\n",trim($email)); 

     #件数
     $ct = count($data);

     #ソート
     sort($data);

     #重複削除
     $data = array_unique($data); 

     $res = "";
     $k = 0;
     #Eメール取り込み
     for( $i = 0; $i < $ct; $i++ ){
     $data[$i] = trim($data[$i],",  ");
     if (preg_match("/^([a-zA-Z0-9])+([a-zA-Z0-9\._-])*@([a-zA-Z0-9_-])+([a-zA-Z0-9\._-]+)+$/", $data[$i])) {
     $res .= $data[$i]."\n"; $k++; 
     } 
     $lase = $data[$i];
     }

     $email = trim($res);
     return $email;
}
?>



▼使い方例)


include("format_moji.php");
$email_c = format_email($email_c);


2011年4月21日木曜日

PHP ファイルカット

ファイルを読み込み、指定行までカットして保存。


<?
# ------------------------------------------------------
# 行カットプログラム
# 2011/04/21 作成
# ------------------------------------------------------

### 設定項目 ################

#ファイル
$tar = "zzz.txt";

#行(この行までカット)
$at = "5";


### 設定項目 ################

#ファイル読み込み
$lines = @file("$tar");
$ken = count($lines);


#指定行まで空にする
for($i=0; $i<$at; $i++ ){
$lines[$i] = "";
}

#連結。
$new = join("",$lines);

#ファイルに書き込み
$fp = fopen("$tar","w+");
flock($fp, LOCK_EX);
fwrite($fp,"");
fwrite($fp,$new);
fclose($fp);


?>

2011年3月24日木曜日

年度関数、ほぼ完成

年度関数。

年度の入力ヘルパーです。

動作にはJQueryが必要です。



(function($) {

$.fn.keisan = function(options){

function calculate(obj){
var count = $(obj).val().length;

//年度セット
myD = new Date();
myY = myD.getYear();     // 年
myZ = myY-1;     // 年
var vx = $("#tyr").attr("value");

vx = vx.replace(/[^0-9\-]/g,"");
$("#tyr").attr("value",vx);

if(vx.match(/\-$/)){
var yr = (vx.substring(0,4));
if(yr <= "2000"){yr = myY;}
else{yr--;}
$("#tyr").attr("value",yr);
}

else if(vx >= 3000){
vx = "";
$("#tyr").attr("value",vx);
}
else if(count==2 && vx >= 40){
vx = "19" + vx;
$("#tyr").attr("value",vx);
}
else if(count==2 && vx !=19 && vx !=20 && vx < 40){
vx = "20" + vx;
$("#tyr").attr("value",vx);
}
};

this.each(function() {
calculate(this);
$(this).keyup(function(){calculate(this)});
$(this).change(function(){calculate(this)});
});

};

})(jQuery);

年度関数、一発入力

- と入力、今年の年度が入る。
また、- - - としていくと 2011 2010 2009 とする。


if(vx.match(/\-$/)){
var yr = (vx.substring(0,4));
if(yr <= "2000"){yr = myY;}
else{yr--;}
$("#tyr").attr("value",yr);
}


※備考
tyr は 年度のフィールドID id="tyr"
JQueryを使ったプログラム

年度関数、下二桁で入力

//桁が二桁で40以下の場合、1900年代とする。
if(count==2 && vx >= 40){
vx = "19" + vx;
$("#tyr").attr("value",vx);
}


//桁が二桁で19でなく、20でなく、40未満の場合、2000年代とする。
if(count==2 && vx !=19 && vx !=20 && vx < 40){
vx = "20" + vx;
$("#tyr").attr("value",vx);
}

tyr は 年度のフィールドID id="tyr"


2011年3月16日水曜日

JQuery年度関数

作成の準備

年度を簡単に入力出来るようにする。
普通4桁入力する、これを少し簡略出来るようにする。


・下2桁で入力。11→2011、09→2009、98→1998 など。
・通常の4桁入力には影響を与えない。 2011 1997 など。
・一発入力を準備。-→2011 など。
・不要な文字は入力不可。数字以外の文字など。


これを踏まえて作ることにしました。

2011年3月15日火曜日

計画停電

東京電力の計画停電。

初日がなくなったので安心していたら2日目に実行。
約2時間ほど停電。

携帯のワンセグは普段ほとんど使わないんですがこういう時便利だと実感。


復旧後、ネットが使えなくなっていた。
ん~無線LANが壊れました
電源はONになりますが、アクセス不可で、初期化も出来ず。
ランプ表示がおかしいので完全に破損してしまった模様。

パソコン周りは普通の電化製品より停電に弱いかもしれません。


残念!

2011年3月10日木曜日

関数

ウェブ画面の入力ヘルパーを作る

・JQueryを利用。
・年度の入力を簡単にする。
・普通の入力を邪魔しない。


ちょっとした入力補助ツールが出来ればと。

2011年3月9日水曜日