JqPlot -不同颜色的线条和填充如何？

Question

我一直在胡思乱想要实现这样的目标：

检查图表、线条和填充颜色

这正是我所需要的。你知道如何使线条和填充颜色不同吗？

谢谢

我就是这样写剧本的：

        <script type="text/javascript">
        $('#btnResetHeartRateZoom').show();
        var data = [@string.Join(",", Model.Activity.Laps.SelectMany(t => t.TrackPoints).Select(h => h.HeartRate))];
        var HeartRatePlot = $.jqplot('HeartInformation', [data],
            {
                seriesColors: ['#85802b'],
                title: "@Resources.HeartRate",
                axesDefaults: { labelRenderer: $.jqplot.CanvasAxisLabelRenderer }, //Render de los textos.
                series: [{ showMarker: false, fill: true, color: '#FCB1B8' }], //Para no mostrar markers.
                axes:
                {
                    xaxis: { autoscale: true, label: "@Resources.Distance", pad: 0 },
                    yaxis: { autoscale: true, label: "@Resources.HeartRate [bpm]" },
                },
                highlighter: { show: true, sizeAdjust: 7.5 },
                cursor: { show: true, zoom: true }
            });

        $('#btnResetHeartRateZoom').click(function () { HeartRatePlot.resetZoom(); });
    </script>

这是我的结果：

​

​

Answer 1

对于单个Series，可以使fillAndStroke同时绘制填充和线条：

如果是真的，将划线(与颜色this.color)以及填充在它下面。只有在“填充”为真时才适用。

使用fillColor指定第二种颜色：

CSS颜色规范用于填充线下。默认为线条颜色。

示例：http://jsfiddle.net/rjDgh/

series: [
  { ..., fill: true, fillAndStroke: true, color: '#FCB1B8', fillColor: '#ccc' }
]