Highchart (wykres kolumnowy): kilka etykiet danych nie pojawia się w przypadku serii

Tworzę wykres kolumnowy za pomocą wykresów wysokiej jakości - nie mogę wyświetlić wszystkich etykiet danych dla wszystkich serii na wykresie. Mam dwie serie na wykresie kolumnowym, podczas gdy pierwsza seria pokazuje wszystkie etykiety danych, druga seria nie wyświetla kilku etykiet danych podczas wyświetlania innych.Highchart (wykres kolumnowy): kilka etykiet danych nie pojawia się w przypadku serii

Szybka pomoc zostanie wysoko oceniona.

Proszę odnieść się do Fiddle Sample, aby mieć ręce.

"chart": { 
     "type": "column", 
     "plotShadow": false, 
     "polar": false, 
     "renderTo": "" 
    }, 
    "credits": { 
     "enabled": false 
    }, 
    "title": { 
     "text": "" 
    }, 
    "xAxis": { 
     "categories": ["Category 1", "Category 2", "Category 3", "Category 4", "Category 5", "Category 6", "Category 7", "Category 8", "Category 9"], 
     "labels": { 
      "enabled": true, 
      "style": { 
       "fontSize": "8px", 
       "fontFamily": "Arial" 
      } 
     }, 
     "lineWidth": 1, 
     "tickWidth": 0, 
     "title": { 
      "text": "", 
      "style": { 
       "fontFamily": "Arial" 
      } 
     } 
    }, 
    "yAxis": { 
     "lineWidth": 1, 
     "title": { 
      "text": "", 
      "style": { 
       "fontFamily": "Arial" 
      } 
     }, 
     "gridLineWidth": 0, 
     "labels": { 
      "enabled": true, 
      "format": "{value:.0f}", 
      "style": { 
       "fontSize": "8px", 
       "fontFamily": "Arial" 
      } 
     }, 
     "startOnTick": true, 
     "endOnTick": true 
    }, 
    "series": [{ 
     "name": "Company Value", 
     "data": [{ 
      "name": "Adidas Group", 
      "color": "#f1b11d", 
      "y": 63.0, 
      "showInLegend": false, 
      "dataLabels": { 
       "align": "center", 
       "enabled": true, 
       "borderColor": "", 
       "rotation": 0, 
       "style": { 
        "fontSize": "8px", 
        "fontFamily": "Arial" 
       } 
      }, 
      "borderColor": "#ffffff", 
      "enableMouseTracking": false, 
      "sliced": false, 
      "selected": false 
     }, { 
      "name": "Adidas Group", 
      "color": "#f1b11d", 
      "y": 24.0, 
      "showInLegend": false, 
      "dataLabels": { 
       "align": "center", 
       "enabled": true, 
       "borderColor": "", 
       "rotation": 0, 
       "style": { 
        "fontSize": "8px", 
        "fontFamily": "Arial" 
       } 
      }, 
      "borderColor": "#ffffff", 
      "enableMouseTracking": false, 
      "sliced": false, 
      "selected": false 
     }, { 
      "name": "Adidas Group", 
      "color": "#f1b11d", 
      "y": 177.0, 
      "showInLegend": false, 
      "dataLabels": { 
       "align": "center", 
       "enabled": true, 
       "borderColor": "", 
       "rotation": 0, 
       "style": { 
        "fontSize": "8px", 
        "fontFamily": "Arial" 
       } 
      }, 
      "borderColor": "#ffffff", 
      "enableMouseTracking": false, 
      "sliced": false, 
      "selected": false 
     }, { 
      "name": "Adidas Group", 
      "color": "#f1b11d", 
      "y": 197.0, 
      "showInLegend": false, 
      "dataLabels": { 
       "align": "center", 
       "enabled": true, 
       "borderColor": "", 
       "rotation": 0, 
       "style": { 
        "fontSize": "8px", 
        "fontFamily": "Arial" 
       } 
      }, 
      "borderColor": "#ffffff", 
      "enableMouseTracking": false, 
      "sliced": false, 
      "selected": false 
     }, { 
      "name": "Adidas Group", 
      "color": "#f1b11d", 
      "y": 224.0, 
      "showInLegend": false, 
      "dataLabels": { 
       "align": "center", 
       "enabled": true, 
       "borderColor": "", 
       "rotation": 0, 
       "style": { 
        "fontSize": "8px", 
        "fontFamily": "Arial" 
       } 
      }, 
      "borderColor": "#ffffff", 
      "enableMouseTracking": false, 
      "sliced": false, 
      "selected": false 
     }, { 
      "name": "Adidas Group", 
      "color": "#f1b11d", 
      "y": 297.0, 
      "showInLegend": false, 
      "dataLabels": { 
       "align": "center", 
       "enabled": true, 
       "borderColor": "", 
       "rotation": 0, 
       "style": { 
        "fontSize": "8px", 
        "fontFamily": "Arial" 
       } 
      }, 
      "borderColor": "#ffffff", 
      "enableMouseTracking": false, 
      "sliced": false, 
      "selected": false 
     }, { 
      "name": "Adidas Group", 
      "color": "#f1b11d", 
      "y": 349.0, 
      "showInLegend": false, 
      "dataLabels": { 
       "align": "center", 
       "enabled": true, 
       "borderColor": "", 
       "rotation": 0, 
       "style": { 
        "fontSize": "8px", 
        "fontFamily": "Arial" 
       } 
      }, 
      "borderColor": "#ffffff", 
      "enableMouseTracking": false, 
      "sliced": false, 
      "selected": false 
     }, { 
      "name": "Adidas Group", 
      "color": "#f1b11d", 
      "y": 903.0, 
      "showInLegend": false, 
      "dataLabels": { 
       "align": "center", 
       "enabled": true, 
       "borderColor": "", 
       "rotation": 0, 
       "style": { 
        "fontSize": "8px", 
        "fontFamily": "Arial" 
       } 
      }, 
      "borderColor": "#ffffff", 
      "enableMouseTracking": false, 
      "sliced": false, 
      "selected": false 
     }, { 
      "name": "Adidas Group", 
      "color": "#f1b11d", 
      "y": 20.0, 
      "showInLegend": false, 
      "dataLabels": { 
       "align": "center", 
       "enabled": true, 
       "borderColor": "", 
       "rotation": 0, 
       "style": { 
        "fontSize": "8px", 
        "fontFamily": "Arial" 
       } 
      }, 
      "borderColor": "#ffffff", 
      "enableMouseTracking": false, 
      "sliced": false, 
      "selected": false 
     }], 
     "regression": false, 
     "enableMouseTracking": true, 
     "color": "#f1b11d", 
     "showInLegend": false 
    }, { 
     "name": "All Companies Average Score", 
     "data": [{ 
      "name": "All Companies", 
      "color": "#00aeef", 
      "y": 25.0, 
      "showInLegend": false, 
      "dataLabels": { 
       "align": "center", 
       "enabled": true, 
       "borderColor": "", 
       "rotation": 0, 
       "style": { 
        "fontSize": "8px", 
        "fontFamily": "Arial" 
       } 
      }, 
      "borderColor": "#ffffff", 
      "enableMouseTracking": false, 
      "sliced": false, 
      "selected": false 
     }, { 
      "name": "All Companies", 
      "color": "#00aeef", 
      "y": 18.0, 
      "showInLegend": false, 
      "dataLabels": { 
       "align": "center", 
       "enabled": true, 
       "borderColor": "", 
       "rotation": 0, 
       "style": { 
        "fontSize": "8px", 
        "fontFamily": "Arial" 
       } 
      }, 
      "borderColor": "#ffffff", 
      "enableMouseTracking": false, 
      "sliced": false, 
      "selected": false 
     }, { 
      "name": "All Companies", 
      "color": "#00aeef", 
      "y": 90.0, 
      "showInLegend": false, 
      "dataLabels": { 
       "align": "center", 
       "enabled": true, 
       "borderColor": "", 
       "rotation": 0, 
       "style": { 
        "fontSize": "8px", 
        "fontFamily": "Arial" 
       } 
      }, 
      "borderColor": "#ffffff", 
      "enableMouseTracking": false, 
      "sliced": false, 
      "selected": false 
     }, { 
      "name": "All Companies", 
      "color": "#00aeef", 
      "y": 1821.0, 
      "showInLegend": false, 
      "dataLabels": { 
       "align": "center", 
       "enabled": true, 
       "borderColor": "", 
       "rotation": 0, 
       "style": { 
        "fontSize": "8px", 
        "fontFamily": "Arial" 
       } 
      }, 
      "borderColor": "#ffffff", 
      "enableMouseTracking": false, 
      "sliced": false, 
      "selected": false 
     }, { 
      "name": "All Companies", 
      "color": "#00aeef", 
      "y": 84.0, 
      "showInLegend": false, 
      "dataLabels": { 
       "align": "center", 
       "enabled": true, 
       "borderColor": "", 
       "rotation": 0, 
       "style": { 
        "fontSize": "8px", 
        "fontFamily": "Arial" 
       } 
      }, 
      "borderColor": "#ffffff", 
      "enableMouseTracking": false, 
      "sliced": false, 
      "selected": false 
     }, { 
      "name": "All Companies", 
      "color": "#00aeef", 
      "y": 83.0, 
      "showInLegend": false, 
      "dataLabels": { 
       "align": "center", 
       "enabled": true, 
       "borderColor": "", 
       "rotation": 0, 
       "style": { 
        "fontSize": "8px", 
        "fontFamily": "Arial" 
       } 
      }, 
      "borderColor": "#ffffff", 
      "enableMouseTracking": false, 
      "sliced": false, 
      "selected": false 
     }, { 
      "name": "All Companies", 
      "color": "#00aeef", 
      "y": 97.0, 
      "showInLegend": false, 
      "dataLabels": { 
       "align": "center", 
       "enabled": true, 
       "borderColor": "", 
       "rotation": 0, 
       "style": { 
        "fontSize": "8px", 
        "fontFamily": "Arial" 
       } 
      }, 
      "borderColor": "#ffffff", 
      "enableMouseTracking": false, 
      "sliced": false, 
      "selected": false 
     }, { 
      "name": "All Companies", 
      "color": "#00aeef", 
      "y": 241.0, 
      "showInLegend": false, 
      "dataLabels": { 
       "align": "center", 
       "enabled": true, 
       "borderColor": "", 
       "rotation": 0, 
       "style": { 
        "fontSize": "8px", 
        "fontFamily": "Arial" 
       } 
      }, 
      "borderColor": "#ffffff", 
      "enableMouseTracking": false, 
      "sliced": false, 
      "selected": false 
     }, { 
      "name": "All Companies", 
      "color": "#00aeef", 
      "y": 12.0, 
      "showInLegend": false, 
      "dataLabels": { 
       "align": "center", 
       "enabled": true, 
       "borderColor": "", 
       "rotation": 0, 
       "style": { 
        "fontSize": "8px", 
        "fontFamily": "Arial" 
       } 
      }, 
      "borderColor": "#ffffff", 
      "enableMouseTracking": false, 
      "sliced": false, 
      "selected": false 
     }], 
     "regression": false, 
     "enableMouseTracking": true, 
     "color": "#00aeef", 
     "showInLegend": false 
    }], 
    "plotOptions": { 
     "series": { 
      "enableMouseTracking": false, 
      "dataLabels": { 
       "color": "#000000", 
       "enabled": true, 
       "borderColor": "", 
       "format": "{y:.0f}" 
      } 
     }, 
     "column": { 
      "pointWidth": 20 
     } 
    }, 
    "exporting": { 
     "enabled": false 
    }, 
    "tooltip": { 
     "enabled": true, 
     "pointFormat": "{series.name}: {point.y:.0f}", 
     "shared": false, 
     "headerFormat": "" 
    }, 
    "legend": { 
     "enabled": false, 
     "x": 0, 
     "floating": false, 
     "shadow": false, 
     "reversed": false, 
     "y": 0 
    }

Źródło

2015-02-23 Bhupendra

Ustaw [allowOverlap] (http://api.highcharts.com/highcharts#plotOptions.series.dataLabels.allowOverlap) true: http: // jsfiddle .net/cthzmsg0/1/ –

@ PawełFus: Dzięki temu działało – Bhupendra

@PawelFus: Wielkie dzięki za te informacje. To bardzo mi pomogło. Proszę dodać to jako odpowiedź ur. –

Set plotOptions.series.dataLabels.allowOverlap opcja true: http://jsfiddle.net/cthzmsg0/1

Źródło

2015-05-12 15:56:39

Wielkie dzięki! To od wielu miesięcy mnie dręczy :) – davaus

jak dodać serię osi X nazwa 'function BarSeriesData (val, name) {barChart.series [0] .name = nazwa; barChart.series [0] .setData (val);} 'W tej wartości nazwa kodu nie jest odzwierciedlona na wykresie, ale funkcja setData działa. – Vijayaraghavan

Użyj [serial.update()] (http://api.highcharts.com/highcharts/Series.update). –

Highchart (wykres kolumnowy): kilka etykiet danych nie pojawia się w przypadku serii

Odpowiedz

Powiązane problemy