CODEWITHSUNDEEP
angularjshighchartsjstockchart
Sunny
Sunny

Reputation: 277

Is there a way to use some of the highcharts-stocktools-toolbar items?

Sample toolbar functionn needed

I am able to remove the parts of toolbar by not adding them in my directive via 

stockTools: {gui: {
enabled: true,
buttons: ['separator', 'measure', 'toggleAnnotations', 'separator', 'flags', 'separator','zoomChange', 'fullScreen', 'separator', 

/*'lines', 'crookedLines', 'simpleShapes', 'verticalLabels'*/

]

But in measure, I want only measureX, not measureY and measure XY. Is there a way to include subparts of the toolbar items rather than removing them in stock-tools.js.

Upvotes: 1

Views: 494

Answers (1)

ppotaczek
ppotaczek

Reputation: 39119

You should be able to define signle item in stock tools definitions, but there is a bug in Highcharts, which is reported here: https://github.com/highcharts/highcharts/issues/10980

As a workaround, you can define the first element as an empty: items: [, 'measureX']

or create your own button, instead of removing items from the list:

{
  ..., 
  stockTools: {
    gui: {
      buttons: ['indicators', 'separator', 'simpleShapes', 'lines', 'crookedLines', 'myMeasure', 'advanced', 'toggleAnnotations', 'separator', 'verticalLabels', 'flags', 'separator', 'zoomChange', 'fullScreen', 'typeChange', 'separator', 'currentPriceIndicator', 'saveChart'],
      definitions: {
        myMeasure: {
          className: 'highcharts-measure-x',
          symbol: 'measure-x.svg'
        }
      }
    }
  },

  navigation: {
    bindings: {
      myMeasure: Highcharts.getOptions().navigation.bindings.measureX
    }
  },
  ...
}

Live demo: https://jsfiddle.net/BlackLabel/mrj6badh/

API Reference: https://api.highcharts.com/highstock/stockTools.gui.definitions.measure.items

Upvotes: 1

Related Questions