如何在折线图中设置边框颜色

Question

我有一个LineChart图。我想为图形区域的矩形边框着色。

＆＃34; -fx-border-color：黑色透明透明透明;＆＃34;将边框添加到x轴或y轴。

＆＃34; -fx-border-color：black＆＃34;在完整的图表周围添加边框。

但我只需要在图表区域边框，如附件中所示

任何帮助都会有用。

由于

Answer 1

边框CSS

.chart-plot-background {
    -fx-border-color: red; 
    -fx-border-style: solid; 
    -fx-border-width: 4px;
    -fx-border-insets: -2px;
}

给你这个：

图表情节内容周围的绿色边框是上面提供的CSS。

虚线

您会注意到绿色边框顶部有虚线和轴。也许你想要这些线后面的边界，也许你想要它在顶部，也许你根本不想绘制那些虚线。

如果将虚线后面的边框设置好，则无需执行任何其他操作。

如果您不想绘制虚线，可以将其删除：

lineChart.setAlternativeRowFillVisible(false);
lineChart.setAlternativeColumnFillVisible(false);
lineChart.setHorizontalGridLinesVisible(false);
lineChart.setVerticalGridLinesVisible(false);

并相应地调整边界矩形的插图：

.chart-plot-background {
    -fx-border-color: forestgreen; 
    -fx-border-style: solid; 
    -fx-border-width: 4px; 
    -fx-border-insets: 0 0 0 1;
}

如果要保留虚线并在图表顶部绘制矩形，则可以将图表放在StackPane中，在显示图表后运行chart.lookup(".chart-plot-background")，监控结果的边界图表背景节点并将新矩形添加到堆栈顶部，该矩形绑定到图表背景边界，如此layout bounds demo。你可能不想这样做。

如何自己动手

使用ScenicView中的工具或SceneBuilder中的css分析器，或者研究JRE附带的jfxrt.jar中的CSS reference guide或modena.css文件帮助您确定所需的CSS规则。

Answer 2

你可以在你的css文件中测试它：

＆＃13;

＆＃13;

/* chart background */
.chart-plot-background {
   -fx-background-color: blue;
}
/* frame background */
.chart{
   -fx-background-color: pink;
}
/* border content */
.chart-content{
  -fx-padding: 0px;
  -fx-border-color: black;
  -fx-border-width: 3px;
}

＆＃13;

＆＃13;

＆＃13;