Orbitcontrol

  • 投稿日:
  • by
  • カテゴリ:

three.jsでorbitcontrol使ったけど
これって見る角度は変わるけど
ライティングは変わらないのね。。。

あと、three.js用のdivの上に空div縦横100%
置いたらmousemoveとか検知されなかった。
急遽pointer-events:none;で対応。
ただこれだとIE11以上。。。。。
jsでevent.preventDefault();とかもためしたけどダメ。

flashならmouseEnabledやmouseChildren
いじればよかったけど
細かくやるなら空divにmousemoveとかで
連動する回転自作した方が良さそう。

あと、MeshBasicMaterialって
光の影響受けないのね。。。
これも嵌ったのでメモ。

スクロール量の取得

  • 投稿日:
  • by
  • カテゴリ:

昔のフルフラ的な感じでJSごりごりするときに
スクロールさせないでスクロール量のみ利用する場合
のサンプルコード。

PCの場合は、スクロールをキャンセルしないと
chromeで少しコンテンツが動いちゃったので
preventDefaultで回避。

//PCスクロール//////////////////////////////////////////////////////////
$(target).mousewheel(function(event, delta) {
//スクロールキャンセルでchromeの少し動くの防止
event.preventDefault();

if (delta > 0) {
wheelY--;
} else if (delta < 0) {
wheelY++;
}
if(wheelY<0) wheelY=-1;
//Debugger.log("スクロール:"+wheelY);
$("#scroll").text("スクロール量:" + wheelY); //追加
});

//スマホスクロール//////////////////////////////////////////////////////
$(target).bind("touchstart touchmove touchend", touchHandler);
function touchHandler(e) {
//これあるとタッチが機能しない
//e.preventDefault();
var touch = e.originalEvent.touches[0];

if (e.type == "touchstart") { // 画面にタッチした
startY = diffY = 0;
//タッチ開始時のY座標
startY = touch.pageY;
} else if (e.type == "touchmove") { // 画面をスライドした
e.preventDefault();
//スライド時のY座標 - 開始時のY座標 = 移動距離( diffY )
diffY = touch.pageY - startY;
if (diffY >0) { // 下に100px以上移動したか
wheelY--;
} else if (diffY <0) { // 上に100px以上移動したか
wheelY++;
} else {
return false;
}
} else if (e.type == "touchend") { // 画面から指を離した

} else {
return false;
}
if(wheelY<0) wheelY=-1;
$("#scroll").text("スクロール量:" + wheelY); //追加
}


参考
http://black-flag.net/jquery/20140312-5031.html

mp4

  • 投稿日:
  • by
  • カテゴリ:

videoタグでmp4を再生するときに
htaccessでロックをかけていると
iPhoneやiPadでうまく再生されない恐れがある。

PCでも再生が途中で止まったりします。

htaccessを外すと
嘘みたいにスムーズに再生されました。

上記はたぶん気のせいで
htaccessにmp4の許可を書かないとダメ。

#ここがiOS系がダメだった
<Files ~ "\.(mp4|webm)$">
Satisfy any
Allow from all
</Files>
#ここがないとIE10以下がダメだった
AddType video/mp4 .mp4
AddType video/webm .webm
AddType video/ogg .ogv

WebARENAはプランによっては
AddTypeが対応していないらしいので
その場合はyoutube埋め込みや
flashを代替としてやるとかかな。。。

*さくらとhetemlは上記記述をいれたらiOS、IE10,9でmp4が見れた
*iOSはベーシック認証をはずしてもみれた

参照

  • 投稿日:
  • by
  • カテゴリ:

jsで要素や属性の参照するときのメモ
<ul class="aa" id="aa">
<li><img src="images/anime/frog.gif" alt="" /></li>
<li><img src="images/anime/golden_monky.gif" alt="" /></li>
</ul>

てあったときに
alert(document.getElementById('slides').children[0].getElementsByTagName('img')[0].getAttribute("data-lazy"))
//images/anime/frog.gif
alert(document.getElementById('slides').children[0].getElementsByTagName('img')[0].nodeName)
//IMG

claptaps project[5]

lightwaveでplaneを2つかいたとき

書き出したobjファイルの2plane分の
v,vtなどは続けて書かれてる。メモ。
v 10~13,14~17
ちなみにobjファイルのfは
f 頂点座標/マッピング座標/頂点番号
で、lightwaveでマッピングしてないから
空でf 2//1と出ています。
img160329_1.jpg

img160329_2.jpg

サーバー

  • 投稿日:
  • by
  • カテゴリ:

なんかキャンペーンの度にサーバー会社に聞いている気がするので
ここらでレンタルサーバーメモ。503エラー起こさない為に・・・。

■共用サーバー
・いろんな人たちと1台のサーバーを利用。
・一人当たりのコストが下がる。
・価格が安いと、より多い人数でシェアしている可能性有り。
・他のユーザーサイトの負荷が高いと影響出る可能性有り。
・同時接続数等、ある程度制限有り(要確認)
・1アクセスに対し、セッションが多く発生しないか要確認。

■専用サーバー
・時接続数もある程度余裕があるので、
 503エラーがかなり発生しにくいというメリットがある。
・共用サーバーへ比べて高い。


■レンタルするときはこの辺を確認する
・同時アクセス可能数
・一日のデータ転送量
・ディスク容量
・1日のアクセス数(およそどのくらい耐えれるか)
・ミラーリング対応は必要か?(必要の場合は専用になりそう)

参考URL
http://www.cpi.ad.jp/column/column01/


three.js light

  • 投稿日:
  • by
  • カテゴリ:

ライトの種類のメモ。
ライトの種類は色々あるけど、まずは「DirectionalLight(平行光源)」。
平行光源は、太陽光のような、一定方向から全体を照らす光源の事。

ただし、平行光源だけだと、光が当たらない影の部分が完全に真っ黒になってしまうので、
もう一つ「AmbientLight(環境光)」を合わせて使う。
環境光とは、自然光の乱反射を表現するもの。
環境光は、方向関係なく、ありとあらゆるものを照らす光。

SNS API メモ

  • 投稿日:
  • by
  • カテゴリ:

SNSのAPIでもろもろ仕様メモ

■twiter
・取得可能期間:過去1週間
・一度に取得可能な投稿数:100件

twitter:15〜180/15秒(※取得項目により違いがあります)

■Instagram
・取得可能期間:かなり昔まで(仕様にかいてないっぽい?)
・一度に取得可能な投稿数:90件
・一時間に可能なアクセス
 認証あり:1tokenごとに1時間5000コール 
 認証なし:1アプリごとに1時間5000コール

three.jsメモ5

  • 投稿日:
  • by
  • カテゴリ:
geometry/material/textureは
removeだけだと削除されずレンダラーのメモリに残る。

そんな時はdisposeで消えるらしい

scene.remove( mesh ); geometry.dispose(); material.dispose(); texture.dispose();

参考URL
http://qiita.com/yomotsu/items/7be847bf2fd08335e8b1

three.jsメモ4

  • 投稿日:
  • by
  • カテゴリ:

モーレツな勢いで作っていたので
あってるかわからないけど個人メモ。

pointCloudはnewしたらvertices増やせなかった。

それとgeometryとpointCloudを
二つつくるとカメラ移動中に消えてしまうバグが
でたのでgeometryとpointCloudを一つで対応。

たぶんどちらも解決できるんだろうが
すこし時間かかりそう。。。