在Axure中绘制可自由调整的折线图不再困难！本文揭秘了一种巧妙的方法，通过连接柱状图顶部节点，实现折线的灵活变形。无论是单系列还是多系列数据，都能轻松应对。跟随详细步骤，你将掌握这一提升原型设计效率的实用技巧。

这是一种在Axure中绘制折线图的方法，绘制完成后通过简单拖动就可以快速任意调整折线图的形状。本文仅适用于具有一定Axure使用经验的用户阅读。

Axure版本：11.0

制作步骤为：

绘制柱状图à绘制折线à设置X轴和Y轴标签à绘制坐标轴

1. 绘制柱状图

1）在页面中手工绘制柱状图，设置每个柱子的宽度为30，高度任意，数量根据需求确定（示例中为12个）。

注意：这里不能使用中继器生成柱状图。

2）设置每个柱子底部对齐，水平间距相等，效果如下：

3）调整每个柱子的高度，让其有高低起伏感，调整完成后效果如下：

2. 绘制折线

在Axure顶部工具栏中选择“绘制连接线”工具，如下图所示：

此时将鼠标移动到柱子上面后，柱子的周围会显示四个空心连接点，如下图所示：

鼠标移动到第一个柱子顶部的连接点，此时连接点变为蓝色实心，按住鼠标左键将鼠标拖动到第二个柱子顶部的连接点，此时释放鼠标左键，两个柱子之间的连接线就画完了，如下图所示：

特别说明：

当鼠标移动到第一个柱子顶部时，默认会出现一个虚线框，此次不能单击鼠标左键，而是要按住鼠标左键拖动，如图：

当鼠标拖动到第二个柱子的顶部时，一定要保证鼠标的位置与第二个柱子的顶部连接点重合，否则会导致后一根线条和前面的线条接头错位，示意图如下：

错误  正确

如果折线图需要显示数据点，可以设置连接线的箭头，操作方法如下图：

按照上述步骤继续绘制第二个柱子到第三个柱子之间的连接线，依次类推，直到绘制完所有的连接线，效果图如下：

参考上述步骤4的方法，设置最后一条连接线的末端箭头形状为空心圆。

至此一条可以任意变换形状的折线图就绘制完成了。选中某个/某些柱子，拖动顶部中间的点可以任意改变折线图的形状，效果如下：

3. 设置X轴和Y轴标签

添加一个中继器，在中继器中分别添加一个标签（命名为xValue），和一条短竖线（作为X轴刻度线），并为中继器添加X轴的刻度数据（此处以月份为例），如图所示：

设置中继器布局方式为水平，列距46（根据实际效果调整），完成后效果如下图：

再添加一个中继器，分别添加一个标签（命名为yValue），和一条短横线（作为Y轴刻度线），并为中继器添加Y轴的刻度数据：

设置中继器布局方式为垂直，行距32（根据实际效果调整），完成后效果如下图：

4. 绘制坐标轴

画一条水平线作为X轴，设置线条末端形状为箭头，设置方法如下：

再画一条垂直线，用同样的方法设置末端箭头，然后调整X轴和Y轴到合适的位置，再将X轴标签和Y轴标签移动到合适的位置，完成后效果如下图：

将所有的柱子的填充设置为透明，效果如下：

至此，整个折线图就设置完成啦，最终预览效果如下：

5. 进阶内容

这样实现的折线图仅有一个系列，如果想要添加多个系列怎么办？

其实方法非常简单，只要将原系列再复制一份，修改每个柱子的颜色和高度，然后调整到合适的位置即可，详细的操作方法如下：

1）将原红色系列复制一份并修改新系列的颜色，完成后效果如下：

2）调整每个柱子的高度，或整体选中蓝色系列的柱子后整体调整高度，让线条看起来区别于红色系列，调整之后效果图如下：

3）最后，将蓝色系列的每个柱子与红色系列的每个柱子左侧对齐即可，最终实现的效果图如下：