機種依存文字!
波線「〜」には、別々のキャラクターコードに割り当てられた、似たような字形の文字があるので注意。
…という話。結論から書くと、
- Macで「から」を変換して出てくる「〜」や、JISキーボードで「へ」のキーに割り当てられている「〜」のUnicodeは 301c。
- Windowsでは、それらのUnicodeは ff5e。
→ こちらのブログ記事(波線文字化け対策|ガチムキ覚書)がとても参考になります。
入力した文字のキャラクターコードを出力するJavaScriptを書いてみたので、Win / Mac両刀使いの人は、それぞれのプラットフォームで確かめてみてください。
→ 文字コードのテスト|freefielder.jp
Macから入力した「〜」と、Windowsからコピペしてきた「~」を並べてキャラクターコードを求めてみると、こんな感じになるのです。

Macの標準フォントで表示すると、字形はまったく同じなのですが、実は内部的にコードが異なっている…。困りもんですなぁ。
なぜ困ったかと言いますと、ウチのサイトで公開している縦書きWebページ作成のための「横→縦変換スクリプト」。このスクリプトは、
入力された文字列中の、縦書きWebレイアウトをする際に表示位置を調整しなくてはならない文字たちを検出して、それらにスタイルタグを付けて出力する
という動きをします。
「位置を調整しなくてはならない文字たち」の中に波線「〜」が含まれているのですが、"Windows+IEの環境で「~」にタグが付かない" という不具合報告を頂いたので調べてみたら、「〜」は2種類ある! という驚愕の事実が判明したわけです。あ、オレが知らなかっただけで、けっこう有名な話なのかも。
つまりですね、うまく動かなかった原因は、
入力文字列中の「〜」を、スクリプト内で「〜(301c)」とマッチングさせていたのだが、Windows環境から入力された「~」は「~(ff5e)」であるので、当然「〜(301c)」とはマッチしない。
ということだったので、「~(ff5e)」にもマッチするようにスクリプトを改修して一件落着。ちゃんと動くようになった筈。
タグ:
- 縦書き,
- JavaScript,
- php
このブログ記事に対するトラックバックURL: http://freefielder.jp/ffmt/mtb.cgi/1136
コメント(2)
コメントする
検索
iTunes Store検索
tyz@freefielder.jp
カテゴリ
- Amazon Webサービス (4)
- Bossa Nova in Japan (8)
- Bossaカバー (19)
- ForeGround Music (299)
- Let's Note (10)
- Macintosh (48)
- PHP (37)
- Song Title Fetcher (1)
- Webアプリ (3)
- facebook (3)
- iPhone (65)
- via mobile
- どBossa (9)
- むかし福岡 (10)
- インターネットラジオ (7)
- クラフト (4)
- スタイルシート (5)
- スポーツ (1)
- ポ・リーグ (3)
- 今日の小室哲哉 (6)
- 嘘ネタ (2)
- 旅 (55)
- 日々 (112)
- 縦書き (30)
- 自転車 (24)
- 雑記 (233)
- 青空文庫 (8)
- 風物詩を撮る (1)
タグクラウド
- ホークス
- カバー曲
- 福岡
- iPhone
- CMソング
- 80's
- Masterpieces
- php
- bossa nova
- Macintosh
- パリーグ2008
- iPod
- 90's
- 映画
- 縦書き
- JavaScript
- 自転車
- パリーグ2009
- CSS3
- 最速でパリーグの優勝の行方を計算するページ
- パリーグ2010
- 珈琲
- 野球場
- 小ネタ
- 70's
- パリーグ2011
- ドラゴンズ
- カープ
- ファイターズ
- 台湾
- スタイルシート
- ヤフードーム
- ライオンズ
- itunes store
- 台湾プロ野球
- 笑ひ
- 新垣結衣
- マリーンズ
- UK
- 戦力外通告
- イーグルス
- WBC
- 通販
- 家電
- サッカー
- むかし福岡
- タイ
- バファローズ
- 羊毛とおはな
- Let's Note
- MacPorts
- 別府
- 迷惑アクセス
- 女優シンガー
- マカオ
- Bossaバブル
- NetRadio
- sotte bosse
- Xubuntu
- 助っ人
- 名古屋
- 椎名林檎
- 交流戦2008
- おみくじ
- オープン戦2008
- パリーグ2012
- ブログ
- ベイスターズ
- 煙草
- 著作権
- 香港
- 高橋幸宏
- 魚眼レンズ
- Movable Type
- OASIS
- Punk
- TVの音
- 原田知世
- 二軍
- うれすじキャッチャー
- アジアシリーズ
- スワローズ
- 統一ライオンズ
- Jazz
- John Lennon
- PowerBook G4
- Sex Pistols
- windows
- 小室哲哉
- 最速で2010年パリーグの優勝の行方を計算するページ
- オープン戦2009
- ドアラ
- パクチー
- Bruce Springsteen
- CentOS
- Coldplay
- 矢追純一
- 笑い
- 鳥居みゆき
- h2v.js
- IE9
- Windows
- 岡村ちゃん
- 星野JAPAN
- .htaccess
- 20世紀少年
- AWS
- コブクロ
- サンボマスター
- メタルバラード
- リモートデスクトップ
- レゲエ
- 稲尾和久
- 高品質CD
- HVT-BCT300
- Kids Bossa
- MacBook Air
- phpFreeChat
- RED HOT CHILLI PEPPERS
- THE BLUE HEARTS
- Tom Waits
- 平和台球場
- 海外旅行
- 佐野元春
- さくら
- イチロー
- イマココ。
- クレヨンしんちゃん
- ケツメイシ
- ポ・リーグ
- 王貞治
- 空気公団
- 菅野よう子
- 裸になって何が悪い
- 西鉄ライオンズ
- 鯨
- FON
- Guns N' Roses
- imageFlow
- JASRAC
- Joao Gilberto
- Michael Jackson
- Rickie-G
- TeN
- 冨田ラボ
- 午後の紅茶
- 原辰徳
- 原恵一
- 城島健司
- 小泉今日子
- 忌野清志郎
- 松山ケンイチ
- 板尾創路
- 浅野いにお
- 浅井健一
- 清原和博
- 中西健太
- 交流戦2009
- 交流戦2010
- 15秒ルール
- 2ちゃんねる
- かまやつひろし
- くるり
- さだまさし
- アスパラガス
- カオリーニョ藤原
- ジャイアンツ
- スタートレック
- スパム
- ソラニン
- タイガース
- ピアノポップ
- ファンキーモンキーベイビーズ
- ヘッドホン
- マクロレンズ
- BUMP OF CHICKEN
- 筒井康隆
- eastern youth
- enka bossa
- 都市伝説
- 野球英語
- 藤岡藤巻
- 雪
- 赤外線写真
- GPS
- Iggy Pop
- leonard cohen
- MeCab
- Monkey Majik
- My Chemical Romance
- NPB
- pupa
- Rage Against The Machine
- roots rock
- The Beatles
- UFO
- VNC
- WebDAV
- X JAPAN
- 刻印
- 加山雄三
- 坂本龍一
- 岡田准一
- 怪談
- 江頭2:50
- 世界のナベアツ
- 1941
- AKIRA
- Antony and The Johnsons
- おさかな天国
- さくらと一郎
- さよならポニーテール
- たむらぱん
- つじあやの
- つボイノリオ
- のあのわ
- ばっかじゃなかろか
- ほっともっと
- みかん
- アイドル
- アントニオ猪木
- イエティ
- ウミネコサウンズ
- オウンゴール
- カコイミク
- カルロス・リラ
- クリスマス
- サザンオールスターズ
- サーバー
- デジカメ
- ナメクジ
- ブルース・リー
- ヘチマ
- ベテランの味
- ペタンク
- ホタテ
- ポール・ポッツ
- マラドーナ
- ミッキー・ローク
- ユリオカ超特Q
- ライジング福岡
- レツゴー三匹
- ロバのパン
- bjリーグ
- Chrome
- 甘いもの
- 真島昌利
- 福岡市動植物園
- 税金
- 笹倉慎介
- David Bowie
- EXILE
- 酒
- 野茂英雄
- 頭から離れない
- 餃子
- 高田純次
- 高野寛
- 迷惑電話
- FDH
- Galaxie 500
- Green Day
- GX100
- GyaO
- HIDE
- JUJU
- Lou Reed
- mlb
- New Balance
- Nirvana
- Norah Jones
- Perfume
- plenty
- STF
- Tete
- The Rolling Stones
- UA
- UNICORN
- yumeiroecho
- 劇団ひとり
- 吉田えり
- 坂本真綾
- 夏への扉
- 大西ライオン
- 大分
- 尾道
- 川村かおり
- 布袋寅泰
- 新耳袋
- 旅
- 日野良一
- 映日紅はイチジクと読む
- 未映子
- 株
- 歯
- 清水ミチコ
- 湯川潮音
月別 アーカイブ
- 2012年
- 2011年
- 2010年
- 2009年
- 2008年
- 2007年
こちらの記事もどうぞ
- Yahoo! Japanの Web API、アプリケーションIDを外部に晒さないようにする。
- h2v.js 不具合リスト。
- h2v.jsに関するメモ。
- 縦書き変換JavaScript "h2v.js"、更新。
- 縦書き変換JavaScript "h2v.js" の次回更新。
- iOS版safariの「文字サイズ自動調整」がいやらしい。
- h2v.js - Webページの文章を縦書きで表示するJavaScript。
- ラジオで流れている曲名をチェックするWebアプリケーション。
- 縦書きWYSIWYGエディタ。
- 縦書きブログをつくる。
- 縦書きWebページ作成スクリプト。
- 「青空文庫」縦書き変換:更新情報。
- 「青空文庫」縦書き変換:更新情報。
- 「青空文庫」縦書き変換:更新情報。
- 「青空文庫」を縦書きレイアウトで。

はじめまして。
縦書きCSSを使わせていただいてます。
機種依存文字とはまったく関係のない話なのですが、1つ質問させてください。
自動改行はできないのでしょうか?
1センテンスが長いと、もの凄く縦長になってしまうのです。
適当に改行を入れれば良いのかもしれませんが、「行を揃えるための改行」には昔から抵抗がありまして……
例えば「青空文庫縦書き変換」では、どのように処理しているのでしょうか?
そのまま表示したのでは、1センテンス1行になり各行の長さがバラバラになってしまいませんか?
内部で改行を挿入し、1行辺りの文字数を揃えているのでしょうか?
それとも自動改行させているのでしょうか?
tate-areaの高さをheightで固定してみましたが、反映されませんでした。
1センテンスの長さに合わせてboxが伸びてしまいます。
CSSはあまり得意ではないのですが、CSSで対処できるようでしたらご教授くださると助かります。
縦書きCSS、使っていただいてありがとうございます。
ご質問の件、ちょっと長くなりそうなので、別記事にしてみました。
→ こちらの記事をご参照ください。