如何在 React JS 中结合 HighStock 股票图表和 HighCharts 气泡图？答案

【问题标题】：How to combine HighStock stock-chart and HighCharts bubble-chart in React JS?如何在 React JS 中结合 HighStock 股票图表和 HighCharts 气泡图？
【发布时间】：2018-10-11 12:02:06
【问题描述】：

股票图表：Stock chart link

气泡图：Bubble chart link

highcharts组合2个图表的方式：Combining 2 charts

问题是我可以分别渲染每一个，但我希望它们显示在同一个图表中，其中包含股票图表和气泡图，位于如下所示的同一位置。

请建议我以与所示相同的方式合并这两个图表或另一种实现此类图表的方法（此图表具有 -ve 和 +ve X 轴和 +ve Y 轴带有显示一些数据的标签）。

【问题讨论】：

标签： javascript reactjs charts highcharts

【解决方案1】：

只需设置两个不同的系列类型：

Highcharts.stockChart('container', {
    series: [{
        type: 'line',
        data: [1, 2, 3, 4, 5]
    }, {
        type: 'bubble',
        data: [
            [1, 2, 3],
            [2, 2, 2]
        ]
    }]
});

现场演示：http://jsfiddle.net/BlackLabel/g0wvpsx4/

【讨论】：

感谢您的洞察力。能否请您指导我如何根据需要操纵 Highstock 图表中的时间？
您好 Prakhar Mittal，我当然会尽力帮助您，但我必须知道您的要求是什么。可能您必须设置正确的 x 数据值：api.highcharts.com/highcharts/series.bubble.data.x
我需要的是使用日期选择器从任何反应库中删除日期的默认文本输入。
删除默认日期输入将inputEnabled 属性设置为false。要应用来自其他输入的日期，请使用 setExtremes 方法。现场示例：jsfiddle.net/BlackLabel/qsgyahfz
非常感谢！！这就是我所需要的。感谢所有的帮助和指导。