ちょっとしたウェブページを作るという案件において、デザイナーから上がってきたイラストレーター形式のデータをHTMLに落としこむという作業をしました。
イラストレーターのデータは基本的に単位が「mm」なので、ピクセル単位で管理するHTML&CSSに落としこむには単位の変換が必要です。
最初の段階でサイトの横幅は950pxにしようと決めていました。
デザイナーさんから上がってきたイラストの横幅は315mmでした。
それで、例えば横幅50mm縦幅60mmのイラストパーツをピクセルに変換しようと思ったら
315 : 950 = 50 : x の式を立てて
x = (950 * 50) / 315
x ≒ 150px
の計算で950ピクセルを総横幅としたサイトにおける50mmのピクセル換算が求められます。
答えはおよそ150ピクセルですね。
続いて縦幅を求めます。
50 : 60 = 150 : y
y = (60 * 150) / 50
y = 180px
総横幅315mm の中にある50mm × 60mm のパーツは 総横幅950pxの場において 150px × 180px に変換される事が分かりました。
実際サイトを作り始めるとこの様な計算を何度もやらないと行けないので、この仕事をこなすためのプログラムをPythonで書きました。
#! /usr/bin/python
fullWidth_mm = 315
fullWidth_px = 950
input_width_mm= raw_input('Width=: ')
answer_w = float(input_width_mm) * fullWidth_px / fullWidth_mm
print answer_w
input_height_mm = raw_input('Height=: ')
answer_h = float(input_height_mm) * answer_w / float(input_width_mm)
print answer_h
ここで重要なのはraw_input()関数ですね。
この関数を用いる事で、input_width_mm,input_height_mmに値を入力する事ができます。
引数は文字列で、入力を求める時に表示する文字を設定できます。
加えて、raw_input()によって入力された値は文字列になっていますのでfloat()によって浮動小数点数にキャストしています。
Pythonは計算において一番複雑なオペランドの型にすべてのオペランドを合わせて計算しますので、結果はfloatで返って来ます。
ちなみにPythonには4つの数値型があり、複雑さの序列は
整数型 < 長整数型 < 浮動小数点型 < 複素数型
の様になっています。
さて、こいつを実行するとこんな感じです。
[shell]
Width=: 50 #input
150.793650794
Height=: 60 #input
180.952380952
[/shell]
と言う事でこんな感じに変換して、イラストレーターのデータをHTMLに落としこむ事に成功しました。
まあ・・・もともとイラストレーターにこういう事を簡単にこなす機能がありそうですが・・・。
end
この記事へのコメントはありません。