Сочетание индикатора Highcharts с диаграммой области

Question

Я собираюсь объединить датчик высоких диаграмм с неполярной диаграммой, такой как площадь.Я создал два отдельных набора осей x и y и две панели и назначил их для соответствующей серии.

pane: [undefined,
  {
    startAngle: -90,
    endAngle: 90,
    background: null,
    size: "50%",
    center: ["80%", "75%"]
  }
],
xAxis: [{
    type: "datetime",
    pane: 0
  },
  {
    pane: 1
  }
],
yAxis: [{
    title: {
      text: "Views"
    },
    min: 0,
    pane: 0,
    type: "linear"
  },
  {
    pane: 1,
    labels: {
      enabled: false
    },
    tickPositions: [],
    minorTickLength: 0,
    min: -10,
    max: 10,
    plotBands: [{
      from: -10,
      to: 3,
      color: 'rgb(192, 0, 0)', // red
      thickness: '50%'
    }, {
      from: 3,
      to: 5,
      color: 'rgb(255, 192, 0)', // yellow
      thickness: '50%'
    }, {
      from: 5,
      to: 10,
      color: 'rgb(155, 187, 89)', // green
      thickness: '50%'
    }]
  }
]

К сожалению, такое ощущение, что настройка chart.polar применяется исключительно куровень диаграммы, а не по сериям.Это приводит к тому, что диаграмма либо будет полярной для всех панелей и осей, показывая датчик правильно, но неверно, или не полярно, отображая площадь, но не датчик.

Есть ли способ объединить датчик(или любую полярную диаграмму для высоких карт в этом отношении) и неполярную диаграмму для высоких диаграмм, такую ​​как площадь в одной диаграмме?Или я застрял, создав две диаграммы и перекрывая div?

JSFiddle с активным датчиком, генерирует 2 датчика из данных: https://jsfiddle.net/stefaniev/jbx6cwLz/12/

series: [{
    name: "Series 1",
    data: [....],
    type: "area",
    "color": "rgba(240,240,240,0.01)",
    "pointStart": 1542153600000,
    "pointInterval": 900000,
    yAxis: 0,
    xAxis: 0
  },
  {
    "name": "Series 2",
    "data": [....],
    "type": "area",
    "color": "#09C98D",
    "pointStart": 1542153600000,
    "pointInterval": 900000,
    yAxis: 0,
    xAxis: 0
  },
  {
    type: 'gauge',
    name: 'Doing poorly',
    yAxis: 1,
    xAxis: 1,
    data: [-3]
  }
]

Тот же JSFiddle, но с закомментированной серией датчиков, диаграмма области отображает правильно: https://jsfiddle.net/stefaniev/jbx6cwLz/13/

series: [{
    name: "Series 1",
    data: [....],
    type: "area",
    "color": "rgba(240,240,240,0.01)",
    "pointStart": 1542153600000,
    "pointInterval": 900000,
    yAxis: 0,
    xAxis: 0
  },
  {
    "name": "Series 2",
    "data": [....],
    "type": "area",
    "color": "#09C98D",
    "pointStart": 1542153600000,
    "pointInterval": 900000,
    yAxis: 0,
    xAxis: 0
  },
 /* {
    type: 'gauge',
    name: 'Doing poorly',
    yAxis: 1,
    xAxis: 1,
    data: [-3]
  }*/
]

Любая помощь или советы будут оценены!

Answer 1

...

К сожалению, похоже, что применяется настройка chart.polar исключительно на уровне графика, а не по серии (...)

Да, вы правы. На этой же диаграмме нельзя использовать polar и другие типы диаграмм. Ниже вы можете найти пример того, как создавать эти типы диаграмм в отдельных контейнерах:

Highcharts.chart('container1', {
    series: [{
        data: [43934, 52503, 57177, 69658, 97031, 119931, 137133, 154175]
    }]
});

Highcharts.chart('container2', {
    chart: {
        type: 'gauge',
        height: 200,
        width: 200,
        backgroundColor: 'rgba(0,0,0,0)'
    },
    credits: {
        enabled: false
    },
    title: {
        text: ''
    },
    yAxis: {
        min: 0,
        max: 200
    },
    pane: {
        startAngle: -150,
        endAngle: 150
    },
    series: [{
        data: [110]
    }]
});

Демонстрация в реальном времени: http://jsfiddle.net/BlackLabel/n54k3cpL/