안녕하세요 그레이프시티입니다.

먼저, 문의에 대한 답변이 늦어진 점 죄송합니다.

먼저 문의 주신 제품이 SpreadJS가 맞으신지요? 

SpreadJS가 아닌 타 제품을 말씀하신 것인지 확인하여 주시기 바랍니다. 

답변은 SpreadJS 제품이라는 전제 하에 드리도록 하겠습니다.

1) 디자인 소스 없이 사용자가 특정 셀들의 색을 변경 할 수 있나요.(배경)

=> 디자이너 소스 코드를 뜻하신 거라면 모든 기능은 디자이너 소스 코드없이 SpreadJS 자체로 구현이 가능합니다. SpreadJS에는 모든 기능이 포함되어 있으며 디자이너 소스 코드는 엑셀처럼 리본 메뉴를 통해 SpreadJS의 기능을 설정할 수 있도록 사용하실 수 있는 제품입니다. 

특정 셀의 배경색 지정을 위해서는 setStyle 메서드를 사용하시면 됩니다. setStyle은 특정 위치의 셀의 스타일을 지정해줄 수 있는 메서드입니다. 아래 코드는 (0,0) 위치의 셀에 cellStyle 변수에 담긴 backColor(배경색)를 노랑색으로 지정하는 코드입니다.

var cellStyle = new GC.Spread.Sheets.Style();
cellStyle.backColor = "yellow"; 

sheet.setStyle(0, 0, cellStyle, GC.Spread.Sheets.SheetArea.viewport);

2) 특정 컬러가 들어간. 글자나, 배경이 들어간 쉘의 데이터만 추출할 수 있나요.

=> 반복문과 getStyle 메서드를 통해 특정 위치에서 스타일을 가진 데이터를 가져오실 수 있습니다.  아래 코드는 (0,0) 위치의 셀이 스타일이 지정되어 있는지 확인하고  스타일이 지정되어 있으면서 backColor이 노랑색이면 getValue를 사용하여 값을 가져와 배열에 넣어주는 코드입니다. 

 var cstyle = sheet.getStyle(0,0,GC.Spread.Sheets.SheetArea.viewport, true);
      if(cstyle &&cstyle.backColor === "yellow"){
        var temp = sheet.getValue(0,0)
        result.push(temp)
      }

아래 샘플을 참고하여 주시기 바랍니다.

https://codepen.io/GrapeCity-Korea/pen/NWrVoRb 

[setStyle]

https://www.grapecity.com/spreadjs/docs/v13/online/SpreadJS~GC.Spread.Sheets.Worksheet~setStyle.html?highlight=setstyle%2C 

[getStyle] 

https://www.grapecity.com/spreadjs/docs/v13/online/SpreadJS~GC.Spread.Sheets.Worksheet~getStyle.html?highlight=getstyle%2C 

도움말 문서를 함께 전달드렸으니 참고하여 주시기 바랍니다. 

다른 궁금한 점이 생기면, 언제든 문의 주시기 바랍니다.

감사합니다.

그레이프시티 드림

* 그레이프시티(GrapeCity)는 개발자를 위하여 ComponentOne(컴포넌트원), Spread(스프레드), ActiveReports(액티브리포츠), SpreadJS(스프레드JS), Wijmo(위즈모)와 같은 엑셀 스프레드시트 리포팅 그리드와 차트 등 다양한 종류의 .NET JavaScript(자바스크립트) 컴포넌트 툴을 생산하고있는 개발툴 전문 회사 입니다.