2

所以,我觉得这不是一个可怕的难题,但我找不到能挽救我生命的财产。我正在构建一个不错的 Javafx XYChart(我应该说是构建的),一切都很好,在Oracle CSS 样式指南的帮助下,我找到了大部分我可能想要的帮助并制作了一个漂亮的图表(如果我有 10 个声誉 >_> 我会发布)。现在,忽略它上面的随机抛物线,以及其他一切,因为我知道如何处理这些,我遇到的麻烦是红色 x 指向的地方,我需要那些轴线像深黑色,但是我在任何地方都找不到正确的 CSS 属性,您可能认为该属性是 fx-axis-stroke,但 javafx 2.0 无法识别该参数。(我提供的链接来自 1.3,我相信,较新的链接没有列出其中的大部分?O_o)。我的css文件如下:

    /* This css file holds all of the styling for the XY chart produced in the calculator.*/
    .chart-plot-background {
        -fx-background-image: url("chart-background 2.png"), url("graph-gridlines.png");
        -fx-background-size: cover, auto;
        -fx-background-repeat: no-repeat, repeat;
        -fx-background-position: 0% 0%, 0% 100%;
        -fx-border-color: black black transparent transparent;
    }
    .chart {

        -fx-background-image: url("background.png");
        -fx-padding: 15 25 15 15;    
        -fx-border-color: black;
        -fx-effect: dropshadow( gaussian , rgba(0,0,0,0.8) , 10, 0.0 , 0 , 2 );
    }
    .axis Text{
        -fx-fill: white;
    }
    .tick-mark {
        -fx-font-size: 10px;
        -fx-effect: dropshadow( one-pass-box , rgba(0,0,0,0.8) , 0, 0.0 , 0 , 1 );
    }
    .chart-legend{
          -fx-background-color:  transparent;
    }
    .chart-legend-item{
        -fx-text-fill: white;

    }

    .chart-series-area-line { 
        -fx-stroke: white; 
        -fx-stroke-width: 2px; 
    }
    .axis-label {
       -fx-text-fill: azure; 
    }
    .default-color0.chart-series-line { -fx-stroke: azure; }
    .default-color1.chart-series-line { -fx-stroke: azure; }
    .default-color2.chart-series-line { -fx-stroke: azure; }

    .default-color0.chart-line-symbol { -fx-background-color: azure; }
    .default-color1.chart-line-symbol { -fx-background-color: azure; }
    .default-color2.chart-line-symbol { -fx-background-color: azure; }
    .chart-area-symbol {
        -fx-background-color: white;
    }
    .axis {
        -fx-stroke: black;
        -fx-tick-mark-visible: false;
        -fx-minor-tick-visible: false;
        -fx-tick-length: 3;
        -fx-minor-tick-length: 0;
        -fx-border-color: transparent;
    }
    .axis:bottom {
        -fx-border-color: black transparent transparent transparent;
    }
    .axis:left {
        -fx-border-color: transparent black transparent transparent;
    }
    .chart-series-area-fill { 
        -fx-fill: linear-gradient(to right, white, rgba(255,255,255,0)); 
        -fx-blend-mode: OVERLAY;
    }

    root { 
        display: block;
    }

您可以提供的任何帮助或见解将不胜感激。对我来说很明显该属性必须存在,但我似乎找不到它。

编辑:我意识到你看不到我上面提到的红色箭头,因为我无法发布图片,但如果你能想象两个红色箭头指向图表的 x 和 y 轴线(不一定在图表的边框),那么这就是您真正需要知道的。

4

1 回答 1

3

所以,这在大约 5 分钟前解决了。正如我猜想的那样,解决方案非常简单。实现它的神奇 CSS:

.chart-vertical-zero-line{
    -fx-stroke: black;
    -fx-stroke-width: 5px;
}
.chart-horizontal-zero-line{
    -fx-stroke: black;
    -fx-stroke-width: 5px;
}

就这样,您的垂直和水平零线的单独着色/CSS 格式选项。惊人的。

于 2013-11-11T18:36:29.513 回答