页面树结构

版本比较

标识

  • 该行被添加。
  • 该行被删除。
  • 格式已经改变。

...

1、场景描述:展示人物之间的关系,每个节点的颜色表示他们的职业类型,圆圈大小表示每个人的声望大小,圆圈越大,声望越大,有连线代表两人之间有关系。,圆圈越大声望越大,有连线代表两人之间有关系。如下图所示:

2、数据结构如下图所示:

Image Modified

3、数据来源见附件:关系图数据.xls

4、操作步骤

在数据选择区中,(1)在数据选择区中,拖拽 人物A 和 人物B  字段到 维度 ,A的声望 和 B的声望 字段到 标记 > 大小 A的职业 和 B的职业 字段到  标记 > 颜色 

(2) 组件设置 > 属性 > 基础 中进行关系图样式设置:

  •  普通状态边框为”实线“,线条粗细程度为”2“,线条颜色为”#F8E71C“;连线为”虚线“,线条粗细程度为”1“,线条颜色为”#D0021B“。
  •  高亮状态 :颜色为“#BD10E0”;边框为”实线“,线条粗细程度为”2“,线条颜色为”#F5A623“;连线为”虚线“,线条粗细程度为”2“,线条颜色为”#000000“。

Image Added

3 关系图样式设置

在组件设置的属性中,可对关系图进行更多的样式设置。

Image Added

3.1 斥力因子

说明

设置关系对象之间的距离,此时不同大小的值会线性映射到不同的斥力,值越大斥力越大。


信息

力导向关系图才有此设置项。

效果

Image Added

3.2 连线曲率

说明

设置关系图节点之间的连线曲度,值越大曲度越大。

效果

Image Added

4 更多说明

  • 更多的图形属性设置项的详细介绍,可参考文档:图形属性

  • 配色修改:如需修改图形配色,可参考文档如需修改图形配色,可参考文档:颜色设置

  • 交互设计:如需了解交互相关功能,可参考文档交互设计:如需了解交互相关功能,可参考文档:交互设计