конфигурация маркеров в старших графиках

Question

С использованием диаграммы маркеров, как показано ниже, используя Highcharts:

https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/demo/bullet-graph

• Возможно ли иметь более одного целевого значения?
  Мы пытаемся отслеживать множество целей против определенного бара.
• Как вы меняете ширину полосы? Кажется, я не могу найти настройки, есть настройки для цели, но я не могу найти правильные для панели.

Вот код диаграммы:

Highcharts.chart('container1', {
    chart: {
        marginTop: 40
    },
    title: {
        text: '2017 YTD'
    },
    xAxis: {
        categories: ['<span class="hc-cat-title">Revenue</span><br/>U.S. $ (1,000s)']
    },
    yAxis: {
        plotBands: [{
            from: 0,
            to: 150,
            color: '#666'
        }, {
            from: 150,
            to: 225,
            color: '#999'
        }, {
            from: 225,
            to: 9e9,
            color: '#bbb'
        }],
        title: null
    },
    series: [{
        data: [{
            y: 275,
            target: 250
        }]
    }],
    tooltip: {
        pointFormat: '<b>{point.y}</b> (with target at {point.target})'
    }
});

Answer 1

В Highcharts нет такой функции, чтобы добавить две цели, но, сделав несколько хитрых переопределений функции-прототипа серии drawPoints, вы можете добиться ожидаемого эффекта. Вот пример его использования: http://jsfiddle.net/BlackLabel/6wvbc1kb/

После применения этого переопределения вы сможете установить поле minTarget внутри вашего точечного объекта. Затем на графике появится второй целевой индикатор.

Answer 2

Возможно ли иметь более одного целевого значения?

Да, но в этом случае у вас будет несколько осей. Вы не можете иметь несколько целей на одной оси, так как target принимает только целое число. Для этого вы можете добавить дополнительные данные в series, например:

series: [{
    data: [{
        y: 275,
        target: 250,
    }, {
        y: 275,
        target: 240,
    }]
}]

Документация
Метка на оси xAxis может быть установлена ​​путем добавления текста в массиве 'groups':

categories: [
    '<span class="hc-cat-title">Revenue</span><br/>U.S. $ (1,000s)',
    '<span class="hc-cat-title">Profit</span><br/>U.S. $ (1,000s)'
]

Как изменить ширину полосы

Это можно сделать, установив свойство pointWidth, например:

plotOptions: {
    series: {
        pointWidth: 15
    }
}

Вы можете увидеть это jsFiddle с этими настройками.