Repository navigation
fix(site): 修复图注与实际节点颜色不符(GOTY 显示为蓝色星形) - #9
Merged
Merged
Conversation
现象:右栏图注写「金色星形 = GOTY、蓝色圆点 = 其他作品」,实际却显示成
蓝色星形 + 金色圆点,与图注完全相反。
根因:vis-network 的 GroupsHandler 对**未在 options.groups 中定义**的
group,会从内置 _defaultGroups 里按顺序发牌:
_defaultGroups[0] = #97C2FC 蓝 → goty(节点数据里首个出现的 group)
_defaultGroups[1] = #FFFF00 黄 → game
_defaultGroups[2] = #FB7E81 红 → studio
...
发牌次序取决于节点数据中 group 首次出现的先后;且 **group 颜色的优先级
高于节点自身的 color 属性**,所以行 204 给每个节点设的 n.color 被整个
盖掉。这意味着颜色长期取决于数据顺序,从未真正生效过。
修复:在 graphOptions() 里显式声明 groups,五个 group 各自定义 color。
- groups 只定义 color,不定义 shape:形状来自节点数据(star/dot/hexagon/
triangle/diamond),在 group 里写 shape 会反过来覆盖节点数据
- groups 色值直接复用 groupColors,与节点 color 同源,不会出现
「group 与节点各说各话」
- 节点 color 赋值保留,作为双重保险
已知取舍:顶层类型(n.tier1)原本的 #2f9e54 会退化为与子类型同色
#27ae60,深浅差异丢失。但图注本来就只靠「大 / 小」区分顶层与子类型
(size 16 vs 9、borderWidth 3 vs 2),不违背图注描述。
验证(Node 模拟,输入取自真实构建产物 site/assets/index.css):
- 五个 group 色 == 对应 CSS 变量值
- group 色 == 节点自身 color(两者无冲突)
- group 内不含 shape
- 节点 color 赋值代码仍在
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
现象:右栏图注写「金色星形 = GOTY、蓝色圆点 = 其他作品」,实际却显示成
蓝色星形 + 金色圆点,与图注完全相反。
根因:vis-network 的 GroupsHandler 对未在 options.groups 中定义的 group,会从内置 _defaultGroups 里按顺序发牌:
发牌次序取决于节点数据中 group 首次出现的先后;且 group 颜色的优先级
高于节点自身的 color 属性,所以行 204 给每个节点设的 n.color 被整个
盖掉。这意味着颜色长期取决于数据顺序,从未真正生效过。
修复:在 graphOptions() 里显式声明 groups,五个 group 各自定义 color。
已知取舍:顶层类型(n.tier1)原本的 #2f9e54 会退化为与子类型同色
#27ae60,深浅差异丢失。但图注本来就只靠「大 / 小」区分顶层与子类型
(size 16 vs 9、borderWidth 3 vs 2),不违背图注描述。
验证(Node 模拟,输入取自真实构建产物 site/assets/index.css):