??xml version="1.0" encoding="utf-8" standalone="yes"?>亚洲网红精品大秀在线观看,亚洲国产精品自在线一区二区,亚洲视频免费观看http://www.tkk7.com/georgehill/category/1308.html希望能和您交Java~程的知识和见解zh-cnTue, 27 Feb 2007 13:07:31 GMTTue, 27 Feb 2007 13:07:31 GMT60[转蝲]用JavaScript做涂格子游戏http://www.tkk7.com/georgehill/articles/7781.htmlFri, 15 Jul 2005 08:46:00 GMThttp://www.tkk7.com/georgehill/articles/7781.htmlhttp://www.tkk7.com/georgehill/comments/7781.htmlhttp://www.tkk7.com/georgehill/articles/7781.html#Feedback0http://www.tkk7.com/georgehill/comments/commentRss/7781.htmlhttp://www.tkk7.com/georgehill/services/trackbacks/7781.html
用JavaScript做涂格子游戏
原创Qoq 2003q??9?

q是我以前玩q的一个智力游戏,那个游戏的名子叫"开H?Q实质都是一L。学qJavaScript后我p着做了一个,是用JavaScript和HTML及CSS做的一?htm文档?/P>

下面是这个文档的界面及其源文件的详细说明,点击q里可以下蝲源文Ӟ点击下蝲源文?/A>

首先在源文g的开头处我引用了一个名为game01.css的样式表Q?lt;link rel="stylesheet" href="game01.css">Q用qCSS的朋友应该很熟悉了。当把样式表单独写成一个文件时q<link>标记q接q来。下面我分别介绍游戏中的各个功能Q?/P>

游戏一开始会d一?0×10的网|它的大小是可以更改的Q只要在"盘大小"处输入你惌的网格大后再点?开始游?可以了。一开始画?0×10的网格是用drawBoard()函数完成的,如下Q?/P>
function drawBoard()
{
 var str="<table align='center' border='5' cellspacing=' 0' cellpadding='0' id='gameBoard' bordercolor='#0000ff' onMouseOver='mouseOver()' onMouseOut='mouseOut()' onClick='clicktable()'>";
 for(var i=0;i<size;i++)
 {
  str+="<tr>";
  for(var j=0;j<size;j++)
    str+="<td>&nbsp;</td>";
  str+="</tr>";
 }
 str+="</table>";
 return str;
}

其中size是在<script></script>标记的一开始定义的全局变量Q如下:

var size=10;
var totalMoves=0;
var lightOn;
var lightOff;
var currentable;

它的初gؓ10Q所以游戏一开始先d一?0×10的表根{函数把一个完整的 <table> 赋给了变量str,最后返回str。两个for循环是根据size的大赋lstr表格的行数和列数。第一个for循环?str+="<tr>Q赋lstr 行标?lt;tr>Q每一行中用第二个for循环Q?

for(var j=0;j<size;j++)
         str+="<td>&nbsp;</td>"Q?/FONT>

赋给str单元格标?lt;td>,d要赋size个,因此循环条g为:j<size; 。程序运行时?lt;BODY>?lt;script>中调用drawBoard()?document.write(drawBoard());qZ10×10的网根{而对|格的修改则是通过newGame()完成的:

function newGame()
{

 size=document.all.boardSize.value;
 if(size<2)
  size=2;

 if(size>14)
  size=14;

 document.all.boardSize.value=size;
 document.all.gameBoard.outerHTML=drawBoard();
 lightOn=0;
 document.all.LightOn.innerText=lightOn;
 lightOff=Math.pow(size,2);
 document.all.LightOff.innerText=lightOff;
 totalMoves=0;
 document.all.Move.innerText=totalMoves;
}

在单?开始游?时就触发?onClick="newGame()" 事gQ在newGame()函数中我们对全局变量size的D行了修改Qsize=document.all.boardSize.value; x玩家在棋盘大处输入的Dlsize,再调用drawBoard()重新M遍网格就实现了改变网格的大小。其?

if(size<2) size=2Q?BR>if(size>14) size=14;

是ؓ了保证网格的改变在页面允许的范围内,xsize限制?nbsp; 2<=size<=14 。过大或q小的值都会被 document.all.boardSize.value=sizeQ语句把2?4写到"盘大小"处。newGame()中语句: document.all.gameBoard.outerHTML=drawBoard() 是用THML语言讄对象内容。newGame()中下面的内容:

lightOn=0;
document.all.LightOn.innerText=lightOn;
 lightOff=Math.pow(size,2);
document.all.LightOff.innerText=lightOff;
totalMoves=0;
 document.all.Move.innerText=totalMoves;

是对记寻游戏状态的变量赋初|是游戏板左边的那三个记录灯亮个敎ͼ灯灭个数Q以及移动L的变量?/P>

下面我们再来看在鼠标l过时如何ɾ|格变色Q这是用了两个事g:onMouseOver和onMouseOutQ都定义在了drawBoard()的那?<table> 中。当鼠标l过时调用mouseOver():

function mouseOver()
{
 currentable=event.srcElement;
 if(currentable.tagName=="TD")
  {
   currentable._background=currentable.style.backgroundColor;
   currentable.style.backgroundColor=
"#999999";
  }
}

其中currentable表示当前发生事g的对象,用event.srcElement获得。currentable.tagName表示当前发生事g对象的标识符名。于是鼠标经q时 <table> Ӟcurrentable得到当前发生事g?<td> 使得它的_background变ؓ当前的backgroundColor? currentable._background=currentable.style.backgroundColor;  把当前的backgroundColor变ؓ"#999999"? currentable.style.backgroundColor="#999999"; 。看懂了mouseOver()再看mouseOut()׃难了。以下是mouseOut():

function mouseOut()
{ 

 if(currentable.tagName=="TD")
  currentable.style.backgroundColor=currentable._background;
}

很好理解吧,我在q里׃多废话了。有了mouseOver()和mouseOut()可以实现当鼠标l过每个单元格时使其改变颜色Q而当鼠标Ud后又变回原来的颜艌Ӏ?/P>

源文件中最重要的函数要属clicktable()?它的作用是当鼠标点下时得当前对象和上下左右的方格都变色Q而且要更改灯亮个敎ͼ灯灭个数Q以及移动L的|q要判断游戏是否l束{等很多事情。同onMouseOver和onMouseOut事g一P在drawBoard()?<table> 中同样定义了onClick事g。下面是clicktable():

function clicktable()
{
 totalMoves++;

 document.all.Move.innerText=totalMoves;
 if(currentable.tagName=="TD")
 {
  setColor(currentable);

  var cell=currentable.cellIndex;
  var row=currentable.parentElement.rowIndex;
  if(row>0)
   setColor(gameBoard.rows[row-1].cells[cell]);

  if(row<size-1)
   setColor(gameBoard.rows[row+1].cells[cell]);

  if(cell>0)
   setColor(gameBoard.rows[row].cells[cell-1]);

  if(cell<size-1)
   setColor(gameBoard.rows[row].cells[cell+1]);
 }
 var over=light();

 if(!over)
  document.all.LightOff.innerText="You Win!";
}

totalMoves是记录ȝ动次数的那个变量QtotalMoves++很明白了吧Q每当鼠标在某个格子上单L把totalMoves?Qƈ把totalMoves改变后的值写在移动L的位|:document.all.Move.innerText=totalMoves; 其中innerText用来讄或得到该对象起始标记到结束标C间的内容。往下的if语句与另一个函数setColor(current)有关QsetColor(current)通过参数current得到当前对象Q然后将当前对象的颜色改为黄?灯亮)。这样通过

cell=currentable.cellIndex;
row=currentable.parentElement.rowIndex;

取得当前对象所在表格的行、列Q从而gameBoard.rows[row-1].cells[cell]可以访问到与该对象在同列但比它靠前一行的那个对象Q也?setColor(gameBoard.rows[row-1].cells[cell] 把它的颜色改变,同理在该对象叟뀁下、左的对象也都可以访问到Q它们的颜色都得以改变。下面是setColor():

function setColor(current)
{

 if(current._background==""||current._background==null||current._background=="#ccccff")
 {
  current.style.backgroundColo
r="yellow";
  current._background="yellow";
 }
 else if(current._background=="yellow")
 {
  current.style.backgroundColo
r="#ccccff";
  current._background="#ccccff";
 }
}

代码不难Q我׃l说了。clicktable()中最后的那个light()是判断游戏是否结束的函数Q因为函C要数一下灯亮和灯灭的个敎ͼ所以我叫它light()了,如下Q?/P>
function light()
{
 lightOn=0;
 lightOff=0;

 for(var i=0;i<size;i++)
 for(var j=0;j<size;j++)
 if(gameBoard.rows[i].cells[j]._background=="yellow")
  lightOn++;
 else lightOff++;
 document.all.LightOn.innerText=lightOn;
 document.all.LightOff.innerText=lightOff;
 return lightOff;
}

lightOn和lightOffq是在一开始定义的全局变量Q因为鼠标每ơ单d都要查一遍,所以要先给它们?。接下来是用一个双重@环访问每一?<td> 对象?_background 如果是yellow则lightOn++Q如果不是则lightOff++Q最后不要忘记把lightOn和lightOff的D到LightOn和LightOff的innerText里。然后将lightOff反回q在clicktable()中判断是否结束,如果lightOff==0q束ƈ?灯灭"的位|出?You Win"?/P>

最后还有一个规则说明,是一个超链接Q点d调用newWin():

function newWin()
{

 var newin=open("","","height=170,width=250,resizable=0");
 newin.document.write("&nbsp;&nbsp;?盘大小'处输入数?后按'开始游?键即可得C惌的棋盘大。棋盘中黄色表示灯亮Q?白色表示灯灭。单击鼠标后当前Ҏ和上下左右的Ҏ都会变色Q把所有的Ҏ? 点亮'后你p利了Q?);
}

newWin()新打开一个窗口,q在新窗口中写入游戏规则?/P>

以上是Ҏ游戏的全部讲解,所有的功能我都调试通过Q文章中若有疏漏之处q请高手指点?/P>



2005-07-15 16:46 发表评论
]]>
囑փ文g后缀一览表http://www.tkk7.com/georgehill/articles/6554.htmlWed, 22 Jun 2005 08:55:00 GMThttp://www.tkk7.com/georgehill/articles/6554.htmlhttp://www.tkk7.com/georgehill/comments/6554.htmlhttp://www.tkk7.com/georgehill/articles/6554.html#Feedback0http://www.tkk7.com/georgehill/comments/commentRss/6554.htmlhttp://www.tkk7.com/georgehill/services/trackbacks/6554.html
6.5 囑փ文g后缀一览表

文g格式是存储文本、图形或者图像数据的一U数据结构。在文字处理中,存储文本文g要用文件格式。例如,使用微Y公司的Word处理器编写的文gQ可Ҏ不同的应用环境用不同的格式存储。如果用多信息文本格式(Rich Text FormatQRTF)存储Q这个文件就可在其他的^?如Mac?或者用其他的字处理器q行处理。同P存储囑փ也需要有存储格式Q从20世纪70q代囑փ开始进入计机以来Q开发了许许多多的图像文件存储格式,而且互相不兼容,需要用针对特定格式的处理软g。现在都意识刎ͼ不兼容的格式l用户造成很多的不便,因此有些格式也逐渐被淘汰?/P>

在计机中,有两U类型的图:矢量?vector graphics)和位映象?bitmapped graphics)。矢量图是用数学Ҏ描述的一pd炏V线、弧和其他几何ŞӞ如图6-17(a)所C。因此存放这U图使用的格式称为矢量图格式Q存储的数据主要是绘制图形的数学描述Q位映象?bitmapped graphics)也称光栅?raster graphics)Q这U图像电视囑փ一Pp点组成的Q如?-17(b)Q因此存放这U图使用的格式称Z映象图格式,l常UCؓ位图格式Q存储的数据是描q像素的数倹{?/P>

?-17 矢量图与位映象图

除了本章介绍?U常用格式之外,在我们的工作中还会遇到其他图像格式。ؓ方便查阅Q现部分图形与囑փ文g的后~和名U列在表6-11@和表6-12@中。如果编写程序需要很专业的图像格式资源,包括一些源E序(source code)Q可以访问站点:http://www.wotsit.org/Q你可饱览多媒体世界中的各种媒体的存储格式?/P>

?-11@ 位映象图格式/光栅囑օ?bitmapped formats / raster graphics)

后缀

文g名称

后缀

文g名称

AG4

Access G4 document imaging

JFF

JPEG (JFIF)

ATT

AT&T Group IV

JPG

JPEG

BMP

Windows & OS/2

KFX

Kofax Group IV

CAL

CALS Group IV

MAC

MacPaint

CIT

Intergraph scanned images

MIL

Same as GP4 extension

CLP

Windows Clipboard

MSP

Microsoft Paint

CMP

Photomatrix G3/G4 scanner format

NIF

Navy Image File

CMP

LEAD Technologies

PBM

Portable bitmap

CPR

Knowledge Access

PCD

PhotoCD

CT

Scitex Continuous Tone

PCX

PC Paintbrush

CUT

Dr. Halo

PIX

Inset Systems (HiJaak)

DBX

DATABEAM

PNG

Portable Network Graphics

DX

Autotrol document imaging

PSD

Photoshop native format

ED6

EDMICS (U.S. DOD)

RAS

Sun

EPS

Encapsulated PostScript

RGB

SGI

FAX

Fax

RIA

Alpharel Group IV document imaging

FMV

FrameMaker

RLC

Image Systems

GED

Arts & Letters

RLE

Various RLE-compressed formats

GDF

IBM GDDM format

RNL

GTX Runlength

GIF

CompuServe

SBP

IBM StoryBoard

GP4

CALS Group IV - ITU Group IV

SGI

Silicon Graphics RGB

GX1

Show Partner

SUN

Sun

GX2

Show Partner

TGA

Targa

ICA

IBM IOCA (see MO:DCA)

TIF

TIFF

ICO

Windows icon

WPG

WordPerfect image

IFF

Amiga ILBM

XBM

X Window bitmap

IGF

Inset Systems (HiJaak)

XPM

X Window pixelmap

IMG

GEM Paint

XWD

X Window dump

?-12@ 矢量图格?vector graphics formats)

后缀

文g名称

后缀

文g名称

3DS

3D Studio

GEM

GEM proprietary

906

Calcomp plotter

G4

GTX RasterCAD - scanned images
into vectors for AutoCAD

AI

Adobe Illustrator

IGF

Inset Systems (HiJaak)

CAL

CALS subset of CGM

IGS

IGES

CDR

CorelDRAW

MCS

MathCAD

CGM

Computer Graphics Metafile

MET

OS/2 metafile

CH3

Harvard Graphics chart

MRK

Informative Graphics markup file

CLP

Windows clipboard

P10

Tektronix plotter (PLOT10)

CMX

Corel Metafile Exchange

PCL

HP LaserJet

DG

Autotrol

PCT

Macintosh PICT drawings

DGN

Intergraph drawing format

PDW

HiJaak

DRW

Micrografx Designer 2.x, 3.x

PGL

HP plotter

DS4

Micrografx Designer 4.x

PIC

Variety of picture formats

DSF

Micrografx Designer 6.x

PIX

Inset Systems (HiJaak)

DXF

AutoCAD

PLT

HPGL Plot File (HPGL2 has raster format)

DWG

AutoCAD

PS

PostScript Level 2

EMF

Enhanced metafile

RLC

Image Systems "CAD Overlay ESP"
vector files overlaid onto raster images

EPS

Encapsulated PostScript

SSK

SmartSketch

ESI

Esri plot file (GIS mapping)

WMF

Windows Metafile

FMV

FrameMaker

WPG

WordPerfect graphics

GCA

IBM GOCA

WRL

VRML

 

 

后缀

文g名称

 

 

 

 

 

 

 


 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 




2005-06-22 16:55 发表评论
]]>
PNG格式http://www.tkk7.com/georgehill/articles/6552.htmlWed, 22 Jun 2005 08:54:00 GMThttp://www.tkk7.com/georgehill/articles/6552.htmlhttp://www.tkk7.com/georgehill/comments/6552.htmlhttp://www.tkk7.com/georgehill/articles/6552.html#Feedback0http://www.tkk7.com/georgehill/comments/commentRss/6552.htmlhttp://www.tkk7.com/georgehill/services/trackbacks/6552.html6.4 PNG格式

6.4.1 ?/P>

PNG?0世纪90q代中期开始开发的囑փ文g存储格式Q其目的是企图替代GIF和TIFF文g格式Q同时增加一些GIF文g格式所不具备的Ҏ。流式网l图形格?Portable Network Graphic FormatQPNG)名称来源于非官方的“PNG's Not GIF”,是一U位图文?bitmap file)存储格式Q读成“ping”。PNG用来存储灰度囑փӞ灰度囑փ的深度可多到16位,存储彩色囑փӞ彩色囑փ的深度可多到48位,q且q可存储多到16位的通道数据。PNG使用从LZ77z的无损数据压~算法?/P>

PNG文g格式保留GIF文g格式的下列特性:

  1. 使用彩色查找表或者叫做调色板可支?56U颜色的彩色囑փ?
  2. 式?写性能(streamability)Q图像文件格式允许连l读出和写入囑փ数据Q这个特性很适合于在通信q程中生成和昄囑փ?
  3. 逐次D昄(progressive display)Q这U特性可使在通信链\上传输图像文件的同时在l端上显C图像,把整个轮廓显C出来之后逐步昄囑փ的细节,也就是先用低分L率显C图像,然后逐步提高它的分L率?
  4. 透明?transparency)Q这个性能可囑փ中某些部分不昄出来Q用来创Z些有特色的图像?
  5. 辅助信息(ancillary information)Q这个特性可用来在图像文件中存储一些文本注释信息?
  6. 独立于计机软硬件环境?
  7. 使用无损压羃?/LI>

PNG文g格式中要增加下列GIF文g格式所没有的特性:

  1. 每个像素?8位的真彩色图像?
  2. 每个像素?6位的灰度囑փ?
  3. 可ؓ灰度囑֒真彩色图d通道?
  4. d囑փ的γ信息?
  5. 使用循环冗余?cyclic redundancy codeQCRC)损害的文g?
  6. 加快囑փ昄的逐次D昄方式?
  7. 标准的读/写工具包?
  8. 可在一个文件中存储多幅囑փ?/LI>

6.4.2 文gl构

PNG囑փ格式文g(或者称为数据流)׃?字节的PNG文g|名(PNG file signature)域和按照特定l构l织?个以上的数据?chunk)l成?/P>

PNG定义了两U类型的数据块,一U是UCؓ关键数据?critical chunk)Q这是标准的数据块,另一U叫做辅助数据块(ancillary chunks)Q这是可选的数据块。关键数据块定义?个标准数据块Q每个PNG文g都必d含它们,PNGd软g也都必须要支持这些数据块。虽然PNG文g规范没有要求PNG~译码器对可选数据块q行~码和译码,但规范提倡支持可选数据块?/P>

(1) PNG文g|名?/P>

8字节的PNG文g|名域用来识别该文g是不是PNG文g。该域的值是Q?/P>

十进制数

137

80

78

71

13

10

26

10

十六q制?/FONT>

89

50

4e

47

0d

0a

1a

0a

 

(2) 数据块的l构

每个数据块都p6-07所C的?个域l成?/P>

?-07 PNG文g数据块的l构

名称

字节?/B>

说明

Length(长度)

4字节

指定数据块中数据域的长度Q其长度不超q?BR>(231Q?)字节

Chunk Type Code(数据块类型码)

4字节

数据块类型码由ASCII字母(A-Z和a-z)l成

Chunk Data(数据块数?

可变长度

存储按照Chunk Type Code指定的数?/FONT>

CRC(循环冗余?

4字节

存储用来是否有错误的@环冗余码

在表6-07中,CRC(cyclic redundancy check)域中的值是对Chunk Type Code域和Chunk Data域中的数据进行计得到的。CRC具体法定义在ISO 3309和ITU-T V.42中,其值按下面的CRC码生成多式q行计算Q?/P>

x32+x26+x23+x22+x16+x12+x11+x10+x8+x7+x5+x4+x2+x+1

6.4.3 数据块结?/P>

1. 关键数据?/P>

关键数据块中?个标准数据块是:

(1) 文g头数据块IHDR(header chunk)Q它包含有PNG文g中存储的囑փ数据的基本信息,q要作ؓW一个数据块出现在PNG数据中Q而且一个PNG数据中只能有一个文件头数据块?/P>

文g头数据块?3字节l成Q它的格式如?-08所C?/P>

?-08 PNG文g头键数据块的l构

域的名称

字节?/FONT>

说明

Width

4 bytes

囑փ宽度Q以像素为单?/FONT>

Height

4 bytes

囑փ高度Q以像素为单?/FONT>

Bit depth

1 byte

囑փ深度Q?BR>索引彩色囑փQ?Q?Q??
灰度囑փQ?Q?Q?Q??6
真彩色图像:8?6

ColorType

1 byte

颜色cdQ?BR>0Q灰度图? 1Q?Q?Q??6
2Q真彩色囑փQ??6
3Q烦引彩色图像,1Q?Q??

4Q带通道数据的灰度图像,8?6
6Q带通道数据的真彩色囑փQ??6

Compression method

1 byte

压羃Ҏ(LZ77z法)

Filter method

1 byte

滤L器方?/FONT>

Interlace method

1 byte

隔行扫描ҎQ?/P>

0Q非隔行扫描

1Q?Adam7(由Adam M. Costello开发的7
遍隔行扫描方?

(2) 调色板数据块PLTE(palette chunk)Q它包含有与索引彩色囑փ((indexed-color image))相关的彩色变换数据,它仅与烦引彩色图像有养I而且要放在图像数据块(image data chunk)之前。真彩色的PNG数据也可以有调色板数据块,目的是便于非真彩色显C程序用它来量化囑փ数据Q从而显C囑փ。调色板数据块结构如?-09所C?/P>

?-09 调色板数据块l构

域的名称

字节?/FONT>

说明

Red

1 byte

0 = 黑,255 = U?/FONT>

Green

">

0 = 黑,255 = l?/FONT>

Blue

1 byte

0 = 黑,255 = ?/FONT>

调色板实际是一个彩色烦引查找表Q它的表Ҏ目可以是1?56中的一个数Q每个表Ҏ3字节Q因此调色板数据块所包含的最大字节数?68?/P>

(3) 囑փ数据块IDAT(image data chunk)Q它存储实际的数据,在数据流中可包含多个q箋序的图像数据块?/P>

(4) 囑փl束数据IEND(image trailer chunk)Q它用来标记PNG文g或者数据流已经l束Qƈ且必要攑֜文g的尾部?/P>

除了表示数据块开始的IHDR必须攑֜最前面Q?表示PNG文gl束的IEND数据块放在最后面之外Q其他数据块的存N序没有限制?/P>

2. 辅助数据?/P>

PNG文g格式规范制定?0个辅助数据块是:

(1) 背景颜色数据块bKGD(background color)?/P>

(2) 和白色度数据块cHRM(primary chromaticities and white point)。所谓白色度是指当RQGQBQ最大值时在显C器上生的白色度?/P>

(3) 囑փ数据块gAMA(image gamma)?/P>

(4) 囑փ直方图数据块hIST(image histogram)?/P>

(5) 物理像素寸数据块pHYs(physical pixel dimensions)?/P>

(6) h有效位数据块sBIT(significant bits)?/P>

(7) 文本信息数据块tEXt(textual data)?/P>

(8) 囑փ最后修Ҏ间数据块tIME (image last-modification time)?/P>

(9) 囑փ透明数据块tRNS (transparency)?/P>

(10) 压羃文本数据块zTXt (compressed textual data)?/P>

3. 数据块摘?/P>

关键数据块、辅助数据块和专用公共数据块(special-purpose public chunks)l合在表6-10中?/P>

?-10 PNG文g格式中的数据?/P>

数据块符?/B>

数据块名U?/B>

多数据块

可选否

位置限制

IHDR

文g头数据块

?/FONT>

?/FONT>

W一?/FONT>

cHRM

和白色点数据?/FONT>

?/FONT>

?/FONT>

在PLTE和IDAT之前

gAMA

囑փ数据?/FONT>

?/FONT>

?/FONT>

在PLTE和IDAT之前

sBIT

h有效位数据块

?/FONT>

?/FONT>

在PLTE和IDAT之前

PLTE

调色板数据块

?/FONT>

?/FONT>

在IDAT之前

bKGD

背景颜色数据?/FONT>

?/FONT>

?/FONT>

在PLTE之后IDAT之前

hIST

囑փ直方图数据块

?/FONT>

?/FONT>

在PLTE之后IDAT之前

tRNS

囑փ透明数据?/FONT>

?/FONT>

?/FONT>

在PLTE之后IDAT之前

oFFs

(专用公共数据?

?/FONT>

?/FONT>

在IDAT之前

pHYs

物理像素寸数据?/FONT>

?/FONT>

?/FONT>

在IDAT之前

sCAL

(专用公共数据?

?/FONT>

?/FONT>

在IDAT之前

IDAT

囑փ数据?/FONT>

?/FONT>

?/FONT>

与其他IDATq箋

tIME

囑փ最后修Ҏ间数据块

?/FONT>

?/FONT>

无限?/FONT>

tEXt

文本信息数据?/FONT>

?/FONT>

?/FONT>

无限?/FONT>

zTXt

压羃文本数据?/FONT>

?/FONT>

?/FONT>

无限?/FONT>

fRAc

(专用公共数据?

?/FONT>

?/FONT>

无限?/FONT>

gIFg

(专用公共数据?

?/FONT>

?/FONT>

无限?/FONT>

gIFt

(专用公共数据?

?/FONT>

?/FONT>

无限?/FONT>

gIFx

(专用公共数据?

?/FONT>

?/FONT>

无限?/FONT>

IEND

囑փl束数据

?/FONT>

?/FONT>

最后一个数据块

tEXt?/FONT>zTXt数据块中?/FONT>标准关键字:

Title

囑փ名称或者标?/P>

Author

囑փ作者名

Description

囑փ说明

Copyright

版权声明

CreationTime

原图创作旉

Software

创作囑փ使用的Y?/P>

Disclaimer

弃权

Warning

囑փ内容警告

Source

创作囑փ使用的设?/P>

Comment

各种注释



2005-06-22 16:54 发表评论
]]>
JPEG格式http://www.tkk7.com/georgehill/articles/6551.htmlWed, 22 Jun 2005 08:53:00 GMThttp://www.tkk7.com/georgehill/articles/6551.htmlhttp://www.tkk7.com/georgehill/comments/6551.htmlhttp://www.tkk7.com/georgehill/articles/6551.html#Feedback0http://www.tkk7.com/georgehill/comments/commentRss/6551.htmlhttp://www.tkk7.com/georgehill/services/trackbacks/6551.html6.3 JPEG格式

6.3.1 ?/P>

微处理机中的存放序有正?big endian)和逆序(little endian)之分。正序存攑ְ是高字节存放在前低字节在后,而逆序存放是低字节在前高字节在后。例如,十六q制CؓA02BQ正序存攑ְ是A02BQ逆序存放是2BA0。摩托罗?Motorola)公司的微处理器用正序存放,而英特尔(Intel)公司的微处理器用逆序。JPEG文g中的字节是按照正序排列的?/P>


JPEG委员会在制定JPEG标准Ӟ定义了许多标?marker)用来区分和识别图像数据及其相关信息,但笔者没有找到JPEG委员会对JPEG文g交换格式的明定义。直?998q?2月从分析|上具体的JPG囑փ来看Q用比较广泛的q是JPEG文g交换格式(JPEG File Interchange FormatQJFIF)
?/FONT>本号?.02。这?992q?月由在C-Cube Microsystems公司工作的Eric Hamilton提出的。此外还有TIFF JPEG{格式,但由于这U格式比较复杂,因此大多数应用程序都支持JFIF文g交换格式?

JPEG文g使用的颜色空间是CCIR 601推荐标准q行的彩色空?参看W??。在q个彩色I间中,每个分量、每个像素的电^规定?55U,?位代码表C。从RGB转换成YCbCrI间Ӟ使用下面的精的转换关系Q?/P>

       Y = 256 * E'y

      Cb = 256 * [E'Cb] + 128

      Cr = 256 * [E'Cr] + 128
其中亮度电^E'y和色差电qE'Cb和E'Cb分别是CCIR 601定义的参数。由于E'y的范围是0?QE'Cb和E'Cb的范围是-0.5?0.5Q因此Y, Cb和Cr的最大值必要到255。于是RGB和YCbCr之间的{换关p需要按照下面的Ҏ计算?/P>

(1) 从RGB转换成YCbCr

YCbCr(256U?分量可直接从?位表C的RGB分量计算得到Q?/P>

       Y =   0.299 R + 0.587 G  + 0.114 B

     Cb = - 0.1687R - 0.3313G  + 0.5   B + 128

    Cr = 0.5 R - 0.4187G - 0.0813 B + 128

需要注意的是不是所有图像文件格式都按照R0QG0QB0Q…?RnQGnQBn的次序存储样本数据,因此在RGB文g转换成JFIF文g旉要首先验证RGB的次序?/P>

(2) 从YCbCr转换成RGB

RGB分量可直接从YCbCr(256U?分量计算得到Q?/P>

     R = Y                 + 1.402 (Cr-128)

      G = Y - 0.34414 (Cb-128) - 0.71414 (Cr-128)

      B = Y + 1.772 (Cb-128)

在JFIF文g格式中,囑փh的存N序是从左到右和从上到下。这是说JFIF文g中的W一个图像样本是囑փ左上角的h?/P>

6.3.2 文gl构

JFIF文g格式直接使用JPEG标准为应用程序定义的许多标记Q因此JFIF格式成了事实上JPEG文g交换格式标准。JPEG的每个标记都是由2个字节组成,其前一个字节是固定?xFF。每个标C前还可以d数目不限?xFF填充字节(fill byte)。下面是其中?个标讎ͼ

  1. SOI  0xD8            囑փ开?
  2. APP0 0xE0            JFIF应用数据?
  3. APPn 0xE1 - 0xEF    其他的应用数据块(n, 1?5)
  4. DQT  0xDB           量化?
  5. SOF0 0xC0            帧开?
  6. DHT  0xC4           霍夫?Huffman)?
  7. SOS  0xDA           扫描U开?
  8. EOI  0xD9            囑փl束

Z读者对JPEG定义的标C目了Ӟ现将JPEG的标记码列于?-05Qƈ保留英文解释?/P>

?-05 JPEG定义的标?/P>

Symbol

(W号)

Code Assignment

(标记代码)

Description

(说明)

Start Of Frame markers, non-hierarchical Huffman coding

SOF0

0xFFC0

Baseline DCT

SOF1

0xFFC1

Extended sequential DCT

SOF2

0xFFC2

Progressive DCT

SOF3

0xFFC3

Spatial (sequential) lossless

Start Of Frame markers, hierarchical Huffman coding

SOF5

0xFFC5

Differential sequential DCT

SOF6

0xFFC6

Differential progressive DCT

SOF7

0xFFC7

Differential spatial lossless

Start Of Frame markers, non-hierarchical arithmetic coding

JPG

0xFFC8

Reserved for JPEG extensions

SOF9

0xFFC9

Extended sequential DCT

SOF10

0xFFCA

Progressive DCT

SOF11

0xFFCB

Spatial (sequential) Lossless

Start Of Frame markers, hierarchical arithmetic coding

SOF13

0xFFCD

Differential sequential DCT

SOF14

0xFFCE

Differential progressive DCT

SOF15

0xFFCF

Differential spatial Lossless

Huffman table specification

DHT

0xFFC4

Define Huffman table(s)

arithmetic coding conditioning specification

DAC

0xFFCC

Define arithmetic conditioning table

Restart interval termination

RSTm

0xFFD0?xFFD7

Restart with modulo 8 counter m

Other marker

SOI

0xFFD8

Start of image

EOI

0xFFD9

End of image

SOS

0xFFDA

Start of scan

DQT

0xFFDB

Define quantization table(s)

DNL

0xFFDC

Define number of lines

DRI

0xFFDD

Define restart interval

DHP

0xFFDE

Define hierarchical progression

EXP

0xFFDF

Expand reference image(s)

APPn

0xFFE0?xFFEF

Reserved for application use

JPGn

0xFFF0?xFFFD

Reserved for JPEG extension

COM

0xFFFE

Comment

Reserved markers

TEM

0xFF01

For temporary use in arithmetic coding

RES

0xFF02?xFFBF

Reserved

JPEG文g׃面的8个部分组成:

(1) 囑փ开始SOI(Start of Image)标记

(2) APP0标记(Marker)

?APP0长度(length)

?标识W?identifier)

?版本?version)

?X和Y的密度单?units=0Q无单位Qunits=1Q点?英寸Qunits=2Q点?厘米)

?X方向像素密度(X density)

?Y方向像素密度(Y density)

?~略图水q_素数?thumbnail horizontal pixels)

?~略囑֞直像素数?thumbnail vertical pixels)

?~略图RGB位图(thumbnail RGB bitmap)

(3) APPn标记(Markers)Q其中n=1?5(任?

?APPn长度(length)

?׃详细信息(application specific information)

(4) 一个或者多个量化表DQT(difine quantization table)

?量化表长?quantization table length)

?量化表数?quantization table number)

?量化?quantization table)

(5) 帧图像开始SOF0(Start of Frame)

?帧开始长?start of frame length)

?_ֺ(precision)Q每个颜色分量每个像素的位数(bits per pixel per color component)

?囑փ高度(image height)

?囑փ宽度(image width)

?颜色分量?number of color components)

?Ҏ个颜色分?for each component)

    • ID
    • 垂直方向的样本因?vertical sample factor)
    • 水^方向的样本因?horizontal sample factor)
    • 量化表号(quantization table#)

(6) 一个或者多个霍夫曼表DHT(Difine Huffman Table)

?霍夫D的长?Huffman table length)

?cd、AC或者DC(Type, AC or DC)

?索引(Index)

?位表(bits table)

?D(value table)

(7) 扫描开始SOS(Start of Scan)

?扫描开始长?start of scan length)

?颜色分量?number of color components)

?每个颜色分量

    • ID
    • 交流pL表号(AC table #)
    • 直流pL表号(DC table #)

?压羃囑փ数据(compressed image data)

(8) 囑փl束EOI(End of Image)

?-06表示了APP0域的详细l构。有兴趣的读者可通过UltraEdit或者PC TOOLS{工兯Y件打开一个JPG囑փ文gQ对APP0的结构进行分析和验证?/P>

?-06 JFIF格式中APP0域的详细l构

偏移

长度

内容

块的名称

说明

0

2 byte

0xFFD8

(Start of Image,SOI)

囑փ开?/FONT>

2

2 byte

0xFFE0

APP0(JFIF application segment)

JFIF应用数据?/FONT>

4

2 bytes

 

length of APP0 block

APP0块的长度

6

5 bytes

 

"JFIF"+"0"

识别APP0标记

11

1 byte

 

<Major version>

主要版本?如版?.02中的1)

12

1 byte

 

<Minor version>

ơ要版本?如版?.02中的02)

13

1 byte

 

<Units for the X
and Y densities>

X和Y的密度单?/P>

units=0Q无单位

units=1Q点?英寸

units=2Q点?厘米

14

2 bytes

 

<Xdensity>

水^方向像素密度

16

2 bytes

 

<Ydensity>

垂直方向像素密度

18

1 byte

 

<Xthumbnail>

~略图水q_素数?/FONT>

19

1 byte

 

<Ythumbnail>

~略囑֞直像素数?/FONT>

 

3n

 

< Thumbnail RGB bitmap>

~略RGB位图(n为羃略图的像素数)

     

Optional JFIF extension APP0 marker segment(s)

任选的JFIF扩展APP0标记D?/FONT>

 

…?/FONT>

 

…?/FONT>

 
 

2 byte

0xFFD9

(EOI) end-of-file

囑փ文gl束标记

 



2005-06-22 16:53 发表评论
]]>
GIF文g格式http://www.tkk7.com/georgehill/articles/6550.htmlWed, 22 Jun 2005 08:52:00 GMThttp://www.tkk7.com/georgehill/articles/6550.htmlhttp://www.tkk7.com/georgehill/comments/6550.htmlhttp://www.tkk7.com/georgehill/articles/6550.html#Feedback0http://www.tkk7.com/georgehill/comments/commentRss/6550.htmlhttp://www.tkk7.com/georgehill/services/trackbacks/6550.html阅读全文

2005-06-22 16:52 发表评论
]]>
BMP文g格式http://www.tkk7.com/georgehill/articles/6549.htmlWed, 22 Jun 2005 08:50:00 GMThttp://www.tkk7.com/georgehill/articles/6549.htmlhttp://www.tkk7.com/georgehill/comments/6549.htmlhttp://www.tkk7.com/georgehill/articles/6549.html#Feedback2http://www.tkk7.com/georgehill/comments/commentRss/6549.htmlhttp://www.tkk7.com/georgehill/services/trackbacks/6549.html6.1 BMP文g格式

6.1.1 ?/P>

位图文g(Bitmap-FileQBMP)格式是Windows采用的图像文件存储格式,在Windows环境下运行的所有图像处理Y仉支持q种格式。Windows 3.0以前的BMP位图文g格式与显C备有养I因此把它UCؓ讑֤相关位图(device-dependent bitmapQDDB)文g格式。Windows 3.0以后的BMP位图文g格式与显C备无养I因此把这UBMP位图文g格式UCؓ讑֤无关位图(device-independent bitmapQDIB)格式Q目的是Z让Windows能够在Q何类型的昄讑֤上显CBMP位图文g。BMP位图文g默认的文件扩展名是BMP或者bmp?/P>

6.1.2 文gl构

位图文g可看成由4个部分组成:位图文g?bitmap-file header)、位图信息头(bitmap-information header)、彩色表(color table)和定义位囄字节阵列Q它们的名称和符号如?-01所C?/P>

?-01 BMP囑փ文gl成部分的名U和W号

位图文g的组?/FONT>

l构名称

W号

位图文g?bitmap-file header)

BITMAPFILEHEADER

bmfh

位图信息?bitmap-information header)

BITMAPINFOHEADER

bmih

彩色?color table)

RGBQUAD

aColors[]

囑փ数据阵列字节

BYTE

aBitmapBits[]

位图文gl构可综合在?-02中?/P>

?-02 位图文gl构内容摘要

 

偏移?/FONT>

域的名称

大小

内容

 

 

 

囑փ文g

?/FONT>

0000h

标识W?Identifier)

2 bytes

两字节的内容用来识别位图的类型:

?FONT lang=ZH-CN face=宋体>BM?FONT lang=ZH-CN face=宋体> Q?Windows 3.1x, 95, NT, ?/P>

?FONT lang=ZH-CN face=宋体>BA?FONT lang=ZH-CN face=宋体> QOS/2 Bitmap Array

?FONT lang=ZH-CN face=宋体>CI?FONT lang=ZH-CN face=宋体> QOS/2 Color Icon

?FONT lang=ZH-CN face=宋体>CP?FONT lang=ZH-CN face=宋体> QOS/2 Color Pointer

?FONT lang=ZH-CN face=宋体>IC?FONT lang=ZH-CN face=宋体> Q?OS/2 Icon

?FONT lang=ZH-CN face=宋体>PT?FONT lang=ZH-CN face=宋体> QOS/2 Pointer

 

0002h

File Size

1 dword

用字节表C的整个文g的大?/FONT>

 

0006h

Reserved

1 dword

保留Q设|ؓ0

 

000Ah

Bitmap Data Offset

1 dword

从文件开始到位图数据开始之间的数据(bitmap data)之间的偏U量

 

000Eh

Bitmap Header Size

1 dword

位图信息?Bitmap Info Header)的长度,用来描述位图的颜艌Ӏ压~方法等。下面的长度表示Q?/P>

28h - Windows 3.1x, 95, NT, ?/FONT>

0Ch - OS/2 1.x

F0h - OS/2 2.x

 

0012h

Width

1 dword

位图的宽度,以像素ؓ单位

 

0016h

Height

1 dword

位图的高度,以像素ؓ单位

 

001Ah

Planes

1 word

位图的位面数


囑փ

信息

?/P>

 

 

001Ch

Bits Per Pixel

1 word

每个像素的位?/P>

1 - Monochrome bitmap

4 - 16 color bitmap

8 - 256 color bitmap

16 - 16bit (high color) bitmap

24 - 24bit (true color) bitmap

32 - 32bit (true color) bitmap

 

001Eh

Compression

1 dword

压羃说明Q?/P>

0 - none (也用BI_RGB表示)

1 - RLE 8-bit / pixel (也用BI_RLE4表示)

2 - RLE 4-bit / pixel (也用BI_RLE8表示)

3 - Bitfields (也用BI_BITFIELDS表示)

 

0022h

Bitmap Data Size

1 dword

用字节数表示的位图数据的大小。该数必L4的倍数

 

0026h

HResolution

1 dword

用像?cC的水^分L?/FONT>

 

002Ah

VResolution

1 dword

用像?cC的垂直分L?/FONT>

 

002Eh

Colors

1 dword

位图使用的颜色数。如8-?像素表示?00h或?256.

 

0032h

Important Colors

1 dword

指定重要的颜色数。当该域的值等于颜色数Ӟ表示所有颜色都一样重?/FONT>

调色板数?/FONT>

0036h

Palette

N * 4 byte

调色板规范。对于调色板中的每个表项Q这4个字节用下述Ҏ来描qRGB的|

  • 1字节用于蓝色分量
  • 1字节用于l色分量
  • 1字节用于U色分量
  • 1字节用于填充W?讄?)

囑փ数据

0436h

Bitmap Data

x bytes

该域的大取决于压羃ҎQ它包含所有的位图数据字节Q这些数据实际就是彩色调色板的烦引号

 

6.1.3 构g详解

1. 位图文g?/P>

位图文g头包含有关于文gcd、文件大、存放位|等信息Q在Windows 3.0以上版本的位图文件中用BITMAPFILEHEADERl构来定义:

typedef struct tagBITMAPFILEHEADER { /* bmfh */

UINT bfType;

DWORD bfSize;

UINT bfReserved1;

UINT bfReserved2;

DWORD bfOffBits;

} BITMAPFILEHEADER;

其中Q?/P>

bfType

说明文g的类?

bfSize

说明文g的大,用字节ؓ单位

bfReserved1

保留Q设|ؓ0

bfReserved2

保留Q设|ؓ0

bfOffBits

说明从BITMAPFILEHEADERl构开始到实际的图像数据之间的?节偏U量

 

2. 位图信息?/P>

位图信息用BITMAPINFOl构来定义,它由位图信息?bitmap-information header)和彩色表(color table)l成Q前者用BITMAPINFOHEADERl构定义Q后者用RGBQUADl构定义。BITMAPINFOl构h如下形式Q?/P>

typedef struct tagBITMAPINFO { /* bmi */

BITMAPINFOHEADER bmiHeader;

RGBQUAD bmiColors[1];

} BITMAPINFO;

其中Q?/P>

bmiHeader

说明BITMAPINFOHEADERl构

bmiColors

说明彩色表RGBQUADl构的阵?/P>

BITMAPINFOHEADERl构包含有位图文件的大小、压~类型和颜色格式Q其l构定义为:

typedef struct tagBITMAPINFOHEADER { /* bmih */

DWORD biSize;

LONG biWidth;

LONG biHeight;

WORD biPlanes;

WORD biBitCount;

DWORD biCompression;

DWORD biSizeImage;

LONG biXPelsPerMeter;

LONG biYPelsPerMeter;

DWORD biClrUsed;

DWORD biClrImportant;

} BITMAPINFOHEADER;

其中Q?/P>

biSize

说明BITMAPINFOHEADERl构所需要的字节?/P>

biWidth

说明囑փ的宽度,以像素ؓ单位

biHeight

说明囑փ的高度,以像素ؓ单位

biPlanes

为目标设备说明位面数Q其D|ؓ1

biBitCount

说明位数/像素Q其gؓ1??或?4

biCompression

  • 说明囑փ数据压羃的类型。其值可以是下述g一Q?BR>BI_RGBQ没有压~;
  • BI_RLE8Q每个像?位的RLE压羃~码Q压~格式由2字节l成(重复像素计数和颜色烦?Q?
  • BI_RLE4Q每个像?位的RLE压羃~码Q压~格式由2字节l成

biSizeImage

说明囑փ的大,以字节ؓ单位。当用BI_RGB格式Ӟ可设|ؓ0

biXPelsPerMeter

说明水^分L率,用像?cC?/FONT>

biYPelsPerMeter

说明垂直分L率,用像?cC?/FONT>

biClrUsed

说明位图实际使用的彩色表中的颜色索引?/FONT>

biClrImportant

说明对图像显C有重要影响的颜色烦引的数目Q如果是0Q表C都重要?/P>

现就BITMAPINFOHEADERl构作如下说明:

(1) 彩色表的定位

应用E序可用存储在biSize成员中的信息来查扑֜BITMAPINFOl构中的彩色表,如下所C:

pColor = ((LPSTR) pBitmapInfo + (WORD) (pBitmapInfo->bmiHeader.biSize))

(2) biBitCount

biBitCount=1 表示位图最多有两种颜色Q黑色和白色。图像数据阵列中的每一位表CZ个像素?/P>

biBitCount=4 表示位图最多有16U颜艌Ӏ每个像素用4位表C,q用q?位作为彩色表的表Ҏ查找该像素的颜色。例如,如果位图中的W一个字节ؓ0x1FQ它表示有两个像素,W一像素的颜色就在彩色表的第2表项中查找,而第二个像素的颜色就在彩色表的第16表项中查找?/P>

biBitCount=8 表示位图最多有256U颜艌Ӏ每个像素用8位表C,q用q?位作为彩色表的表Ҏ查找该像素的颜色。例如,如果位图中的W一个字节ؓ0x1FQ这个像素的颜色在彩色表的W?2表项中查找?/P>

biBitCount=24 表示位图最多有224Q?6 777 216U颜艌ӀbmiColors (或者bmciColors)成员׃ؓNULL。每3个字节代表一个像素,光色有R、G、B字节的相对强度决定?/P>

(3) ClrUsed

BITMAPINFOHEADERl构中的成员ClrUsed指定实际使用的颜色数目。如果ClrUsed讄?Q位图用的颜色数目q于biBitCount成员中的数目?/P>

(4) 囑փ数据压羃

?BI_RLE8Q?/B>每个像素?位的RLE压羃~码Q可使用~码方式和绝Ҏ式中的Q何一U进行压~,q两U方式可在同一q图中的M地方使用?/P>

~码方式Q由2个字节组成,W一个字节指定用相同颜色的像素数目Q第二个字节指定使用的颜色烦引。此外,q个字节对中的第一个字节可讄?Q联合用第二个字节的DC:

  • W二个字节的gؓ0Q行的结束?
  • W二个字节的gؓ1Q图像结束?
  • W二个字节的gؓ2Q其后的两个字节表示下一个像素从当前开始的水^和垂直位|的偏移量?/LI>

l对方式Q第一个字节设|ؓ0Q而第二个字节讄?x03?xFF之间的一个倹{在q种方式中,W二个字节表C在这个字节后面的字节敎ͼ每个字节包含单个像素的颜色烦引。压~数据格式需要字边界(word boundary)寚w?/P>

[?.1] 用十六进制表C的8位压~图像数据如下:

03 04 05 06 00 03 45 56 67 00 02 78 00 02 05 01 02 78 00 00 09 1E 00 01
q些压羃数据可解释ؓ Q?/P>

压羃数据

扩展数据

03 04

04 04 04

05 06

06 06 06 06 06

00 03 45 56 67 00

45 56 67

02 78

78 78

00 02 05 01

从当前位|右U?个位|后向下UM?/FONT>

02 78

78 78

00 00

行结?/FONT>

09 1E

1E 1E 1E 1E 1E 1E 1E 1E 1E

00 01

RLE~码囑փl束

?BI_RLE4Q?/B>每个像素?位的RLE压羃~码Q同样也可用编码方式和l对方式中的M一U进行压~,q两U方式也可在同一q图中的M地方使用。这两种方式是:

~码方式Q由2个字节组成,W一个字节指定像素数目,W二个字节包含两U颜色烦引,一个在?位,另一个在?位。第一个像素用高4位的颜色索引Q第二个使用?位的颜色索引Q第3个用高4位的颜色索引Q依此类推?/P>

l对方式Q这个字节对中的W一个字节设|ؓ0Q第二个字节包含有颜色烦引数Q其后箋字节包含有颜色烦引,颜色索引存放在该字节的高、低4位中Q一个颜色烦引对应一个像素。此外,BI_RLE4也同栯合用第二个字节中的DC:

  • W二个字节的gؓ0Q行的结束?
  • W二个字节的gؓ1Q图像结束?
  • W二个字节的gؓ2Q其后的两个字节表示下一个像素从当前开始的水^和垂直位|的偏移量?/LI>

[?.2] 用十六进制数表示?位压~图像数据:

03 04 05 06 00 06 45 56 67 00 04 78 00 02 05 01 04 78 00 00 09 1E 00 01

q些压羃数据可解释ؓ Q?/P>

压羃数据

扩展数据

03 04

0 4 0

05 06

0 6 0 6 0

00 06 45 56 67 00

4 5 5 6 6 7

04 78

7 8 7 8

00 02 05 01

从当前位|右U?个位|后向下UM?/FONT>

04 78

7 8 7 8

00 00

行结?/FONT>

09 1E

1 E 1 E 1 E 1 E 1

00 01

RLE囑փl束

 

3. 彩色?/P>

彩色表包含的元素与位图所h的颜色数相同Q像素的颜色用RGBQUADl构来定义。对?4-位真彩色囑փ׃使用彩色表,因ؓ位图中的RGB值就代表了每个像素的颜色。彩色表中的颜色按颜色的重要性排序,q可以辅助显C驱动程序ؓ不能昄_多颜色数的显C备显C彩色图像。RGBQUADl构描述由R、G、B相对强度l成的颜Ԍ定义如下Q?/P>

typedef struct tagRGBQUAD { /* rgbq */

BYTE rgbBlue;

BYTE rgbGreen;

BYTE rgbRed;

BYTE rgbReserved;

} RGBQUAD;

其中Q?/P>

rgbBlue

指定蓝色强度

rgbGreen

指定l色强度

rgbRed

指定U色强度

rgbReserved

保留Q设|ؓ0

 

4. 位图数据

紧跟在彩色表之后的是囑փ数据字节阵列。图像的每一扫描行由表示囑փ像素的连l的字节l成Q每一行的字节数取决于囑փ的颜色数目和用像素表C的囑փ宽度。扫描行是由底向上存储的Q这是_阵列中的W一个字节表CZ囑ַ下角的像素,而最后一个字节表CZ囑֏上角的像素?/P>

2005-06-22 16:50 发表评论
]]>
JPEG压羃~码http://www.tkk7.com/georgehill/articles/6548.htmlWed, 22 Jun 2005 08:49:00 GMThttp://www.tkk7.com/georgehill/articles/6548.htmlhttp://www.tkk7.com/georgehill/comments/6548.htmlhttp://www.tkk7.com/georgehill/articles/6548.html#Feedback0http://www.tkk7.com/georgehill/comments/commentRss/6548.htmlhttp://www.tkk7.com/georgehill/services/trackbacks/6548.html5.7 JPEG压羃~码

5.7.1 JPEG法概要

JPEG(Joint Photographic Experts Group) 是一个由 ISO和IEC两个l织机构联合l成的一个专家组Q负责制定静态的数字囑փ数据压羃~码标准Q这个专家组开发的法UCؓJPEG法Qƈ且成为国际上通用的标准,因此又称为JPEG标准。JPEG是一个适用范围很广的静态图像数据压~标准,既可用于灰度囑փ又可用于彩色囑փ?/P>

JPEG专家l开发了两种基本的压~算法,一U是采用以离散余弦变?Discrete Cosine TransformQDCT)为基的有损压~算法,另一U是采用以预技术ؓ基础的无损压~算法。用有损压~算法时Q在压羃比ؓ25:1的情况下Q压~后q原得到的图像与原始囑փ相比较,非图像专安于找出它们之间的区别Q因此得Cq泛的应用。例如,在V-CD和DVD-Video电视囑փ压羃技术中Q就使用JPEG的有损压~算法来取消I间方向上的冗余数据。ؓ了在保证囑փ质量的前提下q一步提高压~比Q近q来JPEG专家l正在制定JPEG 2000(UJP 2000)标准Q这个标准中采用小波变?wavelet)法?/P>

JPEG压羃是有损压~,它利用了人的视角pȝ的特性,使用量化和无损压~编码相l合来去掉视角的冗余信息和数据本w的冗余信息。JPEG法框图如图5-13所C,压羃~码大致分成三个步骤Q?/P>

  1. 使用正向L余u变换(forward discrete cosine transformQFDCT)把空间域表示的图变换成频率域表示的图?
  2. 使用加权函数对DCTpLq行量化Q这个加权函数对于h的视觉系l是最佳的?
  3. 使用霍夫曼可变字长编码器寚w化系数进行编码?/LI>

译码或者叫做解压羃的过E与压羃~码q程正好相反?/P>

JPEG法与彩色空间无养I因此“RGB到YUV变换”和“YUV到RGB变换”不包含在JPEG法中。JPEG法处理的彩色图像是单独的彩色分量图像,因此它可以压~来自不同彩色空间的数据Q如RGB, YCbCr和CMYK?/P>

?-13 JPEG压羃~码-解压~算法框?/P>

 

5.7.2 JPEG法的主要计步?/P>

JPEG压羃~码法的主要计步骤如下:

  1. 正向L余u变换(FDCT)?
  2. 量化(quantization)?
  3. Z字Ş~码(zigzag scan)?
  4. 使用差分脉冲~码调制(differential pulse code modulationQDPCM)对直系?DC)q行~码?
  5. 使用行程长度~码(run-length encodingQRLE)对交系?AC)q行~码?
  6. 늼?entropy coding)?/LI>

1. 正向L余u变换

下面Ҏ向离散余弦变?FDCT)变换作几点说明?/P>

(1) Ҏ个单独的彩色囑փ分量Q把整个分量囑փ分成8×8的图像块Q如?-14所C,q作Zl离散余弦变换DCT的输入。通过DCT变换Q把能量集中在少数几个系C?/P>

?-14 L余u变换

(2) DCT变换使用下式计算Q?/P>

 ...... (5-1)
它的逆变换用下式计,

 ...... (5-2)
上面两式中,
C(u), C(v) = 1/, ?I>u, v = 0Q?BR>C(u), C(v) = 1, 其他?BR>f(i, j)lDCT变换之后Q?I>F(0Q?)是直系敎ͼ其他Z系数?/P>

(3) 在计两l的DCT变换Ӟ可用下面的计算式把两维的DCT变换变成一l的DCT变换Q?/P>

  ............ (5-3)

 ............. (5-4)

?-15 两维DCT变换Ҏ

实际的计方法可参看[6]

2. 量化

量化是对l过FDCT变换后的频率pLq行量化。量化的目的是减非?”系数的q度以及增加?”值系数的数目。量化是囑փ质量下降的最主要原因?/P>

对于有损压羃法QJPEG法使用如图5-16所C的均匀量化器进行量化,量化步距是按照系数所在的位置和每U颜色分量的色调值来定。因Zh眼对亮度信号比对色差信号更敏感,因此使用了两U量化表Q如?-05所C的亮度量化值和?-06所C的色差量化倹{此外,׃人眼对低频分量的囑փ比对高频分量的图像更敏感Q因此图中的左上角的量化步距要比右下角的量化步距。表5-05和表5-06中的数值对CCIR 601标准电视囑փ已经是最佳的。如果不使用q两U表Q你也可以把自己的量化表替换它们?/P>

?-16 均匀量化?/P>

?-05 亮度量化D ?-06 色度量化?/P>

 

3. Z字Ş~排

量化后的pL要重新编排,目的是ؓ了增加连l的?”系数的个数Q就是?”的游程长度Q方法是按照Z字Ş的式L排,如图5-17所C。这样就把一? ´ 8的矩阵变成一? ´ 64的矢量,频率较低的系数放在矢量的剙?/P>


?-17 量化DCTpL的编?/P>

0

1

5

6

14

15

27

28

2

4

7

13

16

26

29

42

3

8

12

17

25

30

41

43

9

11

18

24

31

40

44

53

10

19

23

32

39

45

52

54

20

22

33

38

46

51

55

60

21

34

37

47

50

56

59

61

35

36

48

49

57

58

62

63

?-18 量化DCTpL的序?/P>

 

4. 直流pL的编?/P>

8 ´ 8囑փ块经qDCT变换之后得到的DC直流pL有两个特点,一是系数的数值比较大Q二是相? ´ 8囑փ块的DCpL值变化不大。根据这个特点,JPEG法使用了差分脉冲调制编?DPCM)技术,对相d像块之间量化DCpL的差?Delta)q行~码Q?/P>

DeltaQ?I>DC(0, 0)k-DC(0, 0)k-1 ........ (5-5)

5. 交流pL的编?/P>

量化ACpL的特Ҏ1 ´ 64矢量中包含有许多?”系敎ͼq且许多?”是q箋的,因此使用非常单和直观的游E长度编?RLE)对它们进行编码?/P>

JPEG使用?个字节的?位来表示q箋?”的个数Q而用它的低4位来表示~码下一个非?”系数所需要的位数Q跟在它后面的是量化ACpL的数倹{?/P>

6. 늼?/P>

使用늼码还可以对DPCM~码后的直流DCpL和RLE~码后的交流ACpL作进一步的压羃?/P>

在JPEG有损压羃法中,使用霍夫曼编码器来减熵。用霍夫曼~码器的理由是可以用很单的查表(lookup table)Ҏq行~码。压~数据符hQ霍夫曼~码器对出现频度比较高的W号分配比较短的代码Q而对出现频度较低的符号分配比较长的代码。这U可变长度的霍夫曼码表可以事先进行定义?/P>

[?.1] ?-07所C的是DC码表W号举例。如果DC的?Value)?Q符号SSS用于表达实际值所需要的位数Q实际位数就{于3?/P>

?-07 DC码表W号举例

Value

SSS

0

0

-1, 1

1

-3,-2, 2,3

2

-7..-4, 4..7

3

 

7. l成位数据流

JPEG~码的最后一个步骤是把各U标C码和~码后的囑փ数据l成一帧一帧的数据Q这样做的目的是Z便于传输、存储和译码器进行译码,q样的组l的数据通常UCؓJPEG位数据流(JPEG bitstream)?/P>

5.7.3 应用JPEG法举例

有关JPEG法更详l的信息和数据,请参看JPEG标准ISO/IEC 10918。下面是使用JPEG法对一?×8囑փ块计得到的l果。在q个例子中,计算正向L余u变换(FDCT)之前Ҏ囑փ中的每个h数据减去?28Q在逆向L余u变换之后寚w构图像中的每个样本数据加?28?/P>


?-19 JPEG压羃~码举例



2005-06-22 16:49 发表评论
]]>JavaScript技?/title><link>http://www.tkk7.com/georgehill/articles/5272.html</link><dc:creator>米</dc:creator><author>米</author><pubDate>Fri, 27 May 2005 08:46:00 GMT</pubDate><guid>http://www.tkk7.com/georgehill/articles/5272.html</guid><wfw:comment>http://www.tkk7.com/georgehill/comments/5272.html</wfw:comment><comments>http://www.tkk7.com/georgehill/articles/5272.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.tkk7.com/georgehill/comments/commentRss/5272.html</wfw:commentRss><trackback:ping>http://www.tkk7.com/georgehill/services/trackbacks/5272.html</trackback:ping><description><![CDATA[<TABLE class=font cellSpacing=1 cellPadding=0 width=566 bgColor=#ffffff border=0> <TBODY> <TR bgColor=#fae211> <TD colSpan=2 height=22><FONT color=#ffff00><FONT color=#ff0000><B>◆加入收藏夹<A name=jrscj></A></B></FONT></FONT></TD></TR> <TR> <TD align=middle width=66 bgColor=#fae211 height=22>??/TD> <TD bgColor=#fae211 height=22>点击卛_把你的网站添加到览器的收藏菜单?/TD></TR> <TR> <TD align=middle width=66 bgColor=#fae211 height=22>??/TD> <TD bgColor=#fae211 height=22><span style="CURSOR: hand" onClick="window.external.addFavorite('http://www.helpor.net','|页Ҏ集锦')" title="|页Ҏ集锦">收藏本站</span> </TD></TR></TBODY></TABLE><BR> <TABLE class=font cellSpacing=1 cellPadding=0 width=566 bgColor=#ffffff border=0> <TBODY> <TR bgColor=#fae211> <TD colSpan=2 height=22><FONT color=#ffff00> <FONT color=#ff0000><B>◆设为首?A name=swsy></A></B></FONT></FONT></TD></TR> <TR> <TD align=middle width=66 bgColor=#fae211 height=22>??/TD> <TD bgColor=#fae211 height=22>点击卛_把你的网站设|ؓ览器的起始?/TD></TR> <TR> <TD align=middle width=66 bgColor=#fae211 height=22>??/TD> <TD bgColor=#fae211 height=22><span onclick="var strHref=window.location.href;this.style.behavior='url(#default#homepage)';<BR>this.setHomePage('http://www.helpor.net');" style="CURSOR: hand">设ؓ首页</span> </TD></TR></TBODY></TABLE><BR> <TABLE class=font cellSpacing=1 cellPadding=0 width=566 bgColor=#ffffff border=0> <TBODY> <TR bgColor=#fae211> <TD colSpan=2 height=22><FONT color=#ffff00> <FONT color=#ff0000><B>◆去掉超链接的下划线<A name=qdlj></A></B></FONT></FONT></TD></TR> <TR> <TD align=middle width=66 bgColor=#fae211 height=22>??/TD> <TD bgColor=#fae211 height=22>有时候看着那超链接的下划线厌的Q把下面q段代码攑ֈ|页源代?lt;head>?lt;/head>之间Q下划线无影无t啦Q?<BR>注意Q网늚<body>标签里不能再有link之类的属性,否则本效果会失效Q?/TD></TR> <TR> <TD align=middle width=66 bgColor=#fae211 height=22>??/TD> <TD bgColor=#fae211 height=22><style TYPE="text/css"><BR><!--<BR>A:link{text-decoration:none}<BR>A:visited{text-decoration:none}<BR>A:hover {color: #ff00ff;text-decoration:underline}<BR>--><BR></style> </TD></TR></TBODY></TABLE><BR> <TABLE class=font cellSpacing=1 cellPadding=0 width=566 bgColor=#ffffff border=0> <TBODY> <TR bgColor=#fae211> <TD colSpan=2 height=22><FONT color=#ffff00> <FONT color=#ff0000><B>◆自动刷新网?A name=zdsx></A></B></FONT></FONT></TD></TR> <TR> <TD align=middle width=66 bgColor=#fae211 height=22>??/TD> <TD bgColor=#fae211 height=22>自动h|页 <BR>在HTML的与之间加入下面q段代码Q则?分钟之后正在览的页面将会自动变为target.htmlq一c代码中300为刷新的延迟旉Q以Uؓ单位。targer.htmlZ惌{向的目标?若ؓ本页则ؓ自动h本页?</TD></TR> <TR> <TD align=middle width=66 bgColor=#fae211 height=22>??/TD> <TD bgColor=#fae211 height=22><meta http-equiv="refresh" content="300; url=target.html"> </TD></TR></TBODY></TABLE><BR> <TABLE class=font cellSpacing=1 cellPadding=0 width=566 bgColor=#ffffff border=0> <TBODY> <TR bgColor=#fae211> <TD colSpan=2 height=22><FONT color=#ffff00> <FONT color=#ff0000><B>◆刷新本?A name=sxby></A></B></FONT></FONT></TD></TR> <TR> <TD align=middle width=66 bgColor=#fae211 height=22>??/TD> <TD bgColor=#fae211 height=22>点击卛_h本页?</TD></TR> <TR> <TD align=middle width=66 bgColor=#fae211 height=22>??/TD> <TD bgColor=#fae211 height=22><a href="javascript:location.reload()" target="_self">h</a></TD></TR></TBODY></TABLE><BR> <TABLE class=font cellSpacing=1 cellPadding=0 width=566 bgColor=#ffffff border=0> <TBODY> <TR bgColor=#fae211> <TD colSpan=2 height=22><FONT color=#ffff00> <FONT color=#ff0000><B>◆返回到上一?A name=fh></A></B></FONT></FONT></TD></TR> <TR> <TD align=middle width=66 bgColor=#fae211 height=22>??/TD> <TD bgColor=#fae211 height=22>点击卛_q回C一面?/TD></TR> <TR> <TD align=middle width=66 bgColor=#fae211 height=22>??/TD> <TD bgColor=#fae211 height=22><a href="javascript:history.back(-1)">q回上一?lt;/a></TD></TR></TBODY></TABLE><BR> <TABLE class=font cellSpacing=1 cellPadding=0 width=566 bgColor=#ffffff border=0> <TBODY> <TR bgColor=#fae211> <TD colSpan=2 height=22><FONT color=#ffff00> <FONT color=#ff0000><B>◆蟩出小H口<A name=tcck></A></B></FONT></FONT></TD></TR> <TR> <TD align=middle width=66 bgColor=#fae211 height=22>??/TD> <TD bgColor=#fae211 height=22>在打开有下面这D代码的面时将会蟩Z?68x60大小的小H口。“window.html”ؓ跛_的小H口里所要显C的|页。toolbar、status、menubar、scrollbars、设|小H口的工h、状态栏、菜单栏及滚动条的有无,resizable讄是否可让览者改变小H口大小Qwidth、height讄窗口的宽度以及高度?不过q样的小H口一般是不受Ƣ迎的哦Q? </TD></TR> <TR> <TD align=middle width=66 bgColor=#fae211 height=22>??/TD> <TD bgColor=#fae211 height=22><script language="JavaScript"><BR>window.open("window.html","www_helpor_net","toolbar=no, status=no,menubar=no, scrollbars=no,resizable=no,width=468,height=60,left=200,top=50");<BR></script></TD></TR></TBODY></TABLE><BR> <TABLE class=font cellSpacing=1 cellPadding=0 width=566 bgColor=#ffffff border=0> <TBODY> <TR bgColor=#fae211> <TD colSpan=2 height=22><FONT color=#ffff00> <FONT color=#ff0000><B>◆自动关闭窗?A name=zdgb></A></B></FONT></FONT></TD></TR> <TR> <TD align=middle width=66 bgColor=#fae211 height=22>??/TD> <TD bgColor=#fae211 height=22>在网|代码中加入下面的代码Q则该窗口将?0U钟之后自动关闭Q这与蟩出式窗口配合用是再好不过啦!代码中“i=20”表C关闭的延迟旉?0U,可Q意修攏V?</TD></TR> <TR> <TD align=middle width=66 bgColor=#fae211 height=22>??/TD> <TD bgColor=#fae211 height=22><script language="javascript"><BR><!--<BR>function clock(){i=i-1<BR>document.title="本窗口将?+i+"U后自动关闭!";<BR>if(i>0)setTimeout("clock();",1000);<BR>else self.close();}<BR>var i=20<BR>clock();<BR>//--><BR></script></TD></TR></TBODY></TABLE><BR> <TABLE class=font cellSpacing=1 cellPadding=0 width=566 bgColor=#ffffff border=0> <TBODY> <TR bgColor=#fae211> <TD colSpan=2 height=22><FONT color=#ffff00> <FONT color=#ff0000><B>◆给面加保?A name=bh></A></B></FONT></FONT></TD></TR> <TR> <TD align=middle width=66 bgColor=#fae211 height=22>??/TD> <TD bgColor=#fae211 height=22>如果你不惌辛辛苦苦做出来的东西被hL地Copy&Paste走的话,不妨在HTML里加入下面这D代码。当在网里按下鼠标右键Ӟ出现的不是想要的快捷菜单而是一个警告窗口。“\n\n”表C换行?</TD></TR> <TR> <TD align=middle width=66 bgColor=#fae211 height=22>??/TD> <TD bgColor=#fae211 height=22><script language="JavaScript"><BR>function helpor()<BR>{<BR>if (event.button==2)alert(' 仅供览!谢谢!\n\n若有问题请与我联p? ')<BR>}<BR></script><BR><BR>然后?lt;body> 改ؓ <body onmousedown="helpor_net()"></TD></TR></TBODY></TABLE><BR> <TABLE class=font cellSpacing=1 cellPadding=0 width=566 bgColor=#ffffff border=0> <TBODY> <TR bgColor=#fae211> <TD colSpan=2 height=22><FONT color=#ffff00> <FONT color=#ff0000><B>◆固定字号大?A name=gdzh></A></B></FONT></FONT></TD></TR> <TR> <TD align=middle width=66 bgColor=#fae211 height=22>??/TD> <TD bgColor=#fae211 height=22>你是否有q这Ll历Q一个布|得很好的网,当浏览时把浏览器的字可|成大或时Q漂亮的|页马上面目全非了。因为字的大变了,版式自然׃。现在好了,只要把下面这D代码加入到|页源文件的<head>?lt;/head>之间p?对用<font>标签定义的文字无??</TD></TR> <TR> <TD align=middle width=66 bgColor=#fae211 height=22>??/TD> <TD bgColor=#fae211 height=22><style type="text/css"><BR><!--<BR>body {font-size:9pt}<BR>td {font-size:9pt}<BR>--><BR></style> </TD></TR></TBODY></TABLE><BR> <TABLE class=font cellSpacing=1 cellPadding=0 width=566 bgColor=#ffffff border=0> <TBODY> <TR bgColor=#fae211> <TD colSpan=2 height=22><FONT color=#ffff00> <FONT color=#ff0000><B>◆状态栏里的动态欢q语<A name=ztl></A></B></FONT></FONT></TD></TR> <TR> <TD align=middle width=66 bgColor=#fae211 height=22>??/TD> <TD bgColor=#fae211 height=22>览器的状态栏里出C个字接一个字往左跑的欢q语Q?/TD></TR> <TR> <TD align=middle width=66 bgColor=#fae211 height=22>??/TD> <TD bgColor=#fae211 height=22><script language="JavaScript"><BR><!--<BR>function statusMessageObject(p,d) {<BR>this.msg = MESSAGE<BR>this.out = " "<BR>this.pos = POSITION<BR>this.delay = DELAY<BR>this.i = 0<BR>this.reset = clearMessage<BR>}<BR>function clearMessage() {<BR>this.pos = POSITION<BR>}<BR>var POSITION = 100<BR>var DELAY = 5<BR>var MESSAGE = "Ƣ迎光! Welcome to WWW.HELPOR.NET "<BR>var scroll = new statusMessageObject()<BR>function scroller() {<BR>for (scroll.i = 0; scroll.i < scroll.pos; scroll.i++) {<BR>scroll.out += " "<BR>}<BR>if (scroll.pos >= 0)<BR>scroll.out += scroll.msg<BR>else scroll.out = scroll.msg.substring(-scroll.pos,scroll.msg.length)<BR>window.status = scroll.out<BR>scroll.out = " "<BR>scroll.pos--<BR>if (scroll.pos < -(scroll.msg.length)) {<BR>scroll.reset()<BR>}<BR>setTimeout ('scroller()',scroll.delay)<BR>}<BR>function snapIn(jumpSpaces,position) {<BR>var msg = scroll.msg<BR>var out = ""<BR>for (var i=0; i<position; i++)<BR>{out += msg.charAt(i)}<BR>for (i=1;i<jumpSpaces;i++)<BR>{out += " "}<BR>out += msg.charAt(position)<BR>window.status = out<BR>if (jumpSpaces <= 1) {<BR>position++<BR>if (msg.charAt(position) == ' ')<BR>{position++ }<BR>jumpSpaces = 100-position<BR>} else if (jumpSpaces > 3)<BR>{jumpSpaces *= .75}<BR>else<BR>{jumpSpaces--}<BR>if (position != msg.length) {<BR>var cmd = "snapIn(" + jumpSpaces + "," + position + ")";<BR>scrollID = window.setTimeout(cmd,scroll.delay);<BR>} else {<BR>window.status=""<BR>jumpSpaces=0<BR>position=0<BR>cmd = "snapIn(" + jumpSpaces + "," + position + ")";<BR>scrollID = window.setTimeout(cmd,scroll.delay);<BR>return false<BR>}<BR>return true<BR>}<BR>snapIn(100,0);<BR>// --><BR></script></TD></TR></TBODY></TABLE><BR> <TABLE class=font cellSpacing=1 cellPadding=0 width=566 bgColor=#ffffff border=0> <TBODY> <TR bgColor=#fae211> <TD colSpan=2 height=22><FONT color=#ffff00> <FONT color=#ff0000><B>◆保护自q面不被别h攑֜框架?A name=bhzj></A></B></FONT></FONT></TD></TR> <TR> <TD align=middle width=66 bgColor=#fae211 height=22>??/TD> <TD bgColor=#fae211 height=22>有些人真是懒得可以,把别人做好的|页往自己|页的框?Frame)里一放,别h的成果就变成了自qQ而且看不|页的真实地址Qؓ了防止你的成果被q些人所剽窃Q你可以在你网늚HTML里加入下面这D代码,q样Q你的网便L在整个窗口中打开了?</TD></TR> <TR> <TD align=middle width=66 bgColor=#fae211 height=22>??/TD> <TD bgColor=#fae211 height=22><Script LANGUAGE="JavaScript"><BR>if(self!=top){top.location=self.location;}<BR></script> </TD></TR></TBODY></TABLE><img src ="http://www.tkk7.com/georgehill/aggbug/5272.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.tkk7.com/georgehill/" target="_blank">米</a> 2005-05-27 16:46 <a href="http://www.tkk7.com/georgehill/articles/5272.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item></channel></rss> <footer> <div class="friendship-link"> <p>лǵվܻԴȤ</p> <a href="http://www.tkk7.com/" title="亚洲av成人片在线观看">亚洲av成人片在线观看</a> <div class="friend-links"> </div> </div> </footer> վ֩ģ壺 <a href="http://516698.com" target="_blank">Ӱɫۺ</a>| <a href="http://jiggybaby.com" target="_blank">ҹƷһ</a>| <a href="http://kimnote.com" target="_blank">ձ</a>| <a href="http://wwwkk5679.com" target="_blank">޳ɫ999þվ</a>| <a href="http://tiantangapp.com" target="_blank">þѵľƷV</a>| <a href="http://wwwfafa98.com" target="_blank">޹a777</a>| <a href="http://codecampo.com" target="_blank">ҰƵ߹ۿ </a>| <a href="http://gwcyy.com" target="_blank">˳wwwӰҳ</a>| <a href="http://mqiuxia66.com" target="_blank">˳Ƶ</a>| <a href="http://www9k832.com" target="_blank">Ļ޵һ</a>| <a href="http://wwwk47.com" target="_blank">ѵȫһ¼</a>| <a href="http://txtmp3.com" target="_blank">ɫͼ.com</a>| <a href="http://kutuwo.com" target="_blank">ձѲ</a>| <a href="http://942woool.com" target="_blank">߳ٸëˮˮ</a>| <a href="http://600c28.com" target="_blank">˳վ߲</a>| <a href="http://ybcin.com" target="_blank">ҹ߹ۿ</a>| <a href="http://6ork.com" target="_blank">ҳַѹۿ</a>| <a href="http://666mou.com" target="_blank">ۺϽ</a>| <a href="http://skcncar.com" target="_blank">ƷAVƬ߹ۿ</a>| <a href="http://zblinghang.com" target="_blank">޹ƷߵӰ</a>| <a href="http://www330330.com" target="_blank">Ʒ1024Ƶ</a>| <a href="http://xzgfbxg.com" target="_blank">ۺ߹ۿ</a>| <a href="http://xawsfkaisuo.com" target="_blank">ѾƷԲĹۿ</a>| <a href="http://acccx.com" target="_blank">aձѿ</a>| <a href="http://www132126.com" target="_blank">91޹˾þþƷַ</a>| <a href="http://av56cc.com" target="_blank">ҹһƵ</a>| <a href="http://www456788.com" target="_blank">˿wwwѸ</a>| <a href="http://71caoxee.com" target="_blank">޾ƷþëƬҰ</a>| <a href="http://wwwabxx.com" target="_blank">߹ۿav</a>| <a href="http://yy1288.com" target="_blank">߹ۿ԰Ƶ</a>| <a href="http://taoduoduo666.com" target="_blank">Ʒ_˳߸</a>| <a href="http://pgyadv.com" target="_blank">ѾƷԲ</a>| <a href="http://minliusoft.com" target="_blank">Ůվ</a>| <a href="http://cshjjc.com" target="_blank">þþƷAV鶹</a>| <a href="http://gttest5.com" target="_blank">91Ƶ</a>| <a href="http://zaidongmaixi.com" target="_blank">aëƬѸƵ</a>| <a href="http://ge2hao.com" target="_blank">˾þô߽ڹ</a>| <a href="http://vinsotec.com" target="_blank">޹պۺ</a>| <a href="http://gzbaida.com" target="_blank">91㽶߹ۿѸ</a>| <a href="http://c7372.com" target="_blank">ƷС˵ר</a>| <a href="http://my55572.com" target="_blank">ŮĻ</a>| <script> (function(){ var bp = document.createElement('script'); var curProtocol = window.location.protocol.split(':')[0]; if (curProtocol === 'https') { bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'; } else { bp.src = 'http://push.zhanzhang.baidu.com/push.js'; } var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(bp, s); })(); </script> </body>