2014-10-29 41 views
0

我一直在爲Highcharts 2.x編寫的舊代碼的工作。這是工作罰款3.0,但移動到4.0時,我們看到了這個怪異的行爲:從highcharts 3.0移動到4.0:分組列奇怪的行爲

http://jsfiddle.net/pfofo973/2/

正如你所看到的,在X軸上有兩個堆疊列每個時期。問題是第一列沒有碰到X軸,但在它下面有一些填充。任何想法如何糾正?

謝謝!

這裏是JS代碼:

chart = new Highcharts.Chart({ 
    "chart": { 
     "renderTo": "container", 
     "defaultSeriesType": "column", 
     "marginTop": 100, 
     "marginBottom": 20, 
     "zoomType": "x", 
     "spacingRight": 20 
    }, 
    "title": { 
     "text": "Activity Overview" 
    }, 
    "subtitle": { 
     "text": "Grouped per week" 
    }, 
    "xAxis": { 
     "type": "datetime", 
     "tickInterval": 604800000, 
     "tickWidth": 0, 
     "maxZoom": 1209600000, 
     "x": -30, 
     "labels": {} 
    }, 
    "yAxis": [ 
     { 
      "title": { 
       "text": "Days" 
      }, 
      "endOnTick": false, 
      "maxPadding": 1, 
      "categories": [], 
      "index": 0 
     }, 
     { 
      "gridLineWidth": 0, 
      "maxPadding": 1, 
      "categories": [], 
      "title": { 
       "text": "Number", 
       "style": { 
        "color": "#AA4643" 
       } 
      }, 
      "labels": { 
       "style": { 
        "color": "#AA4643" 
       } 
      }, 
      "opposite": true, 
      "index": 1 
     }, 
     { 
      "gridLineWidth": 0, 
      "maxPadding": 0.8, 
      "endOnTick": false, 
      "lineWidth": 0, 
      "categories": [], 
      "opposite": true, 
      "tickLength": 0, 
      "max": 300, 
      "title": { 
       "text": "" 
      }, 
      "labels": { 
       "text": "" 
      }, 
      "index": 2 
     }, 
     { 
      "gridLineWidth": 0, 
      "endOnTick": false, 
      "minPadding": 6, 
      "maxPadding": 0.5, 
      "lineWidth": 0, 
      "opposite": true, 
      "tickLength": 0, 
      "max": 100, 
      "min": 50, 
      "categories": [], 
      "title": { 
       "text": "" 
      }, 
      "labels": { 
       "text": "" 
      }, 
      "index": 3 
     } 
    ], 
    "legend": { 
     "align": "left", 
     "verticalAlign": "top", 
     "y": 40, 
     "floating": true, 
     "borderWidth": 0 
    }, 
    "tooltip": { 
     "shared": true, 
     "crosshairs": true, 
     "useHTML": true 
    }, 
    "plotOptions": { 
     "column": { 
      "stacking": "normal" 
     }, 
     "spline": { 
      "lineWidth": 1, 
      "dashStyle": "ShortDot", 
      "marker": { 
       "enabled": false, 
       "states": { 
        "hover": { 
         "enabled": true, 
         "radius": 4 
        } 
       } 
      } 
     } 
    }, 
    "series": [ 
     { 
      "name": "c1", 
      "stack": "survey", 
      "yAxis": 0, 
      "data": [ 
       [ 
        1406444400000, 
        7.3 
       ], 
       [ 
        1407049200000, 
        8.2 
       ], 
       [ 
        1407654000000, 
        7.8 
       ], 
       [ 
        1408258800000, 
        8.9 
       ], 
       [ 
        1408863600000, 
        6.7 
       ], 
       [ 
        1409468400000, 
        8 
       ], 
       [ 
        1410073200000, 
        8.4 
       ], 
       [ 
        1410678000000, 
        6.5 
       ], 
       [ 
        1411282800000, 
        6.6 
       ], 
       [ 
        1411887600000, 
        4.9 
       ], 
       [ 
        1412492400000, 
        1.8 
       ] 
      ], 
      "_colorIndex": 0 
     }, 
     { 
      "name": "R1", 
      "stack": "survey", 
      "yAxis": 0, 
      "data": [ 
       [ 
        1406444400000, 
        4.2 
       ], 
       [ 
        1407049200000, 
        3.9 
       ], 
       [ 
        1407654000000, 
        3.9 
       ], 
       [ 
        1408258800000, 
        5.3 
       ], 
       [ 
        1408863600000, 
        3.2 
       ], 
       [ 
        1409468400000, 
        4.4 
       ], 
       [ 
        1410073200000, 
        3.1 
       ], 
       [ 
        1410678000000, 
        2.8 
       ], 
       [ 
        1411282800000, 
        2.8 
       ], 
       [ 
        1411887600000, 
        2.2 
       ], 
       [ 
        1412492400000, 
        0.9 
       ] 
      ], 
      "_colorIndex": 1 
     }, 
     { 
      "name": "A1", 
      "stack": "survey", 
      "yAxis": 0, 
      "data": [ 
       [ 
        1406444400000, 
        1.8 
       ], 
       [ 
        1407049200000, 
        1.7 
       ], 
       [ 
        1407654000000, 
        1.5 
       ], 
       [ 
        1408258800000, 
        0.9 
       ], 
       [ 
        1408863600000, 
        1.7 
       ], 
       [ 
        1409468400000, 
        1.3 
       ], 
       [ 
        1410073200000, 
        1.3 
       ], 
       [ 
        1410678000000, 
        1.9 
       ], 
       [ 
        1411282800000, 
        1.2 
       ], 
       [ 
        1411887600000, 
        1.2 
       ], 
       [ 
        1412492400000, 
        0.4 
       ] 
      ], 
      "_colorIndex": 2 
     }, 
     { 
      "name": "Nb R", 
      "type": "spline", 
      "color": "#AA4643", 
      "yAxis": 1, 
      "data": [ 
       [ 
        1406444400000, 
        3.7 
       ], 
       [ 
        1407049200000, 
        3.8 
       ], 
       [ 
        1407654000000, 
        4.1 
       ], 
       [ 
        1408258800000, 
        4.1 
       ], 
       [ 
        1408863600000, 
        3.6 
       ], 
       [ 
        1409468400000, 
        3.8 
       ], 
       [ 
        1410073200000, 
        3.8 
       ], 
       [ 
        1410678000000, 
        3.5 
       ], 
       [ 
        1411282800000, 
        3.8 
       ], 
       [ 
        1411887600000, 
        3.3 
       ], 
       [ 
        1412492400000, 
        3.1 
       ] 
      ], 
      "_symbolIndex": 0 
     }, 
     { 
      "name": "P", 
      "stack": "rater", 
      "stacking": "percent", 
      "color": "#64E572", 
      "yAxis": 2, 
      "showInLegend": false, 
      "data": [ 
       [ 
        1406444400000, 
        34.55 
       ], 
       [ 
        1407049200000, 
        23.84 
       ], 
       [ 
        1407654000000, 
        38.58 
       ], 
       [ 
        1408258800000, 
        27.78 
       ], 
       [ 
        1408863600000, 
        34.07 
       ], 
       [ 
        1409468400000, 
        33.75 
       ], 
       [ 
        1410073200000, 
        38.71 
       ], 
       [ 
        1410678000000, 
        38.07 
       ], 
       [ 
        1411282800000, 
        31.35 
       ], 
       [ 
        1411887600000, 
        27.95 
       ], 
       [ 
        1412492400000, 
        30 
       ] 
      ] 
     }, 
     { 
      "name": "S", 
      "stack": "rater", 
      "stacking": "percent", 
      "color": "#508432", 
      "yAxis": 2, 
      "showInLegend": false, 
      "data": [ 
       [ 
        1406444400000, 
        49.09 
       ], 
       [ 
        1407049200000, 
        49.01 
       ], 
       [ 
        1407654000000, 
        44.67 
       ], 
       [ 
        1408258800000, 
        50.56 
       ], 
       [ 
        1408863600000, 
        49.12 
       ], 
       [ 
        1409468400000, 
        51.25 
       ], 
       [ 
        1410073200000, 
        46.08 
       ], 
       [ 
        1410678000000, 
        42.64 
       ], 
       [ 
        1411282800000, 
        51.89 
       ], 
       [ 
        1411887600000, 
        56.52 
       ], 
       [ 
        1412492400000, 
        61.67 
       ] 
      ] 
     }, 
     { 
      "name": "Su", 
      "stack": "rater", 
      "stacking": "percent", 
      "color": "#058DC7", 
      "yAxis": 2, 
      "showInLegend": false, 
      "data": [ 
       [ 
        1406444400000, 
        3.64 
       ], 
       [ 
        1407049200000, 
        4.64 
       ], 
       [ 
        1407654000000, 
        1.52 
       ], 
       [ 
        1408258800000, 
        7.22 
       ], 
       [ 
        1408863600000, 
        3.98 
       ], 
       [ 
        1409468400000, 
        3.75 
       ], 
       [ 
        1410073200000, 
        0.92 
       ], 
       [ 
        1410678000000, 
        3.55 
       ], 
       [ 
        1411282800000, 
        3.24 
       ], 
       [ 
        1411887600000, 
        2.48 
       ], 
       [ 
        1412492400000, 
        3.33 
       ] 
      ] 
     }, 
     { 
      "name": "F", 
      "stack": "rater", 
      "stacking": "percent", 
      "color": "#24CBE5", 
      "yAxis": 2, 
      "showInLegend": false, 
      "data": [ 
       [ 
        1406444400000, 
        6.36 
       ], 
       [ 
        1407049200000, 
        10.6 
       ], 
       [ 
        1407654000000, 
        8.63 
       ], 
       [ 
        1408258800000, 
        6.11 
       ], 
       [ 
        1408863600000, 
        3.54 
       ], 
       [ 
        1409468400000, 
        3.13 
       ], 
       [ 
        1410073200000, 
        4.15 
       ], 
       [ 
        1410678000000, 
        5.08 
       ], 
       [ 
        1411282800000, 
        3.24 
       ], 
       [ 
        1411887600000, 
        6.83 
       ], 
       [ 
        1412492400000, 
        1.67 
       ] 
      ] 
     }, 
     { 
      "name": "Pr", 
      "stack": "rater", 
      "stacking": "percent", 
      "color": "#DDDF00", 
      "yAxis": 2, 
      "showInLegend": false, 
      "data": [ 
       [ 
        1406444400000, 
        null 
       ], 
       [ 
        1407049200000, 
        4.64 
       ], 
       [ 
        1407654000000, 
        1.02 
       ], 
       [ 
        1408258800000, 
        null 
       ], 
       [ 
        1408863600000, 
        0.88 
       ], 
       [ 
        1409468400000, 
        3.13 
       ], 
       [ 
        1410073200000, 
        2.3 
       ], 
       [ 
        1410678000000, 
        null 
       ], 
       [ 
        1411282800000, 
        null 
       ], 
       [ 
        1411887600000, 
        1.24 
       ], 
       [ 
        1412492400000, 
        null 
       ] 
      ] 
     }, 
     { 
      "name": "Cl", 
      "stack": "rater", 
      "stacking": "percent", 
      "color": "#ED5618", 
      "yAxis": 2, 
      "showInLegend": false, 
      "data": [ 
       [ 
        1406444400000, 
        null 
       ], 
       [ 
        1407049200000, 
        null 
       ], 
       [ 
        1407654000000, 
        1.02 
       ], 
       [ 
        1408258800000, 
        2.22 
       ], 
       [ 
        1408863600000, 
        0.44 
       ], 
       [ 
        1409468400000, 
        0.63 
       ], 
       [ 
        1410073200000, 
        0.92 
       ], 
       [ 
        1410678000000, 
        2.03 
       ], 
       [ 
        1411282800000, 
        1.08 
       ], 
       [ 
        1411887600000, 
        null 
       ], 
       [ 
        1412492400000, 
        null 
       ] 
      ] 
     }, 
     { 
      "name": "Other", 
      "stack": "rater", 
      "stacking": "percent", 
      "color": "#FF9655", 
      "yAxis": 2, 
      "showInLegend": false, 
      "data": [ 
       [ 
        1406444400000, 
        6.36 
       ], 
       [ 
        1407049200000, 
        7.28 
       ], 
       [ 
        1407654000000, 
        4.57 
       ], 
       [ 
        1408258800000, 
        6.11 
       ], 
       [ 
        1408863600000, 
        7.96 
       ], 
       [ 
        1409468400000, 
        4.38 
       ], 
       [ 
        1410073200000, 
        6.91 
       ], 
       [ 
        1410678000000, 
        8.63 
       ], 
       [ 
        1411282800000, 
        9.19 
       ], 
       [ 
        1411887600000, 
        4.97 
       ], 
       [ 
        1412492400000, 
        3.33 
       ] 
      ] 
     }, 
     { 
      "type": "line", 
      "name": "QoH", 
      "yAxis": 3, 
      "data": [ 
       [ 
        1406444400000, 
        96.5 
       ], 
       [ 
        1407049200000, 
        96.2 
       ], 
       [ 
        1407654000000, 
        94.7 
       ], 
       [ 
        1408258800000, 
        95.9 
       ], 
       [ 
        1408863600000, 
        95.1 
       ], 
       [ 
        1409468400000, 
        95.3 
       ], 
       [ 
        1410073200000, 
        96.3 
       ], 
       [ 
        1410678000000, 
        94.4 
       ], 
       [ 
        1411282800000, 
        96.6 
       ], 
       [ 
        1411887600000, 
        96.8 
       ], 
       [ 
        1412492400000, 
        98.1 
       ] 
      ], 
      "_colorIndex": 3, 
      "_symbolIndex": 1 
     } 
    ] 
}); 
+0

在小提琴中看起來不錯。沒有填充可以看到 – Strikers 2014-10-30 06:13:10

+0

在這裏相同,使用最新的FF。 – jlbriggs 2014-10-30 12:55:58

+0

jsfiddle鏈接是錯誤的。我已經用正確的版本更新了它 – jean 2014-10-30 15:44:09

回答

1

這是因爲左Y軸在該水平爲0。 要修復它,您可以設置爲該軸的

startOnTick: false, 
min: 0.5 

例如:http://jsfiddle.net/pfofo973/4/