NueForm

Fuse 投票活动

经典投票、多选投票、图片投票、二选一、排名投票、淘汰投票、滑动量表和你更愿意活动的文档。

经典投票

选择一个选项,实时看到百分比随其他人投票而更新。

活动类型classic_poll

配置

属性类型描述默认值
optionsarray投票选项数组。每个包含 idlabel 和可选 color2 个默认选项

选项对象

字段类型描述
idstring选项的唯一标识符。
labelstring选项的显示文本。
colorstring选项条/高亮的强调色。如未设置,从调色板自动分配。

行为

  • 每位参与者只能投一个选项。
  • 投票后,参与者看到实时结果(百分比和票数)。
  • 这是一个单操作活动:投票后,参与者进入只读模式。

显示模式

模式描述
inline_bars结果以每个选项内的水平条显示。
bar_chart结果以独立的垂直柱状图显示。

聚合状态

字段类型描述
optionsPollOption[]包含票数、百分比和投票者列表的选项。
totalVotesnumber总投票数。
myVotesstring[]当前参与者投票的选项 ID。

CSS 选择器

.fuse-classic-poll.fuse-poll.fuse-poll--bar-chart.fuse-bar.fuse-bar-label.fuse-option.fuse-option-label.fuse-option-percentage.fuse-option-votes


多选投票

同时投多个选项。非常适合"选择所有适用的"场景。

活动类型multi_vote_poll

配置

属性类型描述默认值
optionsarray包含 idlabel 和可选 color 的投票选项数组。2 个默认选项

行为

  • 参与者可以投多个选项。
  • 投票可以切换——点击已投的选项取消投票。
  • 这是一个多操作活动:参与者可以随时更改投票。
  • 结果随投票切换实时更新。

聚合状态

与经典投票相同。

CSS 选择器

.fuse-multi-vote-poll,加上所有共享投票选择器。


图片投票

对图片而非文本进行投票。非常适合设计选择、服装搭配或产品选择。

活动类型image_poll

配置

属性类型描述默认值
optionsarray投票选项数组。每个包含 idlabelimageUrl2 个默认选项

选项对象

字段类型描述
idstring唯一标识符。
labelstring图片下方显示的文本标签。
imageUrlstring此选项要显示的图片 URL。
colorstring可选强调色。

行为

  • 选项以带标签的图片卡片形式显示。
  • 每位参与者只能投一张图片。
  • 这是一个单操作活动。
  • 结果显示投票百分比覆盖在图片上方或下方。

聚合状态

与经典投票相同,每个选项附带 imageUrl

CSS 选择器

.fuse-image-poll,加上所有共享投票选择器。


二选一

两个选项之间的二元滑动式选择,实时百分比分布。

活动类型this_or_that

配置

属性类型描述默认值
optionsarray恰好 2 个选项,包含 idlabel 和可选 color[{ label: "This" }, { label: "That" }]

行为

  • 两个选项以分屏布局并排展示。
  • 每位参与者选择两个选项之一。
  • 这是一个多操作活动:参与者可以切换投票。
  • 实时百分比分布以两个面板之间的视觉分隔线显示。

聚合状态

与经典投票相同(恰好 2 个选项)。

CSS 选择器

.fuse-this-or-that.fuse-panel--left.fuse-panel--right.fuse-panel-label.fuse-panel-percentage


排名投票

拖拽将选项排列为您偏好的顺序。观看社区共识排名形成。

活动类型ranked_poll

配置

属性类型描述默认值
optionsarray需要排名的选项数组。每个包含 idlabel 和可选 color3 个默认选项

行为

  • 所有选项显示在列表中。
  • 参与者拖拽项目,从最偏好到最不偏好重新排序。
  • 提交后,参与者的排名被记录。
  • 这是一个单操作活动:排名只提交一次。
  • 共识排名通过平均所有参与者的排名计算。

聚合状态

字段类型描述
optionsarray包含 idlabelavgRankrankings 计数的选项。
totalParticipantsnumber提交排名的参与者总数。

CSS 选择器

.fuse-ranked-poll.fuse-rank-number,加上共享选择器。


淘汰投票

多轮投票,每轮票数最低的选项被淘汰,直到剩下一个获胜者。

活动类型elimination_poll

配置

属性类型描述默认值
optionsarray包含 idlabel 和可选 color 的选项数组。2 个默认选项

行为

  • 参与者在当前轮次投票给他们最喜欢的选项。
  • 一轮完成后,票数最少的选项被淘汰。
  • 剩余选项开始新一轮。
  • 过程重复直到只剩一个选项——获胜者。
  • 这是一个多轮活动:参与者需要在后续轮次继续投票。
  • 已在某轮投票的参与者可以重新加入下一轮投票。

聚合状态

字段类型描述
currentRoundnumber当前轮次编号。
activeOptionsPollOption[]仍在竞争中的选项及其投票数据。
eliminatedOptionsarray已被淘汰的选项及其被淘汰的轮次。
totalVotesThisRoundnumber当前轮次的总投票数。
isCompleteboolean淘汰是否已结束(只剩一个获胜者)。
winnerobject获胜选项(isComplete 为 true 时设置)。

CSS 选择器

.fuse-elimination-poll.fuse-round-label.fuse-champion,加上共享投票选择器。

淘汰投票最好有 4 个以上选项。只有 2 个选项时,实际上变成了单轮经典投票。


滑动量表

在光谱上定位自己,查看所有响应的实时分布曲线。

活动类型sliding_scale

配置

属性类型描述默认值
minnumber量表的最小值。0
maxnumber量表的最大值。100
stepnumber滑块的步进增量。1
minLabelstring量表最小端的标签。""
maxLabelstring量表最大端的标签。""
scaleStylestring滑块轨道的视觉样式。"thin"
barColorstring分布柱的自定义颜色。""(使用主题强调色)

行为

  • 参与者拖动滑块在光谱上选择一个值。
  • 提交后,他们看到显示所有响应分布的直方图。
  • 显示统计信息(平均值、中位数、总响应数)。
  • 这是一个单操作活动。

聚合状态

字段类型描述
distributionnumber[]直方图桶计数(例如从 min 到 max 的 10 个桶)。
averagenumber所有响应的平均值。
mediannumber所有响应的中位数。
totalResponsesnumber响应总数。
minnumber量表最小值。
maxnumber量表最大值。

CSS 选择器

.fuse-sliding-scale.fuse-slider.fuse-slider-value.fuse-slider-label.fuse-stats.fuse-histogram.fuse-histogram-bar.fuse-stat-value.fuse-stat-label


你更愿意

在两个困境之间选择,查看实时分布。无尽的辩论。

活动类型would_you_rather

配置

属性类型描述默认值
optionsarray恰好 2 个选项,包含 idlabel 和可选 color[{ label: "This" }, { label: "That" }]

行为

  • 两个选项并排展示。
  • 参与者选择一个选项。
  • 这是一个多操作活动:参与者可以切换选择。
  • 实时百分比分布以视觉分隔线显示。

与二选一的区别

"你更愿意"和"二选一"在功能上完全相同。区别在于主题:

  • 二选一:一般偏好比较(例如"咖啡还是茶?")。
  • 你更愿意:基于困境的问题(例如"你更愿意会飞还是隐身?")。

聚合状态

与经典投票相同(恰好 2 个选项)。

CSS 选择器

.fuse-would-you-rather.fuse-panel--left.fuse-panel--right.fuse-panel-label.fuse-panel-percentage

调色板

当选项未分配自定义颜色时,NueForm 会自动从鲜艳的调色板中分配颜色:

  1. 靛蓝色(#6366f1
  2. 琥珀色(#f59e0b
  3. 翡翠色(#10b981
  4. 红色(#ef4444
  5. 紫罗兰色(#8b5cf6
  6. 青色(#06b6d4
  7. 橙色(#f97316
  8. 粉色(#ec4899
  9. 蓝绿色(#14b8a6
  10. 紫色(#a855f7
  11. 酸橙色(#84cc16
  12. 玫瑰色(#e11d48

颜色根据选项位置按顺序分配。当选项数超过颜色数时,调色板循环使用。

最后更新:2026年4月6日