Highcharts背景選項

-1

如何使用Highcharts在折線圖中添加背景框？Highcharts背景選項

類型：折線圖

2017-01-02 rafik

使用網格線和次要網格線http://jsfiddle.net/g26xwgzp/。有關更多選項，請參閱API http://api.highcharts.com/highcharts/yAxis.minorGridLineWidth – morganfree

感謝Morgon。我嘗試使用minorGridLineColor選項，但它只顯示yAxis行而不是x軸。冷杉x軸我使用gridLineWidth：1選項，但它的水平線。但箱寬將是巨大的，它不能滿足我的要求。 xAxis：{gridLineWidth：1}，yAxis：{minorGridLineColor：'＃E0E0E0'，minorGridLineWidth：2，minorTickLength：0，minorTickInterval：'auto'} – rafik

您必須爲兩個軸 - xAxis和yAxis設置小網格線。看看我在上面的評論中發佈的小提琴。 – morganfree

您可以通過enabling plot lines for both x和y軸添加這種背景圖表的繪圖區。

xAxis:[{ 
    gridLineWidth: 1 
}] // for yAxis grid lines are visible by default

演示：http://jsfiddle.net/0md5s7cz/

或者你可以爲background of a chart's plot area設置圖像。

chart: { 
    plotBackgroundImage: 'https://i.stack.imgur.com/BBTab.png' 
},

演示：http://jsfiddle.net/4wLvu94s/1/

來源

2017-01-02 12:02:47

感謝您的快速響應。其實我不想添加背景圖片。使用gridLineWidth選項我嘗試過，但框的大小很大。其實我正在尋找我在附件中分享的小盒子。 – rafik

@rafik在這種情況下，請在您的問題下看到** morganfree **的評論 - minorGridLine應該是您的解決方案。 –

謝謝Kacper。我嘗試使用minorGridLineColor選項，但它只顯示yAxis行而不是x軸。冷杉x軸我使用gridLineWidth：1選項，但它的水平線。但箱寬將是巨大的，它不能滿足我的要求。 x軸：{ gridLineWidth：1 }， YAXIS：{ minorGridLineColor： '＃E0E0E0'， \t minorGridLineWidth：2， minorTickLength：0，會將minorTickInterval： '自動' } – rafik

Highcharts背景選項

回答

相關問題