• 고객센터
  • 교육
  • 매뉴얼
  • 데모
  • 제품소개
조회 수 : 1420
2009.02.24 (23:29:26)

안녕하세요?
첨부해놓은 샘플을 보시면 그리드에 이미지데이터셋을 연동한 샘플이 들어있습니다.
그리드에서 이미지를 연동하시려면
1) 데이터를 담아올 때 각 데이텃과 이미지데이터셋은 syncload=true로 지정합니다.
<object id=oImgDataGIDS classid=CLSID:2B0B1D8B-CAAA-4E06-BD9A-A09A916BD67A>
        <PARAM NAME="SyncLoad" VALUE="true">
</object>

<object id=oSampleGDS classid=CLSID:2506B38B-0FF7-4249-BA3E-8BC1DC399FBB>
        <PARAM NAME="SyncLoad" VALUE="true">
</object>

2) 그리드에 바인딩할 데이터셋과 이미지를 담고 있는 이미지데이터셋에
데이터를 담아옵니다.

        oSampleGDS.DataID="./ds.csv";
        oSampleGDS.Reset();


        // 이미지 서비스 호출
        oImgDataGIDS.DataID="./treeimg.jsp";
        oImgDataGIDS.Reset();

* 데이터셋에 담긴 데이터중 이미지컬럼ID를 담고있는 컬럼인 TEST1,TEST2,TEST3 값이
  이미지데이터셋의 들어있는 이미지컬럼ID값 중의 하나로 들어있어야 이미지컬럼ID로
  그에 해당하는 이미지가 그리드에 표현되게 된다.


3) 그리드 컴포넌트 속성에 데이터셋과 이미지 데이터셋을 바인딩하는 속성을 지정한다.
                <Param Name="DataID"                        value="oSampleGDS">  
                <param name="ImgDataID"                        value="oImgDataGIDS">

4) 그리드 이미지를 표현할 컬럼에
imgcol="true" //컬럼에 이미지를 표시할지 여부
imgfitstyle=2   //컬럼에 이미지를 표시할 때 보여질 모습.
(0 – 이미지를 표시하지 않음, 1 – 셀크기에 맞추어 표시, 2 – 원본 크기대로 표시.)
위와 같이 컬럼 속성을 지정한다.

이렇게 4가지 작업에서 잘못된 부분이 있는지 확인해보시고 샘플 소스와 비교해보시면 해결되실 겁니다.
참고로 첨부파일의 샘플을 실행시켜보시려면 해당하는 treeimg.jsp파일에서 이미지 파일경로를 실제 이미지가
들어있는 경로로 맞춰주신 후 실행시켜 보시면 됩니다.



>게시판을 이용해 주셔서 감사합니다.
>다음양식에 맞게 입력해주세요.
>
>* 고객시스템명 : 전력통계정보시스템
>* 문의할 Component명 및 버전 : 4.0
>* DataSet 버전 :
>
>  GAUCE_MX_IMAGESET = 1,2,1,9
>  GAUCE_MX_TREE         = 1,2,1,34
>  GAUCE_MX_DATASET   = 1,2,1,68
>
>* Tr 버전 :
>* 문의 유형(질문/요청/참조) : 질문
>* 내용 :
> tree component를 사용하는데... 이미지 FileInputStream시 tree에 이미지 표현이 안됩니다.
>
> 아래소스 중
>
>         dSet.addDataColumn(new GauceDataColumn("Tb_img"     ,GauceDataColumn.TB_BLOB));
>        dSet.addDataColumn(new GauceDataColumn("Tb_img_id"  ,GauceDataColumn.TB_STRING));
>        dSet.addDataColumn(new GauceDataColumn("Tb_img_size",GauceDataColumn.TB_INT));
>
> 부분에서 "Tb_img","Tb_img","Tb_img_size" 를 가져오는지 Debug한 결과
>
>        1row : java.io.FileInputStream@d741c        , "Close" , 940
>        2row : java.io.FileInputStream@141e072        , "Open" , 1136
>        3row : java.io.FileInputStream@1f680ea        , "File" , 576
> 로 표현이 됩니다.
>
> 위 데이터셋을 그리드에 찍어보면
>
>        <object id="gd_img" width="100%" height="100" classid="<%=GAUCE_MX_GRID%>">
>            <param name="DataID"    value="gauce_ImgDataSet">
>            <param name="format"    value="
>                <c>id='Tb_img'      name='Tb_img'       width=85    align=center    ImgCol='true' ImgFitStyle='2'</c>
>                <c>id='Tb_img_id'   name='Tb_img_id'    width=90    align=center</c>
>                <c>id='Tb_img_size' name='Tb_img_size'  width=90    align=center</c>
>            ">
>        </object>
>
>        Tb_img부분에 데이터(이미지)가 표현이 안됩니다. 물론 트리로 구현해도 마찬가지입니다.
>        어느부분이 문제 인지 확인 부탁드립니다. 참고로 이미지경로는
>        "C:/Documents and Settings/XP/workspace/epsis/epsis/htdocs/image/"안에 "close.ico","open.ico","file.ico" 입니다
>
> ※ jsp파일 첨부합니다. script 는 아래부분 참고하세요.
>
><jsp>
>
><script 부분>
>    var THeader = "Level:STRING(1)"
>                + ",Deptcd:STRING(8)"
>                + ",Deptnm:STRING(255)"
>                //+ ",Type:STRING(1)"
>                + ",URL:STRING(1000)"
>                + ",Index:INT(4)"
>                + ",ImgC:STRING(255)"
>                + ",ImgO:STRING(255)"
>                + ",ImgD:STRING(255)"
>                ;
>    ds_tree.SetDataHeader(THeader);
>
>    var cnt = 0;
>    cnt++
>    ds_tree.addRow();
>    ds_tree.nameValue(cnt,"Level")  = "1";
>    ds_tree.nameValue(cnt,"Deptcd") = "00000000";
>    ds_tree.nameValue(cnt,"Deptnm") = "전체";
>    cnt++
>    ds_tree.addRow();
>    ds_tree.nameValue(cnt,"Level")  = "2";
>    ds_tree.nameValue(cnt,"Deptcd") = "01000000";
>    ds_tree.nameValue(cnt,"Deptnm") = "주요지표";
>    .
>    .
>    .
>    .
>        for(var i=1; i<=cnt; i++){
>
>                //ds_tree.nameValue(i,"Type")        = ds_tree.nameValue(i,"Level");
>                ds_tree.nameValue(i,"ImgC")        = "Close";
>                ds_tree.nameValue(i,"ImgO")        = "Open";
>                ds_tree.nameValue(i,"ImgD")        = "File";
>                ds_tree.nameValue(i,"Index")        = i;
>                ds_tree.nameValue(cnt,"URL")        = "";
>        }
>        
>        TreeView.DataID = "ds_tree";
>        TreeView.Reset();
>
>    //ImgDataSet
>    gauce_ImgDataSet.DataID = "/epsis/htdocs/common/inc/setBlobService.jsp";
>    gauce_ImgDataSet.reset();
>
>
><tree 컴퍼넌트 사용부분>
>
><object id="TreeView" width="196" height="360" classid="<%=GAUCE_MX_TREE%>">
>    <param name="DataID"            value="ds_tree">
>    <param name="TextColumn"        value="Deptnm">
>    <param name="LevelColumn"       value="Level">
>    <param name="TypeColumn"        value='Type'>
>    <param name="ExpandLevel"       value="1">
>    <param name="ExpandOneClick"    value="true">
>    <param name="BorderStyle"       value="0">
>    <PARAM name="ImgDataID"         value="gauce_ImgDataSet">
>    <PARAM name="ImgCColumn"        value="ImgC">
>    <PARAM name="ImgDColumn"        value="ImgD">
>    <PARAM name="ImgOColumn"        value="ImgO">
>    <param name="UseImage"          value="true">
></object>
>
><이미지데이터셋 가공 jsp 부분>
>
>    File fImage1    = null;
>    File fImage2    = null;
>    File fImage3    = null;
>
>    FileInputStream isImage1    = null;
>    FileInputStream isImage2    = null;
>    FileInputStream isImage3    = null;
>
>    try {
>
>        GauceResponse res = service.getGauceResponse();
>        GauceDataSet dSet = new GauceDataSet();
>        res.enableFirstRow(dSet);
>
>        dSet.addDataColumn(new GauceDataColumn("Tb_img"     ,GauceDataColumn.TB_BLOB));
>        dSet.addDataColumn(new GauceDataColumn("Tb_img_id"  ,GauceDataColumn.TB_STRING));
>        dSet.addDataColumn(new GauceDataColumn("Tb_img_size",GauceDataColumn.TB_INT));
>
>        String dir = "C:/Documents and Settings/XP/workspace/epsis/epsis/htdocs/image/";        //
>
>        try {
>            //Testing Dir
>            fImage1  = new File(dir + "close.ico");
>            fImage2  = new File(dir + "open.ico");
>            fImage3  = new File(dir + "file.ico");
>
>            isImage1 = new FileInputStream(fImage1);
>            isImage2 = new FileInputStream(fImage2);
>            isImage3 = new FileInputStream(fImage3);
>
>        } catch (Exception fe) {
>            fe.printStackTrace();
>        }
>
>        GauceDataRow row1 = dSet.newDataRow();
>        row1.addColumnValue(isImage1);
>        row1.addColumnValue("Close");
>        row1.addColumnValue(fImage1.length());
>        dSet.addDataRow(row1);
>
>        GauceDataRow row2 = dSet.newDataRow();
>        row2.addColumnValue(isImage2);
>        row2.addColumnValue("Open");
>        row2.addColumnValue(fImage2.length());
>        dSet.addDataRow(row2);
>
>        GauceDataRow row3 = dSet.newDataRow();
>        row3.addColumnValue(isImage3);
>        row3.addColumnValue("File");
>        row3.addColumnValue(fImage3.length());
>        dSet.addDataRow(row3);
>
>        System.out.println("isImage1 : "+isImage1);
>        System.out.println("isImage2 : "+isImage2);
>        System.out.println("isImage3 : "+isImage3);
>        
>        dSet.flush();
>        res.flush();
>        res.commit();
>        res.close();
>
 
Tag List
XE Login