使用 react 写了个网页版数独工具

[webee]

源码：https://github.com/webee/sudoku-tool

我之前主要是做后端的，最近对前端挺感兴趣，就学习了 css 和 react，然后做了这个数独工具练手。

整个就是下面这个样子，请原谅我的审美水平，风格有点呆板，像老式机械面板，各种按键都直接显示了。

欢迎试玩：demo

主要功能是 solver 和分步求解。

提供了尽可能方便的操作方式：标记，颜色区分，选数填格子，选格子填数，操作历史，快捷键等。

note: 自动标记所有单元格，在自动处理简单情况和寻找提示之前应该自动标记

place/point/claim: 自动处理所有 naked/hidden single，pointing 和 claiming 这些简单的情况。

tip: 下一个提示和应用提示

share: 分享当前状态为二维码链接，手机扫码可以继续在手机上玩。

solver 就是简单的 backtracking 算法，可以判断无解和多解的情况。

分步求解算法包括以下几类：

• group
  • naked/hidden single
  • naked/hidden pair/triplet/quad 等
• x-group
  • pointing/claiming
  • x-wing, xxx-fish
• chain
  • x-chain
  • xy-chain
  • group-x-chain
  • group-xy-chain
  • als 相关提示可以选择关闭
  • als-chain
  • group/als/xy-chain 各种混合 chain
• trial error
  • 就是试着填一个数，然后基于此求解，如果出现错误则说明不能填此数，如果成功则结束了。
  • 这是最后一招
  • 其实 solver 才是最后一招！！！

目前 als(Almost Lock Set)chain 的算法性能还是有问题了，因此代码中也限制了结点数量和搜索深度，我已经想到了一个解决办法，不过暂时没时间实现。。。

这只是个分步解数独的工具，不生成数独

可以配合这个数独生成器网站一起使用：

https://qqwing.com/generate.html

把生成的数独粘贴到New之后的输入框就ok了。

ps: Start 和 Edit是为了在当前面板中编辑数独使用的，正常玩数独只需要New+粘贴就可以了。

[mara1]

这么复杂吗，我去年写过一个，是先把整个界面打乱，然后挖几个空格出来，根据难易程度，选难的就多挖点。

[webee]

@mara1 这个是个工具，并没有数独生成器。主要是辅助或学习使用各种技巧解数独，后面考虑加上。

[shoa]

用的是 DLX 算法吗？
感觉和人类解数独的方法类似 基于已有的数排除掉某些可能性 无法进一步排除就填数试错
所以也可以实现自动处理简单情况 自动标记格子可能的数字的功能

[nzbin]

话说这复古风格反而感觉一丝清新😂

[webee]

@shoa dlx 是 solver 的算法，我这里是简单的回溯，后面会试试 DLX 。分步解法是实现的大家总结的一些逻辑推理技巧。其实学数独的时候会学习这些技巧，这个工具可以帮助学习和理解技巧。我写到一半发现其实挺多这样的工具的，我就尽量把技巧展现的更好理解。

[webee]

@nzbin 是挺清新的😂

[adminharlem]

配色有点诡异￣□￣｜｜