日本PHPユーザ会 掲示板

日本PHPユーザ会運営の掲示板です。※ただいまテスト運用中です。

• 日本PHPユーザ会 掲示板 » PHP事はじめ » 指定フォルダ内の .jpg 画像をぱらぱら漫画に

指定フォルダ内の .jpg 画像をぱらぱら漫画に

ページ: 1

投稿者 投稿
mild7
#1 2011 年 1 月 2 日(日) 10:41
会員
登録者: 1 2011
返信数: 5
初めまして
自宅の監視カメラの動態検知画像をレンタルサーバーの　/public_html/photo というフォルダにFTPさせて蓄積しております。
この画像をぱらぱら漫画のように表示させたいのですがスクリプトが書けません。
どなたかご指導よろしくおねがいします。
（ＰＨＰまったく初心者です）
nulla
#2 2011 年 1 月 2 日(日) 16:07
会員
登録者: 8 2009
返信数: 103
こんにちは。

Javascriptとphpでできそうですね。
javascriptからphpを呼び出し時間ソートの画像リストを取得。
javascriptで画像リストから順番に画像を取得し一定間隔で次々とブラウザに表示。
mild7
#3 2011 年 1 月 3 日(月) 18:33
会員
登録者: 1 2011
返信数: 5
nullaさん　ありがとうございます。
なるほど手順はそうなんですね　しかし、悲しいかなスキルが無くてスクリプトが解りません。泣く
mild7
#4 2011 年 1 月 14 日(金) 19:57
会員
登録者: 1 2011
返信数: 5
あれからマニュアルと格闘しました。
フォルダ内画像は　0001.jpg 0002.jpg 0003.jpg というふうに連番で役200枚あります。
以下のスクリプトで　（ＰＨＰ５）　
<?php

$SourceDir = "/home/mild7-1/public_html/test/pdat";
// ファイル一覧の取得 -> $files[]
$hd = opendir($SourceDir);
$files = array();
while ( ($fname = readdir($hd)) !== false ) {
if ($fname != "." && $file != "..") {
if (strstr($fname, ".jpg") !== false) {
$path = "{$SourceDir}/{$fname}";
if (is_file($path)) $files[] = $fname;
}
}
}
closedir($hd);
rsort($files);

// ファイルの表示
for ($i = 0; $i < count($files);
$i++) {
$src = $SourceDir."/".$files[$i];
if (is_file($dst)) @unlink($dst);
$pp = sprintf("%04d",$i+1).".jpg";
print("<img src={$pp} width=50>");
}

?>

画像は表示されるようになったのですが、連続で一瞬に表示されます。
ぱらぱら漫画のように１枚の画像で0.5秒間隔で表示させる良い方法を思いつきません
よろしくご指導ください。
nulla
#5 2011 年 1 月 15 日(土) 15:50
会員
登録者: 8 2009
返信数: 103
こんにちは。
今回は特別です。
ファイル名が固定なら、phpは関係なくできます。
てっきり日付毎にファイル名が決定されているのかと思いました。
なのでphpでファイル名を取得し時間ソートリストをjavascriptへ渡す（略）



parapara.html
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<script type="text/javascript" src="parapara.js" charset="utf-8"></script>
<title>パラパラ画像</title>
</head>
<body>
<h1 id="parapara"><img id="image" src="0001.jpg" alt="パラパラ画像" /></h1>
</body>
</html>


parapara.js

var element = "";
var imageUrl = "";
var delay = 500;
var counter = 1;

window.onload = function() {

	element = document.getElementById('image');
	imageUrl = element.getAttribute('src', 0);

	LoadNextImage();

}

function DisplayImage() {
	var parapara = document.getElementById('parapara');
	parapara.appendChild(element);
	LoadNextImage();
}

function LoadBuffer() {
	counter++;
	var splits = imageUrl.split(".");
	var ext = splits[splits.length - 1];
	var imageName = ("000" + counter).slice(-4);
	var image = new Image();
	image.src=imageName + "." + ext;
	image.onload = function() {
		element.setAttribute('src', image.src);
		image = null;
		DisplayImage();
	}
}

function LoadNextImage() {
	window.setTimeout("LoadBuffer()", delay);
}




改造するなりphpと連携させてみたりしてください。
# Javascriptとphpでと言ってるのにどうしてphpのみでしようとしたのかわからない。
mild7
#6 2011 年 3 月 6 日(日) 15:36
会員
登録者: 1 2011
返信数: 5
nullaさん
申し訳ございません。

ページ: 1

• 日本PHPユーザ会 掲示板 » PHP事はじめ » 指定フォルダ内の .jpg 画像をぱらぱら漫画に

日本PHPユーザ会 掲示板 は UseBB 1 フォーラムソフトウェア を使用しています