Hello All,
Has anyone has implemented echarts-gl library with Cognos ?
Has anyone tried to develop a 3D Scatter visualization like this one with Cognos Customvis tool ?
Examples - Apache ECharts When i developped a chart Combining a line and a pie (with only echarts which is available both in TS ans JS) it was ok with an external link.
But now i want to develop a scatter 3D and it needs a new library echarts-gl (available only in JS) and i don't see how to add/define it correctly.
First test with npm echarts & echarts-gl installed :Main.ts
import { RenderBase, UpdateInfo } from "@businessanalytics/customvis-lib";
import * as echarts from 'echarts';
import 'echarts-gl';
export default class extends RenderBase
{
private _chart : any;
protected create( _node: HTMLElement ): HTMLElement
{
_node.textContent = "Basic VizBundle";
this._chart = echarts.init(_node);
return _node;
}
protected update( _info: UpdateInfo ): void
{
const self = this;
var option : any;
var symbolSize = 2.5;
....
Throw me this message when i want to test my visualization with customvis start :
ReferenceError : process is not defined
2nd test with external definition :
Main.ts
import { RenderBase, UpdateInfo } from "@businessanalytics/customvis-lib";
import { init, use } from "https://cdn.jsdelivr.net/npm/echarts@5.3.2/dist/echarts.min.js"; // Loading ECharts library
import {Grid3DComponent, Scatter3DChart} from "https://cdn.jsdelivr.net/npm/echarts-gl@2.0.9/dist/echarts-gl.min.js";
export default class extends RenderBase
{
private _chart : any;
protected create( _node: HTMLElement ): HTMLElement
{
_node.textContent = "Basic VizBundle";
use([Grid3DComponent]) ;
use([Scatter3DChart]) ;
this._chart = init(_node);
return _node;
}
protected update( _info: UpdateInfo ): void
{
const self = this;
var option : any;
var symbolSize = 2.5;
....
Throw me this message when i want to test my visualization with customvis start :
GET : http:// cognos server /bi/pat/echarts.js net::ERR_ABORTED 404 (Not Found)
3rd test with external definition :
Mains.ts
import { RenderBase, UpdateInfo } from "@businessanalytics/customvis-lib";
import { init, use } from "https://cdn.jsdelivr.net/npm/echarts@5.3.2/dist/echarts.min.js"; // Loading ECharts library
import {Grid3DComponent} from "https://cdn.jsdelivr.net/npm/echarts-gl@2.0.9/components.min.js";
import {Scatter3DChart} from "https://cdn.jsdelivr.net/npm/echarts-gl@2.0.9/charts.min.js";
export default class extends RenderBase
{
private _chart : any;
protected create( _node: HTMLElement ): HTMLElement
{
_node.textContent = "Basic VizBundle";
use([Grid3DComponent]) ;
use([Scatter3DChart]) ;
this._chart = init(_node);
return _node;
}
protected update( _info: UpdateInfo ): void
{
const self = this;
var option : any;
.....
Throw me this message when i want to test my visualization with customvis start :
Uncaught SyntaxError: Unexpected token 'export' (at components.min.js:7:1) ( export * from './lib/export/components'; )
Uncaught SyntaxError: Unexpected token 'export' (at charts.min.js:7:1) ( export * from './lib/export/charts';)
Any help would be appreciated !
Best regards
------------------------------
LOIC POTIN
------------------------------
#CognosAnalyticswithWatson