《古剑奇谭3》千秋戏辅助工具(前端React制做)

前言

一直身在武汉,基于众所周知的疫情缘由,这个春节只能宅着。git

不过其实这个春节是这些年来过得最爽的一个了。工具

没有鞭炮,不用四处跑,安安心心呆在家里玩玩游戏看看书写写代码,其实日子过得仍是挺清闲的。优化

废话少说,这段时间买了《古剑奇谭3》,全成就拿齐了以后,就抽了点时间来分享在玩游戏的过程当中自制的一个千秋戏辅助工具。blog

何谓千秋戏?

千秋戏是《古剑奇谭3》中的一个纸牌玩法,几十张牌,每张牌都有本身的基础分,这里咱们默认分数同样。游戏

而后这些牌能够构成各类各样的组合,从2张牌的组合到6张牌的组合不等,分数也有大小差异。get

为何要作这个工具?

由于这些组合都是根据前两做中人物间的关系来的,对于没有玩过前两做的我而言一脸懵逼。it

因此它的直接意义是帮助我打赢每把牌。基础

可是它的意义并不仅是如此,它也是个人一个小尝试:如何理清复杂的组合关系并展现给用户。程序

咱们在平常作业务的过程当中,也会面临一些给用户展现各种关系的需求,好比明星间的关系、各类企业或者组织之间的关系。im

以前没作过这样的事情,这里就想去玩一玩。

效果图展现与一点简单的介绍

这个辅助工具并非修改器,实际上就是一个简单的网页程序,还须要本身去手动操做才行。

咱们来看下下面的效果图:

这里咱们使用了Echarts的关系图来处理,经过在左侧拖动相应的牌到各个牌区,右侧也会进一步推测手牌还能造成哪些组合,并经过关系图展现出来。

而每张牌的节点大小则展示了它能造成的组合数量和权值,组合越多,节点就越大,那么就表示这张牌越重要,不管是本身造成组合仍是干扰对手造成组合都很重要。

具体的玩法就不说了,这里单说一下在制做过程当中的一些想法。

在展现这些关系的时候,咱们不只能够经过节点的颜色和大小,咱们其实也能够经过各个线的粗细和颜色(包括鼠标hover到节点上的状况)来给用户更直观的展现。

总结

这里最后放上项目地址:WeCanWin

这个项目是一个花了两天作成的小项目,基本上以完成功能为主,有一些地方有待优化,注释也不全。

可是人太懒就懒得改了,功能没问题用起来顺畅就行。

有兴趣的牌友能够玩玩看,基本大比分稳赢。

相关文章
相关标签/搜索