d3 - 시각화 자바스크립트 라이브러리

D3(Data-Driven Documents 를 표방해서 D3라 한다고 하는 듯)은
강력한 시각화 자바스크립트 라이브러리 이다.


이는 https://d3js.org/ 에서 확인 가능하고

d3를 wrapping 하여 좀더 정형화 한 것 중에 하나가 C3(http://c3js.org/) 라고 하는 것도 있다.

javascript/SmartClient] RichTextEditor 사용하기.

RichTextEditor를 사용하기 위해서는 아래와 같은 선언문을 포함한 뒤.

<SCRIPT SRC=isomorphic/system/modules/ISC_RichTextEditor.js></SCRIPT><SCRIPT>isc._lastModule='RichTextEditor';</SCRIPT>

------------

isc.VLayout.create({
   membersMargin:5,
   members:[
       isc.RichTextEditor.create({
           autoDraw:false,
           ID:"contentEditor",
           height:155,
         
           overflow:"hidden",
           canDragResize:true, showEdges:true,

            // Standard control group options include
            // "fontControls", "formatControls", "styleControls" and "colorControls"
            controlGroups:["fontControls", "formatControls", "styleControls", "colorControls"],
            value:''
       })
       ]
});

와 같이 선언을 하여 사용한다.

(참조 URL : http://www.smartclient.com/docs/9.0/a/system/reference/SmartClient_Explorer.html#RichTextEditor
)

위의 RichTextEditor 를 DynamicForm 에 붙여서 사용하기 위해서는
DynamicForm에서 사용하고자 하는 field의 타입을 'canvas'로 선언해서 사용하면 된다.

추가적으로 해당 RichTextEditor 에서 사용하고자 하는 font를 더 추가하고자 하는 경우,

isomorphic/system/modules/ISC_RichTextEditor.js 파일의 82 line부근의 fontControls이 정의된 곳에 추가하고자 하는 Font 를 추가하면 된다.
추가하는 형식은 "font":"font 라벨(콤보에 표시되는 값)" 으로 "," 로 구분하여 추가하면 된다.

javascript/eclipse] eclipse 에서 'Requesting JavaScript AST from selection' has encountered a problem' 오류 발생시 해결방법.

eclipse로 작업중에 'Requesting JavaScript AST from selection' has encountered a problem.' 발생하면 다음과 같이 하면 문제가 해결 될 것이다.
(Eclipse JSDT 의 버그가 원인)

- eclipse 메뉴 :: Window -> Preference -> Javascript -> Editor -> Mark Occurences -> Mark occurences of the selected element in the current file 항목의 체크 해지

cross site scripting(XSS) 공격 우회방법.

1. xss (cross site scripting) 공격을 was 설정을 통해 방어하는 방법

   http://mimul.com/pebble/default/2009/10/04/1254641100000.html

   ==> java class 와 web.xml 의 설정을 통한 방어로 기존의 작업분의 변경이 많이 필요할 수 있다.

2. jstl 태그를 사용해서 코딩을 한 경우 아래의 사이트를 참조하셔도 될것 같습니다. 

   ==>  http://ssiso.net/cafe/club/club1/board1/content.php?board_code=jsp%7Csetting&idx=31589&club=jsp

3. jsp 메소드를 사용하는 방법 (아래 메소드를 jsp에서 호출해서 사용하면 됩니다.)

/**

 * XSS 제거

 * @param value

 * @return

 */

public static String removeXSS(String value){

     

     value = value.replaceAll("&", "&");

     value = value.replaceAll("<", "<");

     value = value.replaceAll(">", ">");

     value = value.replaceAll("", null);

     value = value.replaceAll("\"", "";");

     value = value.replaceAll("\'", "';");

     value = value.replaceAll("%", "%;");    

     value = value.replaceAll("../", "");

     value = value.replaceAll("..\\\\", "");

     value = value.replaceAll("./", "");

     value = value.replaceAll("%2F", "");

     

     return value;

}

Javascript ] javascript 날짜(Date) 관련 함수.

// 현재 일자보다 7일전 날짜 구하기.

var dt = new Date();
var fd = timeShift(dt, "-7");
var val = fd.getFullYear()+"-"+(fd.getMonth()+1)+"-"+fd.getDate();

// fd 값을 가진 날의 요일

fnSetFromDateVal(fd);

// fd ~ dt 의 기간.
betweenDay(fd, dt);

/**
 * a : date()
 * s : 이동하고자 하는 일자 기간.(7 - 7일, 15 - 15일)
 */
function timeShift(a,str){

b = new Date();

b.setTime(a.getTime() + ((str) * 24 * 60 * 60 * 1000));

return b;

}



/**
  * 특정날짜의 요일을 구한다.
  * time : 날자형식의 데이터.
  */
function getDayOfWeek(time) {

     var now = new Date(time);
     var day = now.getDay(); //일요일=0,월요일=1,...,토요일=6
    // var week = new Array('일','월','화','수','목','금','토');
    // return week[day];  // 리턴값은 일 ~ 토 로 표시된다.
     return day;  // 리턴값은 0 ~ 6 로 표시된다.
 }



/**
  * 입력받을 날자 사이의 기간을 리턴
  * fd : 시작일자, td : 종료일자.
  */

function betweenDay(fd, td) {
    var betweenDay = (fd.getTime() - td.getTime())/1000/60/60/24;
    return betweenDay;
}

javascript] 숫자만 입력받는 함수

회원으로 가입하거나 할때 유용하게 쓰일수 있는 팁이라서 올린다.[초기값 한글/영문으로 지정하기]<input type="text" name="m_name" style="ime-mode:active;"> //초기값이 한글자판
<input type="text" name="m_id" style="ime-mode:inactive;"> //초기값이 영문자판



[숫자 및 특수문자 허용]
// 숫자만 입력받는다. 특수문자('-','.',...)도 허용한다.
function onlyNumber() {
if((event.keyCode > 31) && (event.keyCode < 45) || (event.keyCode > 57)) {
event.returnValue = false;
}
}

// 숫자만 입력받는다. "-"도 받지않는다.
function onlyNumber2(loc) {
if(/[^0123456789]/g.test(loc.value)) {
alert("숫자가 아닙니다.\n\n0-9의 정수만 허용합니다.");
loc.value = "";
loc.focus();
}
}

사용예제) - 주민번호나 전화번호 경우<input name="jumin2" value="" type="text" size="7" maxlength="7" onKeyPress=onlyNumber() onBlur=onlyNumber2(this);>