@datarailsshared/dr_renderer 1.3.21 → 1.3.22

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@datarailsshared/dr_renderer",
3
- "version": "1.3.21",
3
+ "version": "1.3.22",
4
4
  "description": "DataRails charts and tables renderer",
5
5
  "keywords": [
6
6
  "datarails",
@@ -2226,9 +2226,6 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
2226
2226
  return {aggfunc: aggfunc, base: base};
2227
2227
  }
2228
2228
 
2229
- highchartsRenderer.ptRenderSolidGauge = (pivotData, opts) => {
2230
- return highchartsRenderer.ptRenderGauge(pivotData, opts, true);
2231
- };
2232
2229
 
2233
2230
  highchartsRenderer.transformOldGaugeOptions = (oldOptions) => {
2234
2231
  const newOptions = highchartsRenderer.objectCopyJsonMethod(oldOptions);
@@ -2265,195 +2262,6 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
2265
2262
  return new DrGaugeChart(pivotData, opts).render();
2266
2263
  };
2267
2264
 
2268
- highchartsRenderer.ptRenderGauge = (pivotData, opts, isSolidGauge = false) => {
2269
- const gaugeopts = opts.chartOptions
2270
- || highchartsRenderer.getDefaultValueForChart(isSolidGauge ? 'gauge-solid-chart' : 'gauge-chart');
2271
-
2272
- const chartOptions = {
2273
- chart: {
2274
- type: isSolidGauge ? 'solidgauge' : 'gauge',
2275
- animation: disableAnimation ? false : true,
2276
- },
2277
- plotOptions: {
2278
- solidgauge: {
2279
- allowPointSelect: true,
2280
- cursor: 'pointer',
2281
- dataLabels: {
2282
- allowOverlap: gaugeopts && gaugeopts.label
2283
- ? gaugeopts.label.overlap
2284
- : false,
2285
- y: 5,
2286
- borderWidth: 0,
2287
- useHTML: true,
2288
- style: highchartsRenderer.getDataLabelsStyle(gaugeopts),
2289
- },
2290
- },
2291
- series: {
2292
- animation: !disableAnimation,
2293
- },
2294
- },
2295
- credits: {
2296
- enabled: false,
2297
- },
2298
- xAxis: {
2299
- categories: highchartsRenderer.getFormattedColKeys(pivotData, null),
2300
- },
2301
- yAxis: isSolidGauge
2302
- ? {
2303
- min: 0,
2304
- max: gaugeopts.range.max,
2305
- stops: [
2306
- [gaugeopts.range.low / 100, '#55BF3B'], // green
2307
- [gaugeopts.range.medium / 100, '#DDDF0D'], // yellow
2308
- [gaugeopts.range.high / 100, '#DF5353'], // red
2309
- ],
2310
- lineWidth: 0,
2311
- minorTickInterval: null,
2312
- tickPixelInterval: 400,
2313
- tickWidth: 0,
2314
- labels: {
2315
- y: 16,
2316
- },
2317
- }
2318
- : {
2319
- min: 0,
2320
- max: gaugeopts.range.max,
2321
- minorTickInterval: 'auto',
2322
- minorTickWidth: 1,
2323
- minorTickLength: 10,
2324
- minorTickPosition: 'inside',
2325
- minorTickColor: CHART_COLORS.TICK_COLOR,
2326
- tickPixelInterval: 30,
2327
- tickWidth: 2,
2328
- tickPosition: 'inside',
2329
- tickLength: 10,
2330
- tickColor: CHART_COLORS.TICK_COLOR,
2331
- labels: {
2332
- step: 2,
2333
- rotation: 'auto',
2334
- },
2335
- title: {
2336
- text: '', //'km/h'
2337
- },
2338
- plotBands: [
2339
- {
2340
- from: 0,
2341
- to: (gaugeopts.range.max * gaugeopts.range.low) / 100,
2342
- color: '#55BF3B', // green
2343
- },
2344
- {
2345
- from: (gaugeopts.range.max * gaugeopts.range.low) / 100,
2346
- to: (gaugeopts.range.max * gaugeopts.range.medium) / 100,
2347
- color: '#DDDF0D', // yellow
2348
- },
2349
- {
2350
- from: (gaugeopts.range.max * gaugeopts.range.medium) / 100,
2351
- to: gaugeopts.range.max,
2352
- color: '#DF5353', // red
2353
- },
2354
- ],
2355
- },
2356
- pane: isSolidGauge
2357
- ? {
2358
- center: ['50%', '85%'],
2359
- size: '140%',
2360
- startAngle: -90,
2361
- endAngle: 90,
2362
- background: {
2363
- backgroundColor: (highchartsRenderer.highcharts_theme && highchartsRenderer.highcharts_theme .background2) || '#EEE',
2364
- innerRadius: '60%',
2365
- outerRadius: '100%',
2366
- shape: 'arc',
2367
- },
2368
- }
2369
- : {
2370
- startAngle: -150,
2371
- endAngle: 150,
2372
- background: [
2373
- {
2374
- backgroundColor: {
2375
- linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
2376
- stops: [
2377
- [0, CHART_COLORS.BACKGROUND],
2378
- [1, '#333'],
2379
- ],
2380
- },
2381
- borderWidth: 0,
2382
- outerRadius: '109%',
2383
- },
2384
- {
2385
- backgroundColor: {
2386
- linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
2387
- stops: [
2388
- [0, '#333'],
2389
- [1, CHART_COLORS.BACKGROUND],
2390
- ],
2391
- },
2392
- borderWidth: 1,
2393
- outerRadius: '107%',
2394
- },
2395
- {
2396
- // default background
2397
- },
2398
- {
2399
- backgroundColor: '#DDD',
2400
- borderWidth: 0,
2401
- outerRadius: '105%',
2402
- innerRadius: '103%',
2403
- },
2404
- ],
2405
- },
2406
- };
2407
-
2408
- chartOptions.series = highchartsRenderer.ptCreateGaugeSeries(pivotData, opts, chartOptions, gaugeopts, isSolidGauge);
2409
-
2410
- highchartsRenderer.setTitleAndSubTitle(chartOptions, opts, gaugeopts);
2411
- chartOptions.plotOptions.solidgauge = highchartsRenderer.getDataLabelsOptions(gaugeopts, chartOptions.plotOptions.solidgauge);
2412
-
2413
- return highchartsRenderer.ptCreateElementAndDraw(chartOptions, opts);
2414
- };
2415
-
2416
- highchartsRenderer.ptCreateGaugeSeries = (pivotData, opts, chartOptions, gaugeopts, isSolidGauge) => {
2417
- const lineSeries = highchartsRenderer.ptCreateBasicLineSeries(pivotData, null, true, null, null, opts, chartOptions);
2418
-
2419
- let total = [];
2420
- lodash.forEach(lineSeries, (obj) => {
2421
- lodash.forEach(obj.data, (arr2) => {
2422
- total = total.concat(arr2);
2423
- });
2424
- });
2425
- total = lodash.filter(total, value => !isNaN(value));
2426
-
2427
- let aggfunc = (a, b) => a + b;
2428
- let base = 0;
2429
- let __ret = highchartsRenderer.getSingleValueAgg(gaugeopts, aggfunc, base);
2430
-
2431
- aggfunc = __ret.aggfunc;
2432
- base = __ret.base;
2433
-
2434
- const aggregator = pivotData.getAggregator([], []);
2435
- const value = total.length > 0 ? total.reduce(aggfunc, base) : aggregator.value();
2436
- const valueFormatted = lodash.isNumber(value) ? aggregator.format(value, true) : value;
2437
-
2438
- let gaugeSeries = [
2439
- {
2440
- name: '',
2441
- colorByPoint: true,
2442
- data: [value],
2443
- dataLabels: {
2444
- format: `<div style="text-align:center"><span style="font-size:${ isSolidGauge ? 25 : 15 }px;color:black">`
2445
- + valueFormatted + '</span><br/><span style="font-size:12px;color:silver"></span></div>',
2446
- enabled: gaugeopts && gaugeopts.label && !isSolidGauge ? gaugeopts.label.show : true,
2447
- allowOverlap: gaugeopts && gaugeopts.label ? gaugeopts.label.overlap : false,
2448
- style: highchartsRenderer.getDataLabelsStyle(gaugeopts),
2449
- },
2450
- },
2451
- ];
2452
- gaugeSeries[0] = highchartsRenderer.getDataLabelsOptions(gaugeopts, gaugeSeries[0]);
2453
-
2454
- return gaugeSeries;
2455
- };
2456
-
2457
2265
  highchartsRenderer.ptRenderKpi = function (pivotData, opts) {
2458
2266
  var chartOptions = {};
2459
2267
 
@@ -7762,21 +7570,6 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
7762
7570
  axisTooltipTitle: ' Best practice: we recommend no more than one segment.',
7763
7571
  legendTooltipTitle: 'To create a drill-down within this category, drag a field here.',
7764
7572
  },
7765
- 'gauge-solid-chart': {
7766
- name: 'Gauge chart',
7767
- label: 'Gauge',
7768
- title: 'Measures progress toward a goal or a KPI.',
7769
- axisName: 'X-Axis',
7770
- legendName: 'Data Series',
7771
- startedMessage: 'To get started, drag one field to the value section. Best practice: Drag one field to the filter section, and filter as required.',
7772
- },
7773
- 'gauge-chart': {
7774
- name: 'Gauge Speedometer',
7775
- label: 'Gauge Speedometer',
7776
- axisName: 'X-Axis',
7777
- legendName: 'Data Series',
7778
- startedMessage: 'To get started, drag one field to the value section. Best practice: Drag one field to the filter section, and filter as required.',
7779
- },
7780
7573
  [highchartsRenderer.CHART_TYPES.GAUGE_CHART_ENHANCED]: {
7781
7574
  name: 'Gauge chart',
7782
7575
  label: 'Gauge',
@@ -8142,47 +7935,10 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
8142
7935
  name: 'Gauge',
8143
7936
  class: 'google-visualization-charteditor-mini-gauge',
8144
7937
  subtypes: [
8145
- {
8146
- type: 'gauge-solid-chart',
8147
- name: highchartsRenderer.chartsTypesInfo['gauge-solid-chart'].name,
8148
- class: 'google-visualization-charteditor-thumbs-gauge-solid',
8149
- render: highchartsRenderer.ptRenderSolidGauge,
8150
- suboptions: [
8151
- highchartsRenderer.suboptions["value"],
8152
- highchartsRenderer.suboptions["range"],
8153
- highchartsRenderer.suboptions["tooltips"],
8154
- highchartsRenderer.suboptions["subtitle"],
8155
- highchartsRenderer.suboptions["widget_library"],
8156
- highchartsRenderer.suboptions["table_options_transpose"],
8157
- highchartsRenderer.suboptions["table_design_options"],
8158
- highchartsRenderer.suboptions["chart_grid"],
8159
- highchartsRenderer.suboptions["negative_number_format"],
8160
- highchartsRenderer.suboptions["legends"],
8161
- ]
8162
- },
8163
- {
8164
- type: 'gauge-chart',
8165
- name: highchartsRenderer.chartsTypesInfo['gauge-chart'].name,
8166
- class: 'google-visualization-charteditor-thumbs-gauge',
8167
- render: highchartsRenderer.ptRenderGauge,
8168
- suboptions: [
8169
- highchartsRenderer.suboptions["value"],
8170
- highchartsRenderer.suboptions["range"],
8171
- highchartsRenderer.suboptions["tooltips"],
8172
- highchartsRenderer.suboptions["subtitle"],
8173
- highchartsRenderer.suboptions["widget_library"],
8174
- highchartsRenderer.suboptions["table_options_transpose"],
8175
- highchartsRenderer.suboptions["table_design_options"],
8176
- highchartsRenderer.suboptions["chart_grid"],
8177
- highchartsRenderer.suboptions["negative_number_format"],
8178
- highchartsRenderer.suboptions["legends"],
8179
- ]
8180
- },
8181
7938
  {
8182
7939
  type: highchartsRenderer.CHART_TYPES.GAUGE_CHART_ENHANCED,
8183
7940
  name: highchartsRenderer.chartsTypesInfo[highchartsRenderer.CHART_TYPES.GAUGE_CHART_ENHANCED].name,
8184
7941
  class: 'google-visualization-charteditor-thumbs-gauge-solid',
8185
- hidden: true,
8186
7942
  render: highchartsRenderer.ptRenderGaugeEnhanced,
8187
7943
  suboptions: [
8188
7944
  highchartsRenderer.suboptions["label_gauge"],
@@ -8349,166 +8349,6 @@ describe('highcharts_renderer', () => {
8349
8349
  });
8350
8350
  });
8351
8351
 
8352
- describe('Function ptCreateGaugeSeries', () => {
8353
-
8354
- const pivotDataMock = {
8355
- getAggregator: () => ({
8356
- value: () => 1000,
8357
- format: (val) => `formatted(${ val })`,
8358
- })
8359
- }
8360
-
8361
- beforeEach(() => {
8362
- spyOn(highchartsRenderer, 'getSingleValueAgg').and.callFake(
8363
- (_gaugeOpts, aggfunc, base) => ({ aggfunc, base })
8364
- );
8365
- spyOn(highchartsRenderer, 'getDataLabelsStyle').and.returnValue('test_style');
8366
- spyOn(highchartsRenderer, 'getDataLabelsOptions').and.callFake(
8367
- (_gaugeOpts, seriesElement) => ({...seriesElement, additionalOptions: 'test_additional_opts'})
8368
- );
8369
- });
8370
-
8371
- describe('with two calc values', () => {
8372
-
8373
- const mockGaugeOpts = {
8374
- label: {
8375
- overlap: true,
8376
- show: false,
8377
- }
8378
- };
8379
-
8380
- beforeEach(() => {
8381
- spyOn(highchartsRenderer, 'ptCreateBasicLineSeries').and.returnValue([
8382
- {
8383
- data: [39],
8384
- initialName: "Test Calc",
8385
- name: "Test Calc"
8386
- },
8387
- {
8388
- data: [21],
8389
- initialName: "Test Calc 2",
8390
- name: "Test Calc 2"
8391
- }
8392
- ]);
8393
- });
8394
-
8395
- it('should create gauge series, two calc values, isSolidGauge = false, labels disabled', () => {
8396
- expect(highchartsRenderer.ptCreateGaugeSeries(pivotDataMock, {}, {}, mockGaugeOpts, false)).toEqual([
8397
- {
8398
- additionalOptions: 'test_additional_opts',
8399
- colorByPoint: true,
8400
- data: [60],
8401
- dataLabels: {
8402
- allowOverlap: true,
8403
- enabled: false,
8404
- format: '<div style="text-align:center"><span style="font-size:15px;color:black">formatted(60)</span><br/><span style="font-size:12px;color:silver"></span></div>',
8405
- style: 'test_style',
8406
- },
8407
- name: '',
8408
- },
8409
- ]);
8410
- });
8411
-
8412
- it('should create gauge series, two calc values, isSolidGauge = false, labels enabled', () => {
8413
- const gaugeOpts = lodash.cloneDeep(mockGaugeOpts);
8414
- gaugeOpts.label.show = true;
8415
- expect(highchartsRenderer.ptCreateGaugeSeries(pivotDataMock, {}, {}, gaugeOpts, false)).toEqual([
8416
- {
8417
- additionalOptions: 'test_additional_opts',
8418
- colorByPoint: true,
8419
- data: [60],
8420
- dataLabels: {
8421
- allowOverlap: true,
8422
- enabled: true,
8423
- format: '<div style="text-align:center"><span style="font-size:15px;color:black">formatted(60)</span><br/><span style="font-size:12px;color:silver"></span></div>',
8424
- style: 'test_style',
8425
- },
8426
- name: '',
8427
- },
8428
- ]);
8429
- });
8430
-
8431
- it('should create gauge series, two calc values, isSolidGauge = true', () => {
8432
- expect(highchartsRenderer.ptCreateGaugeSeries(pivotDataMock, {}, {}, mockGaugeOpts, true)).toEqual([
8433
- {
8434
- additionalOptions: 'test_additional_opts',
8435
- colorByPoint: true,
8436
- data: [60],
8437
- dataLabels: {
8438
- allowOverlap: true,
8439
- enabled: true,
8440
- format: '<div style="text-align:center"><span style="font-size:25px;color:black">formatted(60)</span><br/><span style="font-size:12px;color:silver"></span></div>',
8441
- style: 'test_style',
8442
- },
8443
- name: '',
8444
- },
8445
- ]);
8446
- });
8447
- });
8448
-
8449
- it('should create gauge series, one calc value', () => {
8450
- const mockGaugeOpts = {
8451
- label: {
8452
- overlap: true,
8453
- show: false,
8454
- }
8455
- };
8456
-
8457
- spyOn(highchartsRenderer, 'ptCreateBasicLineSeries').and.returnValue([
8458
- {
8459
- data: [39],
8460
- initialName: "Test Calc",
8461
- name: "Test Calc"
8462
- },
8463
- ]);
8464
-
8465
- expect(highchartsRenderer.ptCreateGaugeSeries(pivotDataMock, {}, {}, mockGaugeOpts, false)).toEqual([
8466
- {
8467
- additionalOptions: 'test_additional_opts',
8468
- colorByPoint: true,
8469
- data: [39],
8470
- dataLabels: {
8471
- allowOverlap: true,
8472
- enabled: false,
8473
- format: '<div style="text-align:center"><span style="font-size:15px;color:black">formatted(39)</span><br/><span style="font-size:12px;color:silver"></span></div>',
8474
- style: 'test_style',
8475
- },
8476
- name: '',
8477
- },
8478
- ]);
8479
- });
8480
-
8481
- it('should create gauge series, no calculated, one value field', () => {
8482
- const mockGaugeOpts = {
8483
- label: {
8484
- overlap: true,
8485
- show: false,
8486
- }
8487
- };
8488
-
8489
- spyOn(highchartsRenderer, 'ptCreateBasicLineSeries').and.returnValue([
8490
- {
8491
- data: [32605]
8492
- },
8493
- ]);
8494
-
8495
- expect(highchartsRenderer.ptCreateGaugeSeries(pivotDataMock, {}, {}, mockGaugeOpts, false)).toEqual([
8496
- {
8497
- additionalOptions: 'test_additional_opts',
8498
- colorByPoint: true,
8499
- data: [32605],
8500
- dataLabels: {
8501
- allowOverlap: true,
8502
- enabled: false,
8503
- format: '<div style="text-align:center"><span style="font-size:15px;color:black">formatted(32605)</span><br/><span style="font-size:12px;color:silver"></span></div>',
8504
- style: 'test_style',
8505
- },
8506
- name: '',
8507
- },
8508
- ]);
8509
- });
8510
- });
8511
-
8512
8352
  describe('highchartsRenderer.ptRenderPieWithDrillDown', () => {
8513
8353
  beforeEach(() => {
8514
8354
  jest.spyOn(highchartsRenderer, 'ptCreateSeriesToDrillDownChart')
@@ -8869,241 +8709,6 @@ describe('highcharts_renderer', () => {
8869
8709
  });
8870
8710
  });
8871
8711
 
8872
- describe('Function ptRenderGauge', () => {
8873
-
8874
- const pivotDataMock = {
8875
- getColKeys: () => [[1], [2], [3]],
8876
- };
8877
-
8878
- const commonExpectedOptions = {
8879
- chart: { animation: true, type: 'gauge' },
8880
- credits: { enabled: false },
8881
- pane: {
8882
- background: [
8883
- {
8884
- backgroundColor: {
8885
- linearGradient: { x1: 0, x2: 0, y1: 0, y2: 1 },
8886
- stops: [
8887
- [0, '#fff'],
8888
- [1, '#333'],
8889
- ],
8890
- },
8891
- borderWidth: 0,
8892
- outerRadius: '109%',
8893
- },
8894
- {
8895
- backgroundColor: {
8896
- linearGradient: { x1: 0, x2: 0, y1: 0, y2: 1 },
8897
- stops: [
8898
- [0, '#333'],
8899
- [1, '#fff'],
8900
- ],
8901
- },
8902
- borderWidth: 1,
8903
- outerRadius: '107%',
8904
- },
8905
- {},
8906
- { backgroundColor: '#DDD', borderWidth: 0, innerRadius: '103%', outerRadius: '105%' },
8907
- ],
8908
- endAngle: 150,
8909
- startAngle: -150,
8910
- },
8911
- plotOptions: {
8912
- series: { animation: true },
8913
- solidgauge: {
8914
- additionalOptions: 'test_additional_opts',
8915
- allowPointSelect: true,
8916
- cursor: 'pointer',
8917
- dataLabels: { allowOverlap: true, borderWidth: 0, style: 'test_style', useHTML: true, y: 5 },
8918
- },
8919
- },
8920
- series: 'test_gauge_series',
8921
- subtitle: 'test_subtitle',
8922
- title: 'test_title',
8923
- xAxis: { categories: ['formatted(1)', 'formatted(2)', 'formatted(3)'] },
8924
- };
8925
-
8926
- const gaugeDefaultChartOptions = {
8927
- label: {
8928
- overlap: true,
8929
- show: false,
8930
- },
8931
- range: {
8932
- min: 0,
8933
- max: 12345,
8934
- low: 100,
8935
- medium: 200,
8936
- high: 300,
8937
- },
8938
- };
8939
-
8940
- const chartOptionsInOpts = {
8941
- label: {
8942
- overlap: false,
8943
- show: true,
8944
- },
8945
- range: {
8946
- min: 1,
8947
- max: 234567,
8948
- low: 500,
8949
- medium: 800,
8950
- high: 1000,
8951
- },
8952
- };
8953
-
8954
- beforeEach(() => {
8955
- spyOn(highchartsRenderer, 'getDefaultValueForChart').and.returnValue(gaugeDefaultChartOptions);
8956
- spyOn(highchartsRenderer, 'getDataLabelsStyle').and.returnValue('test_style');
8957
- spyOn(highchartsRenderer, 'getDataLabelsOptions').and.callFake(
8958
- (_gaugeOpts, seriesElement) => ({...seriesElement, additionalOptions: 'test_additional_opts'})
8959
- );
8960
- spyOn(highchartsRenderer, 'getFormattedColKeys').and.callFake(
8961
- (pivotData, _keys) => pivotData.getColKeys().map(key => `formatted(${ key })`)
8962
- );
8963
- spyOn(highchartsRenderer, 'ptCreateGaugeSeries').and.returnValue('test_gauge_series');
8964
- spyOn(highchartsRenderer, 'setTitleAndSubTitle').and.callFake((chartOptions, _opts, _gaugeopts) => {
8965
- chartOptions.title = 'test_title';
8966
- chartOptions.subtitle = 'test_subtitle';
8967
- });
8968
- spyOn(highchartsRenderer, 'ptCreateElementAndDraw').and.returnValue();
8969
- });
8970
-
8971
- it('should call ptCreateElementAndDraw with proper options: no chartOptions passed in opts', () => {
8972
- const optsMock = {
8973
- testOptsField: 'test_opts_field_value',
8974
- };
8975
-
8976
- highchartsRenderer.ptRenderGauge(pivotDataMock, lodash.cloneDeep(optsMock));
8977
-
8978
- const expectedChartOptions = {
8979
- ...commonExpectedOptions,
8980
- yAxis: {
8981
- labels: { rotation: 'auto', step: 2 },
8982
- max: 12345,
8983
- min: 0,
8984
- minorTickColor: '#666',
8985
- minorTickInterval: 'auto',
8986
- minorTickLength: 10,
8987
- minorTickPosition: 'inside',
8988
- minorTickWidth: 1,
8989
- plotBands: [
8990
- { color: '#55BF3B', from: 0, to: 12345 },
8991
- { color: '#DDDF0D', from: 12345, to: 24690 },
8992
- { color: '#DF5353', from: 24690, to: 12345 },
8993
- ],
8994
- tickColor: '#666',
8995
- tickLength: 10,
8996
- tickPixelInterval: 30,
8997
- tickPosition: 'inside',
8998
- tickWidth: 2,
8999
- title: { text: '' },
9000
- },
9001
- };
9002
-
9003
- expect(highchartsRenderer.ptCreateGaugeSeries)
9004
- .toHaveBeenCalledWith(pivotDataMock, optsMock, expectedChartOptions, gaugeDefaultChartOptions, false);
9005
- expect(highchartsRenderer.ptCreateElementAndDraw).toHaveBeenCalledWith(expectedChartOptions, optsMock);
9006
- });
9007
-
9008
- it('should call ptCreateElementAndDraw with proper options: chartOptions passed in opts', () => {
9009
- const optsMock = {
9010
- testOptsField: 'test_opts_field_value',
9011
- chartOptions: chartOptionsInOpts,
9012
- };
9013
-
9014
- highchartsRenderer.ptRenderGauge(pivotDataMock, lodash.cloneDeep(optsMock));
9015
-
9016
- const expectedChartOptions = {
9017
- ...commonExpectedOptions,
9018
- yAxis: {
9019
- labels: { rotation: 'auto', step: 2 },
9020
- max: 234567,
9021
- min: 0,
9022
- minorTickColor: '#666',
9023
- minorTickInterval: 'auto',
9024
- minorTickLength: 10,
9025
- minorTickPosition: 'inside',
9026
- minorTickWidth: 1,
9027
- plotBands: [
9028
- { color: '#55BF3B', from: 0, to: 1172835 },
9029
- { color: '#DDDF0D', from: 1172835, to: 1876536 },
9030
- { color: '#DF5353', from: 1876536, to: 234567 },
9031
- ],
9032
- tickColor: '#666',
9033
- tickLength: 10,
9034
- tickPixelInterval: 30,
9035
- tickPosition: 'inside',
9036
- tickWidth: 2,
9037
- title: { text: '' },
9038
- },
9039
- };
9040
- lodash.set(expectedChartOptions, 'plotOptions.solidgauge.dataLabels.allowOverlap', false);
9041
-
9042
- expect(highchartsRenderer.ptCreateGaugeSeries)
9043
- .toHaveBeenCalledWith(pivotDataMock, optsMock, expectedChartOptions, optsMock.chartOptions, false);
9044
- expect(highchartsRenderer.ptCreateElementAndDraw).toHaveBeenCalledWith(expectedChartOptions, optsMock);
9045
- });
9046
-
9047
- it('should call ptCreateElementAndDraw with proper options: for solid gauge', () => {
9048
- const optsMock = {
9049
- testOptsField: 'test_opts_field_value',
9050
- chartOptions: chartOptionsInOpts,
9051
- };
9052
-
9053
- highchartsRenderer.ptRenderGauge(pivotDataMock, lodash.cloneDeep(optsMock), true);
9054
-
9055
- const expectedChartOptions = {
9056
- chart: { animation: true, type: 'solidgauge' },
9057
- credits: { enabled: false },
9058
- pane: {
9059
- background: { backgroundColor: '#fff', innerRadius: '60%', outerRadius: '100%', shape: 'arc' },
9060
- center: ['50%', '85%'],
9061
- endAngle: 90,
9062
- size: '140%',
9063
- startAngle: -90,
9064
- },
9065
- plotOptions: {
9066
- series: { animation: true },
9067
- solidgauge: {
9068
- additionalOptions: 'test_additional_opts',
9069
- allowPointSelect: true,
9070
- cursor: 'pointer',
9071
- dataLabels: { allowOverlap: false, borderWidth: 0, style: 'test_style', useHTML: true, y: 5 },
9072
- },
9073
- },
9074
- series: 'test_gauge_series',
9075
- subtitle: 'test_subtitle',
9076
- title: 'test_title',
9077
- xAxis: { categories: ['formatted(1)', 'formatted(2)', 'formatted(3)'] },
9078
- yAxis: {
9079
- labels: { y: 16 },
9080
- lineWidth: 0,
9081
- max: 234567,
9082
- min: 0,
9083
- minorTickInterval: null,
9084
- stops: [
9085
- [5, '#55BF3B'],
9086
- [8, '#DDDF0D'],
9087
- [10, '#DF5353'],
9088
- ],
9089
- tickPixelInterval: 400,
9090
- tickWidth: 0,
9091
- },
9092
- };
9093
- lodash.set(expectedChartOptions, 'plotOptions.solidgauge.dataLabels.allowOverlap', false);
9094
-
9095
- expect(highchartsRenderer.ptCreateGaugeSeries)
9096
- .toHaveBeenCalledWith(pivotDataMock, optsMock, expectedChartOptions, optsMock.chartOptions, true);
9097
- expect(highchartsRenderer.ptCreateElementAndDraw).toHaveBeenCalledWith(expectedChartOptions, optsMock);
9098
- });
9099
- });
9100
-
9101
- it('ptRenderSolidGauge should call ptRenderGauge with isSolidGauge = true', () => {
9102
- spyOn(highchartsRenderer, 'ptRenderGauge').and.returnValue();
9103
- highchartsRenderer.ptRenderSolidGauge('mock_pivot_data', 'mock_opts');
9104
- expect(highchartsRenderer.ptRenderGauge).toHaveBeenCalledWith('mock_pivot_data', 'mock_opts', true);
9105
- });
9106
-
9107
8712
  describe("Function ptCreateWaterfallBreakdownSeries", () => {
9108
8713
  const format = null;
9109
8714
  const additionalOptionsMock = { testOption: 'test additional option 1' }