高图中的多个直方图会导致第二个直方图的bin间距出现问题?

时间:2018-08-22 18:33:55

标签: highcharts

我试图在同一张图表上绘制两个系列的数据及其对应的直方图。不幸的是,结果是直方图之一的仓之间存在间隙。

任何人都知道如何解决此问题,请记住数据是动态的,因此我不想显式设置任何bin宽度等。

http://jsfiddle.net/uwq9k7Lg/

JS:

Highcharts.chart('container', {
            xAxis: [{
            }, {                
            }, {
            }],
            yAxis: [{
            }, {
            }],
            series: [{
                type: 'histogram',
                xAxis: 2,
                yAxis: 1,
                baseSeries: 's1'
            }, {
                type: 'histogram',
                xAxis: 2,
                yAxis: 1,
                baseSeries: 's2'
            }, {
                id: 's1',
                type: 'scatter',
                data: [1540.05,1532.99,1880.28,1477.81,1585.73,1517.52,1986.31,1469.12,1314.68,1769.32,1438.85,1559.51,1712.68,1539.97,1253.89,1830.8,1496.05,1490.26,1671.14,2442.06,1553.05,1493.59,1563.03,1486.62,1802.82,1373.39,1754.35,1525.61,1546.15,1505.9,1457.14,1800.56,1481.7,1349.72,2125.55,1621.02,1689.52,1685.67,1778.98,1698.82,1921.13,1520.81,1566.14,2372.76,1419.91,1796.7,1621.19,1816.31,1528.85,1342.83,2481.26,1694.68,1657.92,1457.89,1414.73,1857.76,1715.27,1530.2,1553.69,2890.06,1632.14,1419.08,1449.88,1414.45,1600.4,1473.22,1745.77,2536.96,1625.38,1788.98,1502.14,1414.55,1491.99,1389.6,1606.47,1865.12,2281.73,1466.92,1485.69,1492.09,2272.98,1656.43,1562.23,2229.11,1732.37,1466.74,1428.72,1209.87,1459.51,1618.47,1720.35,1660.64,1479.19,1425.42,1549.53,1645.3,1602.82,1608.41,1749.81,1714.55,1679.14,1791.71,1490.59,1928.39,1586.32,1494.97,1550.52,2608.26,1512.23,1804.93,1799.76,2493.59,2105.95,1765.73,1176.89,1789.19,1257.6,1701.47,1445.61,2308.24,1644.9,1590.58,2272.31,1449.72,1802.39,1385.58,1402.27,1562.01,1593.6,1585.58,1351.67,1563.42,1689.95,1332.75,2055.39,1567.86,1918.89,1669.67,1521.49,1936.59,1646.44,1735.57,1512.26,1727.84,1398.51,1437.52,1395.86,1704.65,1691.25,2436.58,1474.62,1971.48,1453.26,1274.71,1908.51]
            }, {
                id: 's2',
                xAxis: 1,
                type: 'scatter',
                data: [1796.39,1819.96,1644.75,1682.29,1664.81,2122.26,1442.42,1748.17,2099.26,1866.1,1466.9,2090.13,1502.34,1760.46,2279.47,1565.06,2104.19,1707.06,1827.82,1989.51,1899.41,1836.86,1633.83,2633.47,1860.75,2582.93,1500.57,2213.11,1417.45,1671.14,2305.97,3002.58,1802.91,1978.37,1914.84,1688.79,1967.32,1622.43,1705.98,1911.45,2040.99,2404.06,1788.33,1540.64,1900.35,1822.32,1995.54,2837.06,1840.97]
            }]
        });

谢谢!

1 个答案:

答案 0 :(得分:0)

只需更改xAxis并设置borderWith:0

...
  xAxis: [{}, {}, {}, {}], // new xAxis
...
{
type: 'histogram',
   xAxis: 3, // Use the new added xAxis
   yAxis: 1,
   baseSeries: 's2',
   borderWidth: 0 // Remove the line around the bins
}

Fiddle