파일을 다운받을 경우, 용량이 많아서 로딩바가 필요한 경우가 있다.

로딩바 이미지는 파일첨부 했습니다

function fn_excelDown(){ //파일 다운버튼을 눌렀을때 호출되는 함수

    setCookie("fileDownload","false"); //쿠키 셋팅 
    blockUI(); //로딩바 호출

    var frm = document.frmFillExcel;

    frm.submit(); //엑셀 파일 다운 폼 

}

function setCookie(c_name,value){

    var date = new Date(1000);

    document.cookie = "fileDownload=; expires="+date.toUTCString()+";path=/";

}

function getCookie(name){

    var parts = document.cookie.split(name+"=");

    if(parts.length == 2){

        return parts.pop().split(";").shift();

    }

}

var downloadTimer;
 
function blockUI() {
    FunLoadingBarStart();
    downloadTimer = setInterval(function() {
        var token = getCookie("fileDownload");
        if(token == "true") {
            unBlockUI();
        }
    }, 1000 );
}

function unBlockUI() {
    FunLoadingBarEnd();
    clearInterval(downloadTimer);
}

function FunLoadingBarStart() {

    var backHeight = $(document).height(); //뒷 배경의 상하 폭

    var backWidth = window.document.body.clientWidth; //뒷 배경의 좌우 폭

    var backGroundCover = "<div id='back'></div>"; //뒷 배경을 감쌀 커버

    var loadingBarImage = ''; //가운데 띄워 줄 이미지

    loadingBarImage += "<div id='loadingBar'>";

    loadingBarImage += "<img src='../img/cultivation/loadingbar.gif' />";

    loadingBarImage += "</div>";

    $('body').append(backGroundCover).append(loadingBarImage);

    $('#back').css({ 'width': backWidth, 'height': backHeight, 'opacity': '0.3' });

    $('#back').show();

    $('#loadingBar').show();

}

function FunLoadingBarEnd() {
    $('#back, #loadingBar').hide();
    $('#back, #loadingBar').remove();
}

<style>

#back{ position: absolute; z-index: 100; background-color: #000000; display:none; left:0; top:0; width:100%; height:100%}
#loadingBar{ position:absolute; left:50%; top: 40%; display:none; z-index:200; }

</style>

java 단에

Cookie cookie = new Cookie("fileDownload", "true");
response.addCookie(cookie);

추가해준다.

GIS 개발을 하다가 좌표값을 db에 저장했는데  문자열을 치환해야하는 경우가 생겼다.

14102895.763908967,4224317.671008111,14102432.364424989,4223753.947924509,14103225.398593448,4223553.30072526,14103555.033277927,4223992.813637899,14102895.763908967,4224317.671008111

위의 좌표값을 아래와 같이 표시를 해야한다.

[[

[14105239.988929166, 4223257.282268806], 

[14105234.785437182, 4223249.518770073], 

[14105234.465436349 , 4223235.271775984],

[14105239.988929166 , 4223257.282268806]

]];

var getCoordinate =

14102895.763908967,4224317.671008111,14102432.364424989,4223753.947924509,14103225.398593448,4223553.30072526,14103555.033277927,4223992.813637899,14102895.763908967,4224317.671008111;

규칙을 살펴보면 두번째 콤마에 , -> ],[ 를 해주면 될 것 같다.

맨 앞의 [[[ 와 맨뒤의 ]]] 는 나중에 붙여주자.

var chg = getCoordinate.replace(/,/g, function (match, i, original) {
nth++;
return (nth%2 === 0) ? "],[" : match;
});
chg = '[[['+chg+']]]';

이렇게 하면 원하는 데이터가 나온다

match : 여기서는 콤마(,)

i : 콤마의 자릿수

original : 원래 데이터 

nth%2 === 0 : 2로 나누어 떨어지는 콤마에 대해서만 치환을 해주기 위해서