Innofactory는 자사의 Innofactory Highchart Extension을 자체적으로 개발하여 Thingworx 화면에서에서 기본 위젯보다 다채로운 차트를 표현할 수 있습니다.
본 포스팅에서는 Thingworx 데모를 위한 Highchart 구성 시 AI를 사용하여 간단하게 Highchart 데모 생성시간을 단축시킬 수 있는 방법을 제시합니다.
Bing의 Copilot이란? #
Copilot은 Microsoft에서 제공하는 AI 서비스로, Bing 검색 인덱스에서만 퍼블릭 웹의 데이터에 접근하여 사용자에게 정보를 제공합니다. 기존의 Chat GPT와의 가장 큰 차이는 퍼블릭 웹 데이터에 접근이 가능하다는 것이며, Open AI의 Chat GPT-4 서비스에서도 웹 데이터에 접근하는 기능을 제공하기 시작했지만, 기존 GPT-3.5와 요금 정책이 달라져 요금 충전 후 답변 토큰 개수에 따라 요금을 차감하는 방식에서 월 구독제로 변경해야만 GPT-4를 사용할 수 있습니다. 이 때문에 횟수제한은 있지만 무료로 사용가능한 Copilot이 Chat GPT와의 차별성을 가지게 되었습니다.
Copilot은 Microsoft Edge, Chrome, Firefox, Safari 등 주요 브라우저에서도 사용할 수 있습니다.
Copilot은 GPT-4 AI 모델을 기반으로 합니다. Copilot의 이름은 이전에 Bing Chat Enterprise였으며, 2023년에 Copilot으로 변경되었습니다. 이 서비스는 현재 Edge 및 Windows에서 액세스할 수 있습니다.
Innofactory Highchart Extension for Thingworx #
Thingworx에서 Highchart Extension을 이용하여 다채로운 차트를 표현할 수 있습니다. 사용 방법은 기존의 Highchart API와 동일합니다.
Highchart는 제공하는 차트 형태가 다양하기 때문에 구현하고자 하는 형태의 차트에 따라서 Highchart 객체에 제공해야하는 데이터 포멧의 형태 차이가 상이한 편입니다.
몇몇 특별한 형태의 차트는 Thingworx용 Innofactory Highchart Extension을 업그레이드 하여 Highchart 모듈을 추가해야 할 수도 있습니다.
Bing을 이용한 Highchart JS 코드 구성 방법 #
Bing의 Copilot을 활용하면 Highchart JS 코드를 작성하도록 지시하여 손쉽게 데모의 기본 틀을 잡을 수 있습니다.
- 구현하고자 하는 차트를 최대한 상세히 표현하고, Copilot에 해당 모양의 Highchart를 구현하기 위한 JS 스크립트를 생성하도록 지시하는 문장을 만듭니다.
- 현재 Copilot은 대화 스타일을 창의적인/균형 있는/정밀한 중에서 선택할 수 있으며 답변의 정확성을 위해 정밀한 스타일을 선택합니다.
- 지시문을 사용합니다.
- 다음과 같이 JS 스크립트가 생성됩니다.
- 답변 하단의 지시를 따라 JS Fiddle을 이용하여 Copilot이 생성한 JS 스크립트가 정상적으로 동작하는지 확인해 봅니다.
- Thingworx 는 Json 데이터의 Key 값을 문자열 작은 따옴표로 감싸줘야 스크립트 편집기에서 오류가 나지 않음으로 key 값을 조정하도록 지시합니다.
- 해당 스크립트를 기반으로 JS Fiddle에서 테스트 합니다.
아래는 Copilot의 답변을 기반으로 JS Fiddle에서 테스트한 결과입니다.
이와같이 bing의 Copilot을 이용해 데모 Highchart 표현 시 개발 시간을 단축시킬 수 있습니다.