ハマログ

株式会社イーツー・インフォの社員ブログ

家をデザインするプログラム

昔、家を建てるするときに「家をデザインするプログラム」作ってみました。

なぜ作ったかというと、壁画サンプルだけのカタログを渡されて、
全然イメージがつかなかったからです。

作成工程

1. とりあえずHTMLで四角い枠を作る(border付)
2. 四角い枠を大量につくる
3. 四角いを枠CSSで少し回転させる(transform: rotate(XXX))
4. 四角いを枠を重ね合わせ、合わさった部分の線のみ有効にし、合わさらない部分の線をなくす(border 0px)。
5. そして家っぽく形どる
6. 合わさった部分のbackgroundをカタログの画像に合わせる
7. javascriptでカタログのリストを選択すると、合わさった部分のbackgroundを変更できるようにする

簡単にこんな感じで作ってみました。

さらに、家を作るときには設計図があります。
その設計図を基に軽度(回転度数)を計算して出したので、少しちょっとリアルな家模型(2D)のようなものになりました。

このツールのおかげで、好みの家を建てることができました。

ただ、使い道がもう無い。。。

  mc   2018年2月13日


関連記事

ヨルタモリでサバサンドが

こんにちはニッチなテレビ番組が大好きなので当然ヨルタモリも毎週見てます。 2月1…

海老で鯛を釣る🎣

先日初めて釣りに行きました🎣 釣りは少し敷居が高いと思っていまし…

EC-CUBE3.0プラグイン合宿 ~in 伊東~

どうも!ウツノミヤです! もう早いもので2015年も終わりですね! 今年は入籍・…


← 前の投稿

次の投稿 →