不带垂直的Highcharts/Highstock阶梯线“；“过渡”；线？

是否可以从“方波”线中省略垂直线？我想你可以称之为水平线，下面是一个例子：

---

实现此外观的最简单方法是使用带有自定义“线”符号的散点图：

请注意，可以通过增大

半径来调整单个点的长度

小提琴

产生：

虽然上面的答案很好，但我面临的问题是，当与柱状图结合显示时，线条符号的宽度与列宽不同


另一个选项是在新图表类型中扩展列类型图表，如下所示：

$(function () {
(function (H) {
    var each = H.each,
        pick = H.pick,
        Series = H.Series,
        seriesType = H.seriesType;


    seriesType('floatingStep', 'column', {
        fixedPointLength: 2
    }, /** @lends seriesTypes.floatingStep.prototype */ {

        /**
         * Translate each point to the plot area coordinate system and find shape positions
         */
        translate: function () {
            var series = this,
                chart = series.chart,
                options = series.options,
                dense = series.dense = series.closestPointRange * series.xAxis.transA < 2,
                borderWidth = series.borderWidth = pick(
                    options.borderWidth,
                    dense ? 0 : 1 // #3635
                ),
                yAxis = series.yAxis,
                threshold = options.threshold,
                translatedThreshold = series.translatedThreshold = yAxis.getThreshold(threshold),
                minPointLength = pick(options.minPointLength, 5),
                fixedPointLength = options.fixedPointLength,
                metrics = series.getColumnMetrics(),
                pointWidth = metrics.width,
                seriesBarW = series.barW = Math.max(pointWidth, 1 + 2 * borderWidth), // postprocessed for border width
                pointXOffset = series.pointXOffset = metrics.offset;

            if (chart.inverted) {
                translatedThreshold -= 0.5; // #3355
            }

            // When the pointPadding is 0, we want the columns to be packed tightly, so we allow individual
            // columns to have individual sizes. When pointPadding is greater, we strive for equal-width
            // columns (#2694).
            if (options.pointPadding) {
                seriesBarW = Math.ceil(seriesBarW);
            }

            Series.prototype.translate.apply(series);

            // Record the new values
            each(series.points, function (point) {
                var yBottom = pick(point.yBottom, translatedThreshold),
                    safeDistance = 999 + Math.abs(yBottom),
                    plotY = Math.min(Math.max(-safeDistance, point.plotY), yAxis.len + safeDistance), // Don't draw too far outside plot area (#1303, #2241, #4264)
                    barX = point.plotX + pointXOffset,
                    barW = seriesBarW,
                    barY = Math.min(plotY, yBottom),
                    up,
                    barH = Math.max(plotY, yBottom) - barY;

                // Handle options.minPointLength
                if (Math.abs(barH) < minPointLength) {
                    if (minPointLength) {
                        barH = minPointLength;
                        up = (!yAxis.reversed && !point.negative) || (yAxis.reversed && point.negative);
                        barY = Math.abs(barY - translatedThreshold) > minPointLength ? // stacked
                            yBottom - minPointLength : // keep position
                            translatedThreshold - (up ? minPointLength : 0); // #1485, #4051
                    }
                }
                if (fixedPointLength) {
                    barH = fixedPointLength;
                }

                // Cache for access in polar
                point.barX = barX;
                point.pointWidth = pointWidth;

                // Fix the tooltip on center of grouped columns (#1216, #424, #3648)
                point.tooltipPos = chart.inverted ? [yAxis.len + yAxis.pos - chart.plotLeft - plotY, series.xAxis.len - barX - barW / 2, barH] : [barX + barW / 2, plotY + yAxis.pos - chart.plotTop, barH];

                // Register shape type and arguments to be used in drawPoints
                point.shapeType = 'rect';
                point.shapeArgs = series.crispCol.apply(
                    series,
                    point.isNull ?
                    // #3169, drilldown from null must have a position to work from
                    // #6585, dataLabel should be placed on xAxis, not floating in the middle of the chart
                    [barX, translatedThreshold, barW, 0] : [barX, barY, barW, barH]
                );
            });
        },
    });
})(Highcharts);

$（函数（）{
（职能（H）{
var each=H.each，
pick=H.pick，
系列=H.系列，
seriesType=H.seriesType；
序列类型（'floatingStep'，'column'，'{
固定点长度：2
}，/**@lends seriesTypes.floatingStep.prototype*/{
/**
*将每个点平移到绘图区域坐标系并查找形状位置
*/
翻译：函数（）{
var系列=此，
chart=series.chart，
选项=系列。选项，
稠密=系列。稠密=系列。紧密点范围*系列。xAxis.transA<2，
borderWidth=系列。borderWidth=拾取(
选项。边框宽度，
稠密？0:1/#3635
),
yAxis=series.yAxis，
阈值=选项。阈值，
translatedThreshold=series.translatedThreshold=yAxis.getThreshold（阈值），
minPointLength=拾取（options.minPointLength，5），
fixedPointLength=选项。fixedPointLength，
metrics=series.getColumnMetrics（），
pointWidth=metrics.width，
seriesBarW=series.barW=Math.max（pointWidth，1+2*borderWidth），//对边框宽度进行后处理
pointXOffset=series.pointXOffset=metrics.offset；
如果（倒转图表）{
转换阈值-=0.5；/#3355
}
//当pointPadding为0时，我们希望列被紧密地打包，因此我们允许单个
//列具有单独的大小。当点填充更大时，我们会争取相等的宽度
//列（#2694）。
if（options.pointPadding）{
seriesBarW=Math.ceil（seriesBarW）；
}
系列。原型。翻译。应用（系列）；
//记录新值
每个（系列）点、功能（点）{
var yBottom=拾取（point.yBottom，translatedThreshold），
安全距离=999+数学绝对值（yBottom），
plotY=Math.min（Math.max（-safeDistance，point.plotY），yAxis.len+safeDistance），//不要在绘图区域外画太远（#1303，#2241，#4264）
barX=point.plotX+pointXOffset，
barW=系列barW，
barY=Math.min（plotY，yBottom），
向上的
barH=Math.max（plotY，yBottom）-barY；
//Handle options.minPointLength
if（数学绝对值（barH）minPointLength？//堆叠
yBottom-minPointLength://保持位置
translatedThreshold-（向上？minPointLength:0）；//#1485，#4051
}
}
if（固定点长度）{
barH=固定点长度；
}
//用于在polar中访问的缓存
point.barX=barX；
point.pointWidth=pointWidth；
//将工具提示固定在分组列的中心（#1216、#424、#3648）
point.tooltipPos=chart.inversed？[yAxis.len+yAxis.pos-chart.plotLeft-plotY，series.xAxis.len-barX-barW/2，barH]：[barX+barW/2，plotY+yAxis.pos-chart.plotTop，barH]；
//注册要在绘图点中使用的形状类型和参数
point.shapeType='rect'；
point.shapeArgs=series.crispCol.apply(
系列
point.isNull？
//#3169，从null向下钻取必须有一个位置可以从
//x 6585，DATALABEL应该放在x轴上，而不是浮动在图表中间。
[barX，translatedThreshold，barW，0]：[barX，barY，barW，barH]
);
});
},
});
})（高图）；

}))

我想你需要给我们看一个简单的例子，不清楚你到底要问什么（至少对我来说）。我只是添加了一个说明！对不起，用阶梯线是不可能的。在第二个问题中，尝试使用带有空点的解决方案。
$(function () {
(function (H) {
    var each = H.each,
        pick = H.pick,
        Series = H.Series,
        seriesType = H.seriesType;


    seriesType('floatingStep', 'column', {
        fixedPointLength: 2
    }, /** @lends seriesTypes.floatingStep.prototype */ {

        /**
         * Translate each point to the plot area coordinate system and find shape positions
         */
        translate: function () {
            var series = this,
                chart = series.chart,
                options = series.options,
                dense = series.dense = series.closestPointRange * series.xAxis.transA < 2,
                borderWidth = series.borderWidth = pick(
                    options.borderWidth,
                    dense ? 0 : 1 // #3635
                ),
                yAxis = series.yAxis,
                threshold = options.threshold,
                translatedThreshold = series.translatedThreshold = yAxis.getThreshold(threshold),
                minPointLength = pick(options.minPointLength, 5),
                fixedPointLength = options.fixedPointLength,
                metrics = series.getColumnMetrics(),
                pointWidth = metrics.width,
                seriesBarW = series.barW = Math.max(pointWidth, 1 + 2 * borderWidth), // postprocessed for border width
                pointXOffset = series.pointXOffset = metrics.offset;

            if (chart.inverted) {
                translatedThreshold -= 0.5; // #3355
            }

            // When the pointPadding is 0, we want the columns to be packed tightly, so we allow individual
            // columns to have individual sizes. When pointPadding is greater, we strive for equal-width
            // columns (#2694).
            if (options.pointPadding) {
                seriesBarW = Math.ceil(seriesBarW);
            }

            Series.prototype.translate.apply(series);

            // Record the new values
            each(series.points, function (point) {
                var yBottom = pick(point.yBottom, translatedThreshold),
                    safeDistance = 999 + Math.abs(yBottom),
                    plotY = Math.min(Math.max(-safeDistance, point.plotY), yAxis.len + safeDistance), // Don't draw too far outside plot area (#1303, #2241, #4264)
                    barX = point.plotX + pointXOffset,
                    barW = seriesBarW,
                    barY = Math.min(plotY, yBottom),
                    up,
                    barH = Math.max(plotY, yBottom) - barY;

                // Handle options.minPointLength
                if (Math.abs(barH) < minPointLength) {
                    if (minPointLength) {
                        barH = minPointLength;
                        up = (!yAxis.reversed && !point.negative) || (yAxis.reversed && point.negative);
                        barY = Math.abs(barY - translatedThreshold) > minPointLength ? // stacked
                            yBottom - minPointLength : // keep position
                            translatedThreshold - (up ? minPointLength : 0); // #1485, #4051
                    }
                }
                if (fixedPointLength) {
                    barH = fixedPointLength;
                }

                // Cache for access in polar
                point.barX = barX;
                point.pointWidth = pointWidth;

                // Fix the tooltip on center of grouped columns (#1216, #424, #3648)
                point.tooltipPos = chart.inverted ? [yAxis.len + yAxis.pos - chart.plotLeft - plotY, series.xAxis.len - barX - barW / 2, barH] : [barX + barW / 2, plotY + yAxis.pos - chart.plotTop, barH];

                // Register shape type and arguments to be used in drawPoints
                point.shapeType = 'rect';
                point.shapeArgs = series.crispCol.apply(
                    series,
                    point.isNull ?
                    // #3169, drilldown from null must have a position to work from
                    // #6585, dataLabel should be placed on xAxis, not floating in the middle of the chart
                    [barX, translatedThreshold, barW, 0] : [barX, barY, barW, barH]
                );
            });
        },
    });
})(Highcharts);