LogoMark.png

JavaScript/Function

JavaScript

JavaScriptプログラミングで活用できる小さな関数のコレクション
プログラミングの参考に、随時追加しています。

CONTENTS


CANVAS 上のマウス座標を得る

ブラウザWINDOW上の座標 - CANVASの左上の座標 を計算して取得します。

マッピング

a1 - a2 間における x の相対値を b1 - b2 間の相対値に変換。
数学的な座標をWindow座標に変換するのに便利です。

function mapping( x, a1, a2, b1, b2 ) {
  if ( a2 == a1 ) return NaN;
  return ( b2 - b1 ) / ( a2 - a1 ) * ( x - a1) + b1;
}

ラジアン・角度変換

現在時刻を hh:mm:ss 形式で返す

function StampTime(){
  var t = new Date();
  var hh = t.getHours(); if(hh<10){ hh = "0"+hh;}
  var mm = t.getMinutes(); if(mm<10){ mm = "0"+mm;}
  var ss = t.getSeconds(); if(ss<10){ ss = "0"+ss;}
  return hh+ ':' + mm + ':' + ss;
}

現在時刻を表示したい場所に、以下のように書いて利用します。

obj.innerText = StampTime();




ランダムな色を発生させる

function randomColor(){
  var col = Math.floor( Math.random() * 0xFFFFFF ).toString(16);
  for( var i = col.length; i<6; i++ ) { col = "0" + col; }
  return "#" + col;
}

RGB各8ビット、ランダムに値を選んで、16進数にして返す。
6桁に満たない場合は先頭に 0 を追加しています。

色を与える記述において、以下のように書いて利用します。

obj.style.backgroundColor = randomColor();




ベンダープレフィックスを取得

ベンダープレフィックスというのは、スタイルシートでプロパティーの先頭に必要に応じてつける -moz- や -webkit- といった記号のことです。

var VENDER_PREFIX = (function() {
   var ua = navigator.userAgent;
   if (ua.indexOf('Opera') != -1) {
       return 'O';
   } else if (ua.indexOf('MSIE') != -1) {
       return 'ms';
   } else if (ua.indexOf('WebKit') != -1) {
       return 'webkit';
   } else if (navigator.product == 'Gecko') {
       return 'Moz';
   } else {
       return '';
   }
})();






PAGES

GUIDE

DATA

Last-modified: 2019-07-05 (金) 20:51:15