2017-03-06 6 views
0

スタックされた列を使用でき、正しく機能することはわかっていますが、スタックされていない列は互いに重なり合っています。しかし〜がある!空白があってもハイストックス列が重なっています

this jsfiddleを参照してください。私は私が探しています何の一種である面積シリーズ(価格)、その後、私はthis jsffidleを得るを削除した場合(ただし、価格シリーズを追加):

new Highcharts.stockChart({"credits":{"href":"","text":""},"chart":{"zoomType":"xy","renderTo":"researchChartComponentChartContainer62082951"},"yAxis":[{"opposite":true,"title":{"text":"Price"},"labels":{"format":"{value}"},"height":"100%"},{"opposite":false,"title":{"text":"Millions"},"labels":{"format":"{value}"},"height":"100%"},{"opposite":false,"title":{"text":"Margin %"},"labels":{"format":"{value}"},"height":"100%"}],"tooltip":{"valueDecimals":2,"shared":false},"xAxis":{"title":{"text":"Time"},"type":"datetime"},"exporting":{"enabled":true},"plotOptions":{"series":{"animation":false,"marker":{"enabled":false,"states":{"hover":{"enabled":true}},"radius":4}}},"legend":{"enabled":true,"floating":false},"scrollbar":{"liveRedraw":false},"title":{"text":""},"rangeSelector":{"selected":12,"inputEnabled":true,"buttons": 

    [ 
{ 
    type: 'day', 
    count: 1, 
    text: '1d' 
}, { 
    type: 'day', 
    count: 5, 
    text: '5d' 
}, { 
    type: 'month', 
    count: 1, 
    text: '1m' 
}, { 
    type: 'month', 
    count: 3, 
    text: '3m' 
}, { 
    type: 'month', 
    count: 6, 
    text: '6m' 
}, { 
    type: 'ytd', 
    text: 'YTD' 
}, { 
    type: 'year', 
    count: 1, 
    text: '1y' 
}, { 
    type: 'year', 
    count: 2, 
    text: '2y' 
}, { 
    type: 'year', 
    count: 3, 
    text: '3y' 
}, { 
    type: 'year', 
    count: 4, 
    text: '4y' 
}, { 
    type: 'year', 
    count: 5, 
    text: '5y' 
}, { 
    type: 'year', 
    count: 8, 
    text: '8y' 
}, { 
    type: 'all', 
    text: 'All' 
}] 



    },"navigator":{"adaptToUpdatedData":false,"series":{ id: 'navigator' }},"series":[{"name":"Gross Margin","yAxis":2,"index":0,"id":"Gross Margin","type":"line","data":[[1199059200000,51.12],[1230681600000,52.86],[1262217600000,41.57],[1293753600000,56.3],[1325289600000,59.17],[1356912000000,45.46],[1388448000000,48.16],[1419984000000,33.23],[1451520000000,19.9]]},{"name":"Net Margin","yAxis":2,"index":1,"id":"Net Margin","type":"line","data":[[1199059200000,35.71],[1230681600000,35.32],[1262217600000,23.41],[1293753600000,36.71],[1325289600000,37.94],[1356912000000,11.72],[1388448000000,1.25],[1419984000000,1.75],[1451520000000,-47.36]]},{"name":"EBITDA","yAxis":1,"index":2,"id":"EBITDA","type":"column","data":[[1199059200000,16264.0],[1230681600000,19759.0],[1262217600000,10301.0],[1293753600000,24955.0],[1325289600000,34160.0],[1356912000000,13564.0],[1388448000000,19213.0],[1419984000000,11466.0],[1451520000000,-2102.0],[1483142400000,10539.0]],"pointWidth":10},{"name":"Common Net Inc","yAxis":1,"index":3,"id":"Common Net Inc","type":"column","data":[[1199059200000,11825.0],[1230681600000,13218.0],[1262217600000,5456.0],[1293753600000,17264.0],[1325289600000,22795.0],[1356912000000,5454.0],[1388448000000,584.0],[1419984000000,657.0],[1451520000000,-12129.0],[1483142400000,3982.0]],"pointWidth":10},{"name":"CFO","yAxis":1,"index":4,"id":"CFO","type":"column","data":[[1199059200000,11012.0],[1230681600000,17114.0],[1262217600000,7136.0],[1293753600000,19183.0],[1325289600000,23458.0],[1356912000000,16135.0],[1388448000000,14792.0],[1419984000000,12807.0],[1451520000000,4491.0],[1483142400000,6581.0]],"pointWidth":10},{"name":"Simple FCF","yAxis":1,"index":5,"id":"Simple FCF","type":"column","data":[[1199059200000,4361.0],[1230681600000,8142.0],[1262217600000,-960.0],[1293753600000,6536.0],[1325289600000,7596.0],[1356912000000,813.0],[1388448000000,1687.0],[1419984000000,994.0],[1451520000000,-3880.0],[1483142400000,1630.0]],"pointWidth":10},{"name":"Revenues","yAxis":1,"index":6,"id":"Revenues","type":"column","data":[[1199059200000,33115.0],[1230681600000,37426.0],[1262217600000,23311.0],[1293753600000,47029.0],[1325289600000,60075.0],[1356912000000,46553.0],[1388448000000,46767.0],[1419984000000,37539.0],[1451520000000,25609.0],[1483142400000,27488.0]],"pointWidth":10}]}) 
+0

です。それが 'pointRange'の問題のように私に見えます。非常に狭い範囲のx軸値に複数の列を表示しようとしていますが、これは分類された縦棒グラフと同じように機能しません。基本的には、データをまとめて表示するという2つのパラダイムを強制しようとしています。系列の列には非常にタイトなシーケンシャルデータポイントがあり、グループ化された幅広いカテゴリの列があります。別々のx軸に分割する必要があるかもしれません。 – jlbriggs

+0

あなたはpointWidthをハードコードしました - それを削除して、カラムは重複しません - http://jsfiddle.net/srmquo4s/1/ – morganfree

答えて

0

あなたは0

に手動でボタンの位置を設定してみてください可能性がありここ
"buttonPosition": { 
       x: 0 
     }, 

は、あなたが読みやすいと使用可能で、コードのクリーンバージョンを提供する場合を助けるために多くの方が簡単だろうフルフォーマットさフィドルhttp://jsfiddle.net/pm30yuum/2/

関連する問題