Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs: Search icon by image #18425

Merged
merged 16 commits into from Aug 23, 2019

Conversation

@lewis617
Copy link

commented Aug 22, 2019

🤔 这个变动的性质是?

  • 新特性提交
  • 日常 bug 修复
  • 站点、文档改进
  • 组件样式改进
  • TypeScript 定义更新
  • 重构
  • 代码风格优化
  • 测试用例
  • 分支合并
  • 其他改动(是关于什么的改动?)

🔗 相关 Issue

💡 需求背景和解决方案

  1. 要解决的具体问题:前端开发过程中,需要还原设计稿图片中的图标,大多时候设计稿中的图标没有对应的 type 字段,如果肉眼从几百个图标中寻找,用户体验非常差。
  2. 列出最终的 API 实现和用法:所以本 PR 基于深度学习技术贡献了一个截图搜 icon 的功能,用户直接对设计稿或任意图片中的图标截图,点击或拖拽或粘贴上传,就可以搜索到匹配度最高的五个图标以及对应的匹配度。
  3. 涉及UI/交互变动需要有截图或 GIF:

📝 更新日志怎么写?

语言 更新描述
🇺🇸 英文 Search icon by image
🇨🇳 中文 通过截图搜索图标
  • 中文(可选):

☑️ 请求合并前的自查清单

  • 文档已补充或无须补充
  • 代码演示已提供或无须提供
  • TypeScript 定义已补充或无须补充
  • Changelog 已提供或无须提供

@pr-triage pr-triage bot added the PR: unreviewed label Aug 22, 2019

@tests-checker
Copy link

left a comment

Could you please add tests to make sure this change works as expected?

@netlify

This comment has been minimized.

Copy link

commented Aug 22, 2019

Deploy preview for ant-design ready!

Built with commit 8a1d184

https://deploy-preview-18425--ant-design.netlify.com

@afc163

This comment has been minimized.

Copy link
Member

commented Aug 22, 2019

进度条哪里加一个『匹配度』的文案,不然用户可能不知道是啥意思。

还有加一句:为你匹配到一下图标之类的。

@afc163

This comment has been minimized.

Copy link
Member

commented Aug 22, 2019

还有 匹配中 的 loading 文案。

天可
@lewis617

This comment has been minimized.

Copy link
Author

commented Aug 22, 2019

进度条哪里加一个『匹配度』的文案,不然用户可能不知道是啥意思。

还有加一句:为你匹配到一下图标之类的。
还有 匹配中 的 loading 文案。

@afc163 done

@codecov

This comment has been minimized.

Copy link

commented Aug 22, 2019

Codecov Report

Merging #18425 into master will not change coverage.
The diff coverage is n/a.

Impacted file tree graph

@@           Coverage Diff           @@
##           master   #18425   +/-   ##
=======================================
  Coverage    96.4%    96.4%           
=======================================
  Files         280      280           
  Lines        7514     7514           
  Branches     2047     2089   +42     
=======================================
  Hits         7244     7244           
  Misses        268      268           
  Partials        2        2

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update fee5e29...8a1d184. Read the comment docs.

@lewis617 lewis617 changed the title AI 截图搜图标 docs: AI search icon by image Aug 22, 2019

@lewis617 lewis617 changed the title docs: AI search icon by image docs: Search icon by image Aug 22, 2019

@zombieJ

This comment has been minimized.

Copy link
Member

commented Aug 22, 2019

取消、确定 按钮看起来是一样的作用,换成一个“关闭”吧。

site/theme/zh-CN.js Outdated Show resolved Hide resolved
@afc163

This comment has been minimized.

Copy link
Member

commented Aug 22, 2019

另外要不要加个 powered by xxx,给一个你们服务的相关说明?

@lewis617

This comment has been minimized.

Copy link
Author

commented Aug 23, 2019

另外要不要加个 powered by xxx,给一个你们服务的相关说明?

可以,就加 Powered by 阿里-CCO-体验技术,我自己写到代码里,还是你们有统一的 powered by 规范?

天可
@lewis617

This comment has been minimized.

Copy link
Author

commented Aug 23, 2019

取消、确定 按钮看起来是一样的作用,换成一个“关闭”吧。

done, 把整个 footer 都移除了,只剩下右上角的关闭按钮。@zombieJ

@afc163

This comment has been minimized.

Copy link
Member

commented Aug 23, 2019

Powered by 阿里-CCO-体验技术

先不写了吧,这个名字对非阿里用户会比较困惑。

this.setState(() => ({ loading: true }));
try {
const res = await fetch(
'//1647796581073291.cn-shanghai.fc.aliyuncs.com/2016-08-15/proxy/cr-sh.cr-fc-predict__stable/cr-fc-predict/',

This comment has been minimized.

Copy link
@afc163

afc163 Aug 23, 2019

Member

这个服务的 url 看上去很临时。。

This comment has been minimized.

Copy link
@lewis617

lewis617 Aug 23, 2019

Author

这个服务的 url 看上去很临时。。

这个是阿里云函数计算的 url,是长期有效的。

@lewis617

This comment has been minimized.

Copy link
Author

commented Aug 23, 2019

Powered by 阿里-CCO-体验技术

先不写了吧,这个名字对非阿里用户会比较困惑。

好的

@zombieJ

This comment has been minimized.

Copy link
Member

commented Aug 23, 2019

屏幕快照 2019-08-23 上午11 41 02

提供一个关闭功能,点击后 localStorage 存一下就不弹了。
@lewis617

This comment has been minimized.

Copy link
Author

commented Aug 23, 2019

屏幕快照 2019-08-23 上午11 41 02

提供一个关闭功能,点击后 localStorage 存一下就不弹了。

done @zombieJ

天可 added 3 commits Aug 23, 2019
@afc163

This comment has been minimized.

Copy link
Member

commented Aug 23, 2019

image

应该提示没有找到图标?可以用 Result 组件来展示。

@lewis617

This comment has been minimized.

Copy link
Author

commented Aug 23, 2019

image

应该提示没有找到图标?可以用 Result 组件来展示。

没有 404 这种情况,任意图片都会返回相似度最高的图标,你那张图片是因为尺寸太大,超时报错,我在前端添加了压缩图片,限制最大宽高为 300px(因为在模型里也会被压缩),这样就不会因尺寸太大报错了。另外,还用 Result 组件显示了服务端报错信息。
image

天可
@afc163

This comment has been minimized.

Copy link
Member

commented Aug 23, 2019

image

写一下具体报错文案吧。

@lewis617

This comment has been minimized.

Copy link
Author

commented Aug 23, 2019

image

写一下具体报错文案吧。

具体的报错文案有很多种,而且都是英文,个人感觉不建议全部展示出来,另外,在这个图标识别这个场景下,其实出现报错,只有两种原因,一是服务挂了,二是断网。情况一概率非常低,开了很多实例,服务器也支持自动扩容。

@afc163 afc163 merged commit 735b78d into ant-design:master Aug 23, 2019

25 of 27 checks passed

Header rules - ant-design No header rules processed
Details
Pages changed - ant-design 214 new files uploaded
Details
LGTM analysis: JavaScript No new or fixed alerts
Details
Mixed content - ant-design No mixed content detected
Details
Redirect rules - ant-design 18 redirect rules processed
Details
Semantic Pull Request ready to be squashed
Details
WIP Ready for review
Details
ant-design.ant-design #ant design succeeded
Details
ci/circleci: check_metadata Your tests passed on CircleCI!
Details
ci/circleci: compile Your tests passed on CircleCI!
Details
ci/circleci: dist Your tests passed on CircleCI!
Details
ci/circleci: lint Your tests passed on CircleCI!
Details
ci/circleci: setup Your tests passed on CircleCI!
Details
ci/circleci: test_dist Your tests passed on CircleCI!
Details
ci/circleci: test_dist_15 Your tests passed on CircleCI!
Details
ci/circleci: test_dom Your tests passed on CircleCI!
Details
ci/circleci: test_dom_15 Your tests passed on CircleCI!
Details
ci/circleci: test_es Your tests passed on CircleCI!
Details
ci/circleci: test_es_15 Your tests passed on CircleCI!
Details
ci/circleci: test_lib Your tests passed on CircleCI!
Details
ci/circleci: test_lib_15 Your tests passed on CircleCI!
Details
ci/circleci: test_node Your tests passed on CircleCI!
Details
ci/circleci: test_node_15 Your tests passed on CircleCI!
Details
codecov/patch Coverage not affected when comparing fee5e29...8a1d184
Details
codecov/project 96.4% remains the same compared to fee5e29
Details
netlify/ant-design/deploy-preview Deploy preview ready!
Details
security/snyk - package.json (paranoidjk) No manifest changes detected

@pr-triage pr-triage bot added PR: merged and removed PR: unreviewed labels Aug 23, 2019

@afc163 afc163 referenced this pull request Aug 25, 2019
5 of 14 tasks complete
@chenshuai2144 chenshuai2144 referenced this pull request Aug 26, 2019
1 of 10 tasks complete
@MrHeer MrHeer referenced this pull request Aug 27, 2019
1 of 1 task complete
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
3 participants
You can’t perform that action at this time.