ガントチャートの日本語化:さくらレンタルサーバーにdotProjectをインストールする(その2)

前回インストールしたdotProject、日本語表示には対応しましたが、ガントチャートが文字化けしているところで終了しました。

本稿では、それを修正していきます。

しかし、PHPで書かれたソースをかなり修正します。

ですので、面倒な方、PHPが苦手な方、ガントチャートが必要ない方はあきらめるのも手かと思います。

環境

本稿での環境は以下になります。

  • さくらレンタルサーバー
  • PHP 5.4
  • mySQL 5.5
  • dotProject 2.1.8

またphp.iniは、さくらのサーバコントロールパネルにて以下を設定しています。3行目は前回入れたものです。

date.timezone = Asia/Tokyo
default_charset = UTF-8
session.save_path = "/home/yourhome/temp"

環境が異なりますと動作も異なる場合があります。

特にソースの修正は、dotProjectの異なるバージョンには対応しません。

参考ページ

ガントチャートの日本語化で参考させていただいたページは以下です。

dotProject日本語wikiなるものもあったようですが、見つかりませんでした。

ガントチャートの表示

会社・組織、プロジェクト、タスクを入力して、ガントチャートが表示できるようにするまでは前回の通りです。

dotProjectにログインした後、上メニューの「プロジェクト」をクリックして、プロジェクト一覧を表示します。

そしてプロジェクト名をクリックします。

下方の「ガントチャート」タブをクリックすると、ガントチャートが表示されます。(本章をトレースする方は、ガントチャートの画像を別タブで開いておくと、以降の確認で便利です。)

現在のガントチャート表示は以下です。

日本語のところが、□だったり?だったり、文字化けしたりしています。

フォントのインストールと設定

ガントチャートの画像の描画には、JpGraphというグラフを描くライブラリが使われています。

まずはリリース元のAsialさんの「JpGraph 日本語化」に従ってフォントのインストールとJpGraphの設定をしていきます。

ディレクトリの作成

サーバーにフォントを格納するディレクトリを作成します。

Asialさんのページでは「/usr/share/fonts/ja/TrueType/」にフォントを格納しています。自分が管理するサーバーではこのようにします。

レンタルサーバーの場合は「/home/yourhome/local/share/fonts/ja/TrueType/」のように、ホームの下になります。(yourhomeは各位のユーザー名に読み替えて下さい。)

FTPでもよいですが、ローカルにミラーを作成する必要もなさそうですので、SSHを使える方はmkdir -pのほうが早いです。

フォントのインストール

別のウィンドウで、IPAフォントのダウンロードページを表示します。

「IPAサイトからダウンロード」の章、「TTFファイル」の節にある、「4書体パック(Ver.003.03) IPAfont00303.zip(19.1 MB)」をクリックしてダウンロードします。(あるいはURLをコピーしてwget。)

zipを解答し、4つのttfファイルを作成したディレクトリに配置します。

config.phpの修正

Asialさんのページでは、「dotproject/lib/jpgraph/src/jpg-config.inc.php」の40行のコメントアウトを外してMBTTF_DIRの定義をするように書いています。

しかし本稿では、dotProjectの設定に関することは、前回のインストール時に作成されました、config.phpにまとめて書こうと思います。(どちらも動作が同じですので、各位のお好みで決めてください。)

ということで「dotproject/includes/config.php」の最後にMBTTF_DIRのdefineを追加します。

//	日本語フォントのインストールディレクトリ
define("MBTTF_DIR","/home/yourhome/local/share/fonts/ja/TrueType/");
?>

パスの部分はフォントをインストールしたパスに読み替えて下さい。

また今後も、このファイルに設定を付け足していきます。

以上で、定数FF_MINCHO、FF_PMINCHO、FF_GOTHIC、FF_PGOTHICを指定すれば、各々のフォントが使えるようになりました。

JpGraphのソースの修正

では、本格的にソースを修正していきます。

明日のために今日できる事。さんの「dotProjectインストール手順」には、JpGraphを使うアプリである「dotproject/modules/tasks/gantt.php」の、文字化けしている部品のSetFontメソッドのパラメータを修正する方法が書かれています。

しかしここではJpGraphの方を修正して、予防的に文字化けしないようにする方法をとりたいと思います。

後々述べますが、ガントチャートの描画をするファイルは4つあり、それぞれがどこで使われているかよく分からず、そして微妙に記述が異なっています。これらすべてに対応するのに、手間のかからない方法、予防的な方法をとる、というのが理由です。

もしご本家が対応するのであれば、JpGraphのみ更新する場合もあるでしょうから、アプリ側のgantt.phpにて吸収すべきとは思います。(しかし私はご本家にコミットする予定はありませんので…。)

対応すべき個所や理由は書きますので、修正のし方は各位のご判断でどうぞ。

カスタムフォントの定義の修正

gantt.phpでコールされているSetFontメソッドをみると、そのほとんどの第一引数(フォント指定)が「FF_CUSTOM」です。

なので、これが設定できるようにします。

FF_CUSTOMは「dotproject/lib/jpgraph/src/jpg-config.inc.php」の66行目に「define(‘FF_CUSTOM’, 18);」と定義されています。

ここでFF_MINCHOを検索してみると、「dotproject/lib/jpgraph/src/jpgraph_ttf.inc.php」の35-45行に、以下のように定義されています。(これも後で修正しますので、開いておいてください。)

// Japanese font
define("FF_MINCHO",40);
define("FF_PMINCHO",41);
define("FF_GOTHIC",42);
define("FF_PGOTHIC",43);

ここのやや上、22行を見ると、現在FF_CUSTOMに定義されている18は、FF_VERAということがわかります。なので、日本語フォントをデフォルトにするには18を、40-43に変えてやれば良さそうですね。(定数名はrequireの順番次第では使えません。)

jpg-config.inc.phpの修正

まず「dotproject/lib/jpgraph/src/ jpg-config.inc.php」の66行目の「define(‘FF_CUSTOM’, 18);」を以下のように修正します。

if( !defined('FF_CUSTOM') ) 	define('FF_CUSTOM', 18);

未定義の場合はオリジナルの動作の方向で。

config.phpの修正

FF_CUSTOMに対する日本語フォントの指定は、先にフォントへのパスを書いた「dotproject/includes/config.php」の最後に追加してやることにします。

//	日本語フォントのインストールディレクトリ
define("MBTTF_DIR","/home/yourname/local/share/fonts/ja/TrueType/");
//	カスタムフォント指定:FF_PGOTHIC
define('FF_CUSTOM', 43);
?>

ここではプロポーショナルのゴシックを使うことにしていますが、お好みのフォントの数字をご指定下さい。

FTPでPUTしてから、ガントチャートの画像をリロードしてみると…、

エラー。しかしちゃんとipagp.ttfを読み込んで「ボールドがないよ」というところまで行っています。

jpgraph_ttf.inc.phpの修正

日本フォントのスタイルとファイルとの関連は、「dotproject/lib/jpgraph/src/jpgraph_ttf.inc.php」の335-338行にあります。

どのフォントスタイルを指定したとしても同じファイルが読み込まれるように、空文字列をFS_NORMALと同じ値に修正します。

	    /* Japanese fonts */
	    FF_MINCHO  =>  array(
	    	FS_NORMAL =>MINCHO_TTF_FONT,
	    	FS_BOLD =>MINCHO_TTF_FONT,
	    	FS_ITALIC =>MINCHO_TTF_FONT,
	    	FS_BOLDITALIC =>MINCHO_TTF_FONT ),

	    FF_PMINCHO  =>  array(
	    	FS_NORMAL =>PMINCHO_TTF_FONT,
	    	FS_BOLD =>PMINCHO_TTF_FONT,
	    	FS_ITALIC =>PMINCHO_TTF_FONT,
	    	FS_BOLDITALIC =>PMINCHO_TTF_FONT ),

	    FF_GOTHIC   =>  array(
	    	FS_NORMAL =>GOTHIC_TTF_FONT,
	    	FS_BOLD =>GOTHIC_TTF_FONT,
	    	FS_ITALIC =>GOTHIC_TTF_FONT,
	    	FS_BOLDITALIC =>GOTHIC_TTF_FONT ),

	    FF_PGOTHIC  =>  array(
	    	FS_NORMAL =>PGOTHIC_TTF_FONT,
	    	FS_BOLD =>PGOTHIC_TTF_FONT,
	    	FS_ITALIC =>PGOTHIC_TTF_FONT,
	    	FS_BOLDITALIC =>PGOTHIC_TTF_FONT ), 

FTPでPUTしてガントチャートの画像をリロードすると…、

プロジェクトの名前と「今日」が表示されるようになりました。

チャートの方はフォントが異なるようです。そして週の表示も「月/日」の順にしたいですね。

jpgraph_gantt.phpの修正

ガントチャートを描く「dotproject/lib/jpgraph/src/jpgraph_gantt.php」を見ると、スケールのフォントは「FF_FONT1」に初期設定されています。これでは、アプリで未設定のときに日本語を表示できません。

jpgraph_ttf.inc.phpになされているFF_FONT1の定義を変更しても結果的に吸収できますが、FF_FONT0からFF_FONT2は特殊なフォント指定ですので、これらの修正はよろしくありません、(FF_FONT0とFF_FONT2の修正は確実にできません。)

ですので、jpgraph_gantt.phpでFF_FONT1が指定されているフォントの初期値を、新しく「FF_GANTT_CHART」という定義値に変えようと思います。

フォントの初期値の修正

jpgraph_ttf.inc.phpのGanttScaleクラスのコンストラクタの中、1983-1995行を以下のように変えてあげます。

        $this->day = new HeaderProperty();
        $this->day->grid->SetColor("gray");
        $this->day->SetLabelFormatString('l');
        $this->day->SetFont(FF_GANTT_CHART, FS_NORMAL, 7);	//	2016.05.17 yujakudo Inserted

        $this->week = new HeaderProperty();
        $this->week->SetLabelFormatString("w%d");
        $this->week->SetFont(FF_GANTT_CHART);

        $this->month = new HeaderProperty();
        $this->month->SetFont(FF_GANTT_CHART,FS_BOLD);

        $this->year = new HeaderProperty();
        $this->year->SetFont(FF_GANTT_CHART,FS_BOLD);

ここで4行目の「$this->day->SetFont…」は新たに追加しています。(サイズまで指定しているのは後の調整の結果。)

後のSetFontでは、FF_FONT1をFF_GANTT_CHARTに変更しています。

そして予防的に、その他のフォントの初期値もFF_FONT1からFF_GANTT_CHARTに変更します。ファイル内を一括に置換しても良いと思いますが、以下に行番号のみを示しておきますので、各位修正してください。(尚、以降の行番号の表記は、修正の仕方によってはズレている場合があります。)

  • 148行、337行、1548行、3528行。

曜日の文字化け対策

これだけでは、曜日の文字化けは治りませんでした。(ここまでのFF_GANTT_CHARTが未定義の状態では、画像をリロードしてもエラーになります。)

jpgraph_gantt.phpのGanttScaleクラスStrokeDays メソッドの2660行、「$txt = strtoupper($txt[0]);」が悪さしてそうです。

ここをmb_substrで切り出してあげます。

                        $txt = strftime('%A',$datestamp);
//                      $txt = strtoupper($txt[0]);
                         $txt = mb_substr($txt,0,1);	//	2016.05.17 yujakudo
                        break; 

週の表示の修正

週の表示は、jpgraph_gantt.phpの2732行に、「$txt = date(“j/n”,$week);」のようにハードコーディングされています。ここも定数の定義で変わるようにします。

                    $txt = date(WEEKSTYLE_FORMAT, $week);	//	2016.05.17 yujakudo

WEEKSTYLE_FORMATはjpgraph_gantt.phpの冒頭、16行のあたりに定義してあげます。FF_GANTT_CHARTが未指定の場合の対策もここで行います。

if( !defined('FF_GANTT_CHART') )	define('FF_GANTT_CHART', FF_FONT1);
if( !defined('WEEKSTYLE_FORMAT') )	define('WEEKSTYLE_FORMAT', "j/n"); 

未指定の場合の動作はオリジナルと同じ。フォントはFF_FONT1、週のフォーマットは「日/月」です。

config.phpの修正

で、週表示フォーマットとフォントの初期値も「dotproject/includes/config.php」の最後に追加してやることにします。

//	日本語フォントのインストールディレクトリ
define("MBTTF_DIR","/home/motorjp/local/share/fonts/ja/TrueType/");
//	カスタムフォント指定:FF_PGOTHIC
define('FF_CUSTOM', 43);	//	
//	ガントチャートのフォントの初期値:FF_PGOTHIC
define('FF_GANTT_CHART', 43);
//	ガントチャートの週の表記
define('WEEKSTYLE_FORMAT', "n/j");

//	mb_internal_encoding('UTF-8');
?> 

FF_CUSTOMとFF_GANTT_CHARTは別に定義する必要はないと思われるかもしれませんが、前者がアプリケーション層でのフォント、後者がライブラリ層での初期値になります。

WEEKSTYLE_FORMATは、お好みで”n月j日”とかも可能です。

最後のmb_internal_encodingは、環境によります。画像をリロードしてまだ曜日が文字化けするようでしたら入れてください。(私の環境では必要でした。php.iniに「mbstring.internal_encoding = UTF-8」を書いてもよいでしょう。)

ここまでで、画像は以下のような表示になります。

ロケールの修正

まだタスク名が文字化けしています。明日のために今日できる事。さんが最後に書かれているようにutf8_decodeが悪さをしているのでしょう。

gantt.phpを見てみる

「dotproject/modules/tasks/gantt.php」のutf8_decodeをコールしている部分(373、385行)をみると、「if ($locale_char_set==’utf-8′ && function_exists(‘utf8_decode’)) 」のような条件で囲まれています。

これらをコメントアウトしても良いのですが、少々トリッキーな修正をします。

locales.phpの修正

日本語のメッセージファイルに含まれている「dotproject/locales/ja/locales.php」を開きます。

この2行の「$locale_char_set = ‘utf-8’;を以下のようにします。

$locale_char_set = 'UTF-8';

‘UTF-8’と大文字にしました。

組み込み関数やブラウザでは大文字でも理解して処理してくれ、gantt.phpのutf8_decodeの処理は飛ばしてくれることを目論んでいます。もしかしたら、どこかに副作用がでるかもしれませんが…。

画像をリロードしてみますと…、

やっと全て日本語になりました。以上でガントチャートの日本語対応は終了です。

タスクの開始と完了の「月」はいらないなー、と思ったのですが、これは前回の設定にて日付の表示に「2016/May/16」を選択したからでした。Mayが5月と翻訳されているのですね。

適当な選択肢がありませんので、後程修正することにします。

他のガントチャートの確認

ここで、右上の「自分の情報」をクリックしてユーザー情報のページを表示し、下の「Projects Gantt」タブを開きます。

ここのガントチャートも日本語が表示できていることを確認します。

ここのガントチャートは異なるソース「dotproject/modules/tasks/gantt.php」が表示しています。

ロケールを修正しない場合、この中のutf8_decodeも悪さをします。

さらにこのファイルでは、「SetFont(FF_CUSTOM)」を「if (is_file(TTF_DIR . ‘FreeSansBold.ttf’)) {」のような条件で括っています。このフォントはないので、この部品は初期値のフォントで表示されてしまいます。
これについては、本稿ではjpgraph_gantt.phpにてFF_FONT1をFF_GANT_CHARTに置き換えたことで吸収しています。

さらなるガントチャート

さらにもうふたつ、「dotproject/modules/tasks/gantt2.php」「dotproject/modules/projectdesigner/gantt.php」でもガントチャートを描画しているようです。

どの画面で呼ばれているか分かりませんが、もしgantt.phpを修正する手をとったのであれば、これらも同様の修正が必要になります。

トリッキーな修正もしましたが、SetFontやutf8_decodeを逐一修正するのが面倒、という気持ちがお分かり頂けましたでしょうか?

もちろん、逐一コメントアウトしたり修正するのも結構ですし、繰り返しになりますが本家にコミットするのであればそうすべきでしょう。(しかし英語でFS_BOLDを使いたい場合など、難しいですね。)

まとめ

以上、dotProjectのガントチャートの日本語化でした。

(お疲れ様でした~。)
ここでdotProjectのトップページをみると、タスクの「次のToDoを表示:」から選択する名前が、「名, 姓」の順になっています。

次回は、名前表示の修正と、その他の設定について書きたいと思います。

コメントを残す