From 1185258a2983a305e0cf7efa17a04e5981abccee Mon Sep 17 00:00:00 2001 From: syb01094648 Date: Mon, 23 Oct 2023 14:00:33 +0800 Subject: [PATCH 1/9] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E5=88=9D=E5=A7=8B?= =?UTF-8?q?=E5=8C=96=E9=A1=B5=E9=9D=A2=E4=B8=A4=E6=AC=A1=E5=87=BA=E5=8F=91?= =?UTF-8?q?bbox=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/geojson-editor/index.tsx | 19 ++++++++----------- 1 file changed, 8 insertions(+), 11 deletions(-) diff --git a/src/components/geojson-editor/index.tsx b/src/components/geojson-editor/index.tsx index 9db760a..7a5f641 100644 --- a/src/components/geojson-editor/index.tsx +++ b/src/components/geojson-editor/index.tsx @@ -1,4 +1,4 @@ -import { useDebounceEffect, useMount, useSize } from 'ahooks'; +import { useDebounce, useMount, useSize, useUpdateEffect } from 'ahooks'; import type { editor } from 'monaco-editor'; import * as monacoEditor from 'monaco-editor/esm/vs/editor/editor.api'; import React, { @@ -32,6 +32,7 @@ export const GeoJsonEditor: React.FC = forwardRef((props, ref) => { const { width = 0, height = 0 } = useSize(container) ?? {}; const styles = useStyle(); const [editorTextChange, setEditorTextChange] = useState(''); + const debouncedValue = useDebounce(editorTextChange, { wait: 2000 }); const { t } = useTranslation(); // document format @@ -113,16 +114,12 @@ export const GeoJsonEditor: React.FC = forwardRef((props, ref) => { [scriptContent, t], ); - useDebounceEffect( - () => { - const features = saveEditorText(); - if (autoFitBounds) { - bboxAutoFit(features); - } - }, - [editorTextChange], - { wait: 2000 }, - ); + useUpdateEffect(() => { + const features = saveEditorText(); + if (autoFitBounds) { + bboxAutoFit(features); + } + }, [debouncedValue]); const value = useMemo(() => { if (language === 'javascript') { From 19fe573a11111d01e0c86cd05d9578a3cb240c10 Mon Sep 17 00:00:00 2001 From: syb01094648 Date: Mon, 23 Oct 2023 14:13:26 +0800 Subject: [PATCH 2/9] =?UTF-8?q?fix:=20=E5=91=BD=E5=90=8D=E8=A7=84=E8=8C=83?= =?UTF-8?q?=E4=BF=AE=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/geojson-editor/index.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/components/geojson-editor/index.tsx b/src/components/geojson-editor/index.tsx index 7a5f641..c4d37f4 100644 --- a/src/components/geojson-editor/index.tsx +++ b/src/components/geojson-editor/index.tsx @@ -31,8 +31,8 @@ export const GeoJsonEditor: React.FC = forwardRef((props, ref) => { const [container, setContainer] = useState(null); const { width = 0, height = 0 } = useSize(container) ?? {}; const styles = useStyle(); - const [editorTextChange, setEditorTextChange] = useState(''); - const debouncedValue = useDebounce(editorTextChange, { wait: 2000 }); + const [geoJonText, setGeoJonText] = useState(''); + const debouncedGeoJson = useDebounce(geoJonText, { wait: 2000 }); const { t } = useTranslation(); // document format @@ -83,7 +83,7 @@ export const GeoJsonEditor: React.FC = forwardRef((props, ref) => { const monacoChange = (event: string) => { if (language === 'json') { setEditorText(event); - setEditorTextChange(event); + setGeoJonText(event); return; } setScriptContent?.(event); @@ -119,7 +119,7 @@ export const GeoJsonEditor: React.FC = forwardRef((props, ref) => { if (autoFitBounds) { bboxAutoFit(features); } - }, [debouncedValue]); + }, [debouncedGeoJson]); const value = useMemo(() => { if (language === 'javascript') { From 101775d7f20d3464eb5cdb8d7b875ba025cfd241 Mon Sep 17 00:00:00 2001 From: syb01094648 Date: Mon, 23 Oct 2023 14:21:40 +0800 Subject: [PATCH 3/9] =?UTF-8?q?fix:=20useDebounce=E5=91=BD=E5=90=8D?= =?UTF-8?q?=E8=A7=84=E8=8C=83=E4=BF=AE=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/geojson-editor/index.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/geojson-editor/index.tsx b/src/components/geojson-editor/index.tsx index c4d37f4..1d587b9 100644 --- a/src/components/geojson-editor/index.tsx +++ b/src/components/geojson-editor/index.tsx @@ -32,7 +32,7 @@ export const GeoJsonEditor: React.FC = forwardRef((props, ref) => { const { width = 0, height = 0 } = useSize(container) ?? {}; const styles = useStyle(); const [geoJonText, setGeoJonText] = useState(''); - const debouncedGeoJson = useDebounce(geoJonText, { wait: 2000 }); + const debouncedGeoJsonText = useDebounce(geoJonText, { wait: 2000 }); const { t } = useTranslation(); // document format @@ -119,7 +119,7 @@ export const GeoJsonEditor: React.FC = forwardRef((props, ref) => { if (autoFitBounds) { bboxAutoFit(features); } - }, [debouncedGeoJson]); + }, [debouncedGeoJsonText]); const value = useMemo(() => { if (language === 'javascript') { From 4a400ab7247e9c9ab4594502d77a6d2d6af40746 Mon Sep 17 00:00:00 2001 From: syb01094648 Date: Tue, 24 Oct 2023 18:12:15 +0800 Subject: [PATCH 4/9] =?UTF-8?q?fix:=20iconfont=E7=BB=84=E4=BB=B6=E8=BF=81?= =?UTF-8?q?=E7=A7=BB=E5=88=B0=E6=9C=AC=E5=9C=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/app-header/index.tsx | 2 +- src/components/app-header/styles.ts | 1 + .../map-control-group/clear-control/index.tsx | 2 +- src/constants/icon/demo.css | 539 ++++++++++++++++++ src/constants/icon/demo_index.html | 533 +++++++++++++++++ src/constants/icon/iconfont.css | 75 +++ src/constants/icon/iconfont.js | 1 + src/constants/icon/iconfont.json | 114 ++++ src/constants/icon/iconfont.ttf | Bin 0 -> 5584 bytes src/constants/icon/iconfont.woff | Bin 0 -> 3824 bytes src/constants/icon/iconfont.woff2 | Bin 0 -> 3124 bytes src/constants/iconfont.tsx | 30 + src/constants/index.ts | 8 +- src/pages/index.tsx | 1 + 14 files changed, 1298 insertions(+), 8 deletions(-) create mode 100644 src/constants/icon/demo.css create mode 100644 src/constants/icon/demo_index.html create mode 100644 src/constants/icon/iconfont.css create mode 100644 src/constants/icon/iconfont.js create mode 100644 src/constants/icon/iconfont.json create mode 100644 src/constants/icon/iconfont.ttf create mode 100644 src/constants/icon/iconfont.woff create mode 100644 src/constants/icon/iconfont.woff2 create mode 100644 src/constants/iconfont.tsx diff --git a/src/components/app-header/index.tsx b/src/components/app-header/index.tsx index 6ada5d7..5a216b4 100644 --- a/src/components/app-header/index.tsx +++ b/src/components/app-header/index.tsx @@ -10,7 +10,7 @@ import { Button, Divider, Dropdown, Popover, Space, Tooltip, Tour } from 'antd'; import classNames from 'classnames'; import React, { useEffect, useState } from 'react'; import { useTranslation } from 'react-i18next'; -import { IconFont, LocalStorageKey } from '../../constants'; +import {IconFont ,LocalStorageKey } from '../../constants'; import { useFeature, useGlobal } from '../../recoil'; import type { ToolbarProps } from '../../types/l7editor'; import DownloadBtn from './btn/download-btn'; diff --git a/src/components/app-header/styles.ts b/src/components/app-header/styles.ts index 46a65b7..41f15d1 100644 --- a/src/components/app-header/styles.ts +++ b/src/components/app-header/styles.ts @@ -50,6 +50,7 @@ const useStyle = () => { `, localeIcon: css` font-size: 16px; + `, upload: css` height: 200px; diff --git a/src/components/map-control-group/clear-control/index.tsx b/src/components/map-control-group/clear-control/index.tsx index 1e37d76..f183029 100644 --- a/src/components/map-control-group/clear-control/index.tsx +++ b/src/components/map-control-group/clear-control/index.tsx @@ -27,7 +27,7 @@ export const ClearControl = () => { >
- +
diff --git a/src/constants/icon/demo.css b/src/constants/icon/demo.css new file mode 100644 index 0000000..a67054a --- /dev/null +++ b/src/constants/icon/demo.css @@ -0,0 +1,539 @@ +/* Logo 字体 */ +@font-face { + font-family: "iconfont logo"; + src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834'); + src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'), + url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'), + url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'), + url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg'); +} + +.logo { + font-family: "iconfont logo"; + font-size: 160px; + font-style: normal; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +/* tabs */ +.nav-tabs { + position: relative; +} + +.nav-tabs .nav-more { + position: absolute; + right: 0; + bottom: 0; + height: 42px; + line-height: 42px; + color: #666; +} + +#tabs { + border-bottom: 1px solid #eee; +} + +#tabs li { + cursor: pointer; + width: 100px; + height: 40px; + line-height: 40px; + text-align: center; + font-size: 16px; + border-bottom: 2px solid transparent; + position: relative; + z-index: 1; + margin-bottom: -1px; + color: #666; +} + + +#tabs .active { + border-bottom-color: #f00; + color: #222; +} + +.tab-container .content { + display: none; +} + +/* 页面布局 */ +.main { + padding: 30px 100px; + width: 960px; + margin: 0 auto; +} + +.main .logo { + color: #333; + text-align: left; + margin-bottom: 30px; + line-height: 1; + height: 110px; + margin-top: -50px; + overflow: hidden; + *zoom: 1; +} + +.main .logo a { + font-size: 160px; + color: #333; +} + +.helps { + margin-top: 40px; +} + +.helps pre { + padding: 20px; + margin: 10px 0; + border: solid 1px #e7e1cd; + background-color: #fffdef; + overflow: auto; +} + +.icon_lists { + width: 100% !important; + overflow: hidden; + *zoom: 1; +} + +.icon_lists li { + width: 100px; + margin-bottom: 10px; + margin-right: 20px; + text-align: center; + list-style: none !important; + cursor: default; +} + +.icon_lists li .code-name { + line-height: 1.2; +} + +.icon_lists .icon { + display: block; + height: 100px; + line-height: 100px; + font-size: 42px; + margin: 10px auto; + color: #333; + -webkit-transition: font-size 0.25s linear, width 0.25s linear; + -moz-transition: font-size 0.25s linear, width 0.25s linear; + transition: font-size 0.25s linear, width 0.25s linear; +} + +.icon_lists .icon:hover { + font-size: 100px; +} + +.icon_lists .svg-icon { + /* 通过设置 font-size 来改变图标大小 */ + width: 1em; + /* 图标和文字相邻时，垂直对齐 */ + vertical-align: -0.15em; + /* 通过设置 color 来改变 SVG 的颜色/fill */ + fill: currentColor; + /* path 和 stroke 溢出 viewBox 部分在 IE 下会显示 + normalize.css 中也包含这行 */ + overflow: hidden; +} + +.icon_lists li .name, +.icon_lists li .code-name { + color: #666; +} + +/* markdown 样式 */ +.markdown { + color: #666; + font-size: 14px; + line-height: 1.8; +} + +.highlight { + line-height: 1.5; +} + +.markdown img { + vertical-align: middle; + max-width: 100%; +} + +.markdown h1 { + color: #404040; + font-weight: 500; + line-height: 40px; + margin-bottom: 24px; +} + +.markdown h2, +.markdown h3, +.markdown h4, +.markdown h5, +.markdown h6 { + color: #404040; + margin: 1.6em 0 0.6em 0; + font-weight: 500; + clear: both; +} + +.markdown h1 { + font-size: 28px; +} + +.markdown h2 { + font-size: 22px; +} + +.markdown h3 { + font-size: 16px; +} + +.markdown h4 { + font-size: 14px; +} + +.markdown h5 { + font-size: 12px; +} + +.markdown h6 { + font-size: 12px; +} + +.markdown hr { + height: 1px; + border: 0; + background: #e9e9e9; + margin: 16px 0; + clear: both; +} + +.markdown p { + margin: 1em 0; +} + +.markdown>p, +.markdown>blockquote, +.markdown>.highlight, +.markdown>ol, +.markdown>ul { + width: 80%; +} + +.markdown ul>li { + list-style: circle; +} + +.markdown>ul li, +.markdown blockquote ul>li { + margin-left: 20px; + padding-left: 4px; +} + +.markdown>ul li p, +.markdown>ol li p { + margin: 0.6em 0; +} + +.markdown ol>li { + list-style: decimal; +} + +.markdown>ol li, +.markdown blockquote ol>li { + margin-left: 20px; + padding-left: 4px; +} + +.markdown code { + margin: 0 3px; + padding: 0 5px; + background: #eee; + border-radius: 3px; +} + +.markdown strong, +.markdown b { + font-weight: 600; +} + +.markdown>table { + border-collapse: collapse; + border-spacing: 0px; + empty-cells: show; + border: 1px solid #e9e9e9; + width: 95%; + margin-bottom: 24px; +} + +.markdown>table th { + white-space: nowrap; + color: #333; + font-weight: 600; +} + +.markdown>table th, +.markdown>table td { + border: 1px solid #e9e9e9; + padding: 8px 16px; + text-align: left; +} + +.markdown>table th { + background: #F7F7F7; +} + +.markdown blockquote { + font-size: 90%; + color: #999; + border-left: 4px solid #e9e9e9; + padding-left: 0.8em; + margin: 1em 0; +} + +.markdown blockquote p { + margin: 0; +} + +.markdown .anchor { + opacity: 0; + transition: opacity 0.3s ease; + margin-left: 8px; +} + +.markdown .waiting { + color: #ccc; +} + +.markdown h1:hover .anchor, +.markdown h2:hover .anchor, +.markdown h3:hover .anchor, +.markdown h4:hover .anchor, +.markdown h5:hover .anchor, +.markdown h6:hover .anchor { + opacity: 1; + display: inline-block; +} + +.markdown>br, +.markdown>p>br { + clear: both; +} + + +.hljs { + display: block; + background: white; + padding: 0.5em; + color: #333333; + overflow-x: auto; +} + +.hljs-comment, +.hljs-meta { + color: #969896; +} + +.hljs-string, +.hljs-variable, +.hljs-template-variable, +.hljs-strong, +.hljs-emphasis, +.hljs-quote { + color: #df5000; +} + +.hljs-keyword, +.hljs-selector-tag, +.hljs-type { + color: #a71d5d; +} + +.hljs-literal, +.hljs-symbol, +.hljs-bullet, +.hljs-attribute { + color: #0086b3; +} + +.hljs-section, +.hljs-name { + color: #63a35c; +} + +.hljs-tag { + color: #333333; +} + +.hljs-title, +.hljs-attr, +.hljs-selector-id, +.hljs-selector-class, +.hljs-selector-attr, +.hljs-selector-pseudo { + color: #795da3; +} + +.hljs-addition { + color: #55a532; + background-color: #eaffea; +} + +.hljs-deletion { + color: #bd2c00; + background-color: #ffecec; +} + +.hljs-link { + text-decoration: underline; +} + +/* 代码高亮 */ +/* PrismJS 1.15.0 +https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */ +/** + * prism.js default theme for JavaScript, CSS and HTML + * Based on dabblet (http://dabblet.com) + * @author Lea Verou + */ +code[class*="language-"], +pre[class*="language-"] { + color: black; + background: none; + text-shadow: 0 1px white; + font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; + text-align: left; + white-space: pre; + word-spacing: normal; + word-break: normal; + word-wrap: normal; + line-height: 1.5; + + -moz-tab-size: 4; + -o-tab-size: 4; + tab-size: 4; + + -webkit-hyphens: none; + -moz-hyphens: none; + -ms-hyphens: none; + hyphens: none; +} + +pre[class*="language-"]::-moz-selection, +pre[class*="language-"] ::-moz-selection, +code[class*="language-"]::-moz-selection, +code[class*="language-"] ::-moz-selection { + text-shadow: none; + background: #b3d4fc; +} + +pre[class*="language-"]::selection, +pre[class*="language-"] ::selection, +code[class*="language-"]::selection, +code[class*="language-"] ::selection { + text-shadow: none; + background: #b3d4fc; +} + +@media print { + + code[class*="language-"], + pre[class*="language-"] { + text-shadow: none; + } +} + +/* Code blocks */ +pre[class*="language-"] { + padding: 1em; + margin: .5em 0; + overflow: auto; +} + +:not(pre)>code[class*="language-"], +pre[class*="language-"] { + background: #f5f2f0; +} + +/* Inline code */ +:not(pre)>code[class*="language-"] { + padding: .1em; + border-radius: .3em; + white-space: normal; +} + +.token.comment, +.token.prolog, +.token.doctype, +.token.cdata { + color: slategray; +} + +.token.punctuation { + color: #999; +} + +.namespace { + opacity: .7; +} + +.token.property, +.token.tag, +.token.boolean, +.token.number, +.token.constant, +.token.symbol, +.token.deleted { + color: #905; +} + +.token.selector, +.token.attr-name, +.token.string, +.token.char, +.token.builtin, +.token.inserted { + color: #690; +} + +.token.operator, +.token.entity, +.token.url, +.language-css .token.string, +.style .token.string { + color: #9a6e3a; + background: hsla(0, 0%, 100%, .5); +} + +.token.atrule, +.token.attr-value, +.token.keyword { + color: #07a; +} + +.token.function, +.token.class-name { + color: #DD4A68; +} + +.token.regex, +.token.important, +.token.variable { + color: #e90; +} + +.token.important, +.token.bold { + font-weight: bold; +} + +.token.italic { + font-style: italic; +} + +.token.entity { + cursor: help; +} diff --git a/src/constants/icon/demo_index.html b/src/constants/icon/demo_index.html new file mode 100644 index 0000000..e9c7d62 --- /dev/null +++ b/src/constants/icon/demo_index.html @@ -0,0 +1,533 @@ + + + + + iconfont Demo + + + + + + + + + + + + + +
+

+ + +

+
+
    +
  • Unicode
    • +
  • Font class
    • +
  • Symbol
    • +
+ + 查看项目 + +
+
+
+
    + +
  • + +
    i18n
    +
    
    +
    • + +
  • + +
    图层
    +
    
    +
    • + +
  • + +
    晴天 晚上
    +
    
    +
    • + +
  • + +
    太阳
    +
    
    +
    • + +
  • + +
    智能识别
    +
    
    +
    • + +
  • + +
    中英文切换-英文
    +
    
    +
    • + +
  • + +
    中英文切换-中文
    +
    
    +
    • + +
  • + +
    历史
    +
    
    +
    • + +
  • + +
    json
    +
    
    +
    • + +
  • + +
    logistic
    +
    
    +
    • + +
  • + +
    主题切换 (1)
    +
    
    +
    • + +
  • + +
    地图
    +
    
    +
    • + +
  • + +
    缩放
    +
    
    +
    • + +
  • + +
    清空
    +
    
    +
    • + +
  • + +
    自适应
    +
    
    +
    • + +
+
+

Unicode 引用

+
+ +

Unicode 是字体在网页端最原始的应用方式，特点是：

+
    +
  • 支持按字体的方式去动态调整图标大小，颜色等等。
    • +
  • 默认情况下不支持多色，直接添加多色图标会自动去色。
    • +
+
+

注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）

+
+

Unicode 使用步骤如下：

+

第一步：拷贝项目下面生成的 @font-face

+
@font-face {
+  font-family: 'iconfont';
+  src: url('iconfont.woff2?t=1698137427069') format('woff2'),
+       url('iconfont.woff?t=1698137427069') format('woff'),
+       url('iconfont.ttf?t=1698137427069') format('truetype');
+}
+
+

第二步：定义使用 iconfont 的样式

+
.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+

第三步：挑选相应图标并获取字体编码，应用于页面

+
+<span class="iconfont">&#x33;</span>
+
+
+

"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。

+
+
+
+
+
    + +
  • + +
    + i18n +
    +
    .icon-in +
    +
    • + +
  • + +
    + 图层 +
    +
    .icon-tuceng +
    +
    • + +
  • + +
    + 晴天 晚上 +
    +
    .icon-a-qingtianwanshang +
    +
    • + +
  • + +
    + 太阳 +
    +
    .icon-taiyang +
    +
    • + +
  • + +
    + 智能识别 +
    +
    .icon-zhinengshibie +
    +
    • + +
  • + +
    + 中英文切换-英文 +
    +
    .icon-zhongyingwenqiehuan-yingwen +
    +
    • + +
  • + +
    + 中英文切换-中文 +
    +
    .icon-zhongyingwenqiehuan-zhongwen +
    +
    • + +
  • + +
    + 历史 +
    +
    .icon-lishi +
    +
    • + +
  • + +
    + json +
    +
    .icon-json +
    +
    • + +
  • + +
    + logistic +
    +
    .icon-logistic +
    +
    • + +
  • + +
    + 主题切换 (1) +
    +
    .icon-a-zhutiqiehuan1 +
    +
    • + +
  • + +
    + 地图 +
    +
    .icon-ditu +
    +
    • + +
  • + +
    + 缩放 +
    +
    .icon-suofang +
    +
    • + +
  • + +
    + 清空 +
    +
    .icon-qingkong +
    +
    • + +
  • + +
    + 自适应 +
    +
    .icon-zishiying +
    +
    • + +
+
+

font-class 引用

+
+ +

font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。

+

与 Unicode 使用方式相比，具有如下特点：

+
    +
  • 相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。
    • +
  • 因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。
    • +
+

使用步骤如下：

+

第一步：引入项目下面生成的 fontclass 代码：

+
<link rel="stylesheet" href="./iconfont.css">
+
+

第二步：挑选相应图标并获取类名，应用于页面：

+
<span class="iconfont icon-xxx"></span>
+
+
+

" + iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。

+
+
+
+
+
    + +
  • + +
    i18n
    +
    #icon-in
    +
    • + +
  • + +
    图层
    +
    #icon-tuceng
    +
    • + +
  • + +
    晴天 晚上
    +
    #icon-a-qingtianwanshang
    +
    • + +
  • + +
    太阳
    +
    #icon-taiyang
    +
    • + +
  • + +
    智能识别
    +
    #icon-zhinengshibie
    +
    • + +
  • + +
    中英文切换-英文
    +
    #icon-zhongyingwenqiehuan-yingwen
    +
    • + +
  • + +
    中英文切换-中文
    +
    #icon-zhongyingwenqiehuan-zhongwen
    +
    • + +
  • + +
    历史
    +
    #icon-lishi
    +
    • + +
  • + +
    json
    +
    #icon-json
    +
    • + +
  • + +
    logistic
    +
    #icon-logistic
    +
    • + +
  • + +
    主题切换 (1)
    +
    #icon-a-zhutiqiehuan1
    +
    • + +
  • + +
    地图
    +
    #icon-ditu
    +
    • + +
  • + +
    缩放
    +
    #icon-suofang
    +
    • + +
  • + +
    清空
    +
    #icon-qingkong
    +
    • + +
  • + +
    自适应
    +
    #icon-zishiying
    +
    • + +
+
+

Symbol 引用

+
+ +

这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇文章 + 这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：

+
    +
  • 支持多色图标了，不再受单色限制。
    • +
  • 通过一些技巧，支持像字体那样，通过 font-size, color 来调整样式。
    • +
  • 兼容性较差，支持 IE9+，及现代浏览器。
    • +
  • 浏览器渲染 SVG 的性能一般，还不如 png。
    • +
+

使用步骤如下：

+

第一步：引入项目下面生成的 symbol 代码：

+
<script src="./iconfont.js"></script>
+
+

第二步：加入通用 CSS 代码（引入一次就行）：

+
<style>
+.icon {
+  width: 1em;
+  height: 1em;
+  vertical-align: -0.15em;
+  fill: currentColor;
+  overflow: hidden;
+}
+</style>
+
+

第三步：挑选相应图标并获取类名，应用于页面：

+
<svg class="icon" aria-hidden="true">
+  <use xlink:href="#icon-xxx"></use>
+</svg>
+
+
+
+ +
+
+ + + diff --git a/src/constants/icon/iconfont.css b/src/constants/icon/iconfont.css new file mode 100644 index 0000000..4e5d928 --- /dev/null +++ b/src/constants/icon/iconfont.css @@ -0,0 +1,75 @@ +@font-face { + font-family: "iconfont"; /* Project id 3567033 */ + src: url('iconfont.woff2?t=1698137427069') format('woff2'), + url('iconfont.woff?t=1698137427069') format('woff'), + url('iconfont.ttf?t=1698137427069') format('truetype'); +} + +.iconfont { + font-family: "iconfont" !important; + font-size: 16px; + font-style: normal; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.icon-in:before { + content: "\e669"; +} + +.icon-tuceng:before { + content: "\e615"; +} + +.icon-a-qingtianwanshang:before { + content: "\e614"; +} + +.icon-taiyang:before { + content: "\e613"; +} + +.icon-zhinengshibie:before { + content: "\e81e"; +} + +.icon-zhongyingwenqiehuan-yingwen:before { + content: "\e60f"; +} + +.icon-zhongyingwenqiehuan-zhongwen:before { + content: "\e60e"; +} + +.icon-lishi:before { + content: "\e60d"; +} + +.icon-json:before { + content: "\e7bd"; +} + +.icon-logistic:before { + content: "\e811"; +} + +.icon-a-zhutiqiehuan1:before { + content: "\e606"; +} + +.icon-ditu:before { + content: "\e605"; +} + +.icon-suofang:before { + content: "\e604"; +} + +.icon-qingkong:before { + content: "\e603"; +} + +.icon-zishiying:before { + content: "\e618"; +} + diff --git a/src/constants/icon/iconfont.js b/src/constants/icon/iconfont.js new file mode 100644 index 0000000..e933f51 --- /dev/null +++ b/src/constants/icon/iconfont.js @@ -0,0 +1 @@ +window._iconfont_svg_string_3567033='',function(t){var c=(c=document.getElementsByTagName("script"))[c.length-1],h=c.getAttribute("data-injectcss"),c=c.getAttribute("data-disable-injectsvg");if(!c){var a,l,i,e,o,n=function(c,h){h.parentNode.insertBefore(c,h);};if(h&&!t.__iconfont__svg__cssinject__){t.__iconfont__svg__cssinject__=!0;try{document.write("");}catch(c){console&&console.log(c);}}a=function(){var c,h=document.createElement("div");h.innerHTML=t._iconfont_svg_string_3567033,(h=h.getElementsByTagName("svg")[0])&&(h.setAttribute("aria-hidden","true"),h.style.position="absolute",h.style.width=0,h.style.height=0,h.style.overflow="hidden",h=h,(c=document.body).firstChild?n(h,c.firstChild):c.appendChild(h));},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(a,0):(l=function(){document.removeEventListener("DOMContentLoaded",l,!1),a();},document.addEventListener("DOMContentLoaded",l,!1)):document.attachEvent&&(i=a,e=t.document,o=!1,s(),e.onreadystatechange=function(){"complete"==e.readyState&&(e.onreadystatechange=null,v());});}function v(){o||(o=!0,i());}function s(){try{e.documentElement.doScroll("left");}catch(c){return void setTimeout(s,50);}v();}}(window); \ No newline at end of file diff --git a/src/constants/icon/iconfont.json b/src/constants/icon/iconfont.json new file mode 100644 index 0000000..c924947 --- /dev/null +++ b/src/constants/icon/iconfont.json @@ -0,0 +1,114 @@ +{ + "id": "3567033", + "name": "L7Editor", + "font_family": "iconfont", + "css_prefix_text": "icon-", + "description": "", + "glyphs": [ + { + "icon_id": "13303555", + "name": "i18n", + "font_class": "in", + "unicode": "e669", + "unicode_decimal": 58985 + }, + { + "icon_id": "37579223", + "name": "图层", + "font_class": "tuceng", + "unicode": "e615", + "unicode_decimal": 58901 + }, + { + "icon_id": "37571494", + "name": "晴天 晚上", + "font_class": "a-qingtianwanshang", + "unicode": "e614", + "unicode_decimal": 58900 + }, + { + "icon_id": "37571110", + "name": "太阳", + "font_class": "taiyang", + "unicode": "e613", + "unicode_decimal": 58899 + }, + { + "icon_id": "34499867", + "name": "智能识别", + "font_class": "zhinengshibie", + "unicode": "e81e", + "unicode_decimal": 59422 + }, + { + "icon_id": "37236614", + "name": "中英文切换-英文", + "font_class": "zhongyingwenqiehuan-yingwen", + "unicode": "e60f", + "unicode_decimal": 58895 + }, + { + "icon_id": "37236610", + "name": "中英文切换-中文", + "font_class": "zhongyingwenqiehuan-zhongwen", + "unicode": "e60e", + "unicode_decimal": 58894 + }, + { + "icon_id": "37017029", + "name": "历史", + "font_class": "lishi", + "unicode": "e60d", + "unicode_decimal": 58893 + }, + { + "icon_id": "1444787", + "name": "json", + "font_class": "json", + "unicode": "e7bd", + "unicode_decimal": 59325 + }, + { + "icon_id": "1573888", + "name": "logistic", + "font_class": "logistic", + "unicode": "e811", + "unicode_decimal": 59409 + }, + { + "icon_id": "36866350", + "name": "主题切换 (1)", + "font_class": "a-zhutiqiehuan1", + "unicode": "e606", + "unicode_decimal": 58886 + }, + { + "icon_id": "36863363", + "name": "地图", + "font_class": "ditu", + "unicode": "e605", + "unicode_decimal": 58885 + }, + { + "icon_id": "36861210", + "name": "缩放", + "font_class": "suofang", + "unicode": "e604", + "unicode_decimal": 58884 + }, + { + "icon_id": "36858547", + "name": "清空", + "font_class": "qingkong", + "unicode": "e603", + "unicode_decimal": 58883 + }, + { + "icon_id": "34997067", + "name": "自适应", + "font_class": "zishiying", + "unicode": "e618", + "unicode_decimal": 58904 + } + ] +} diff --git a/src/constants/icon/iconfont.ttf b/src/constants/icon/iconfont.ttf new file mode 100644 index 0000000000000000000000000000000000000000..27fa2b4bee073ca9ca9fcbe707bd265351a98e8d GIT binary patch literal 5584 zcmd@&TW}lKb@%K7y8sCgT)YeE-FO;HGkqj+5_jU3cJ0bDt?kGjDN4q5mDU4m(zN5YqjttI zmpyj@nv$J<^)n0JyXT&J&bjxTdmeX5fDlqm770r_`i4^5osW6W5CUC@-9IoC3U9LY z|2vM);dpdxCNsOiy7?7Cm^N(FlhX?m)8AXXK#1yRgy?@XmCcNMe);FmBJE9V@hL>` z@3BuHjPs;`#kH{ZYfF+oZZo z`|BgIw<%fqy}GC(>_a%z5T?RRCDoEkL{P>QTZKPDR+Vvir7F@vdI+<#_w)Nn&2*-i zCv|ia%0v0@gkd^2nL+twPQW=j3y1;2Rj?`*fo~Eu>iRY29}xF=`3?U{!hoC%QL~8s zJ_OOf$s&@`J*+6UQIv5HnKu_b-UbTx**fLAMKFi=~U8(NQ)@Z4xaJCYJwj5f3=DWT

IWrrx#4M$lBL{eB$Y6ZX~PpDrChmDKl$LL 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 literal 0 HcmV?d00001 diff --git a/src/constants/icon/iconfont.woff b/src/constants/icon/iconfont.woff new file mode 100644 index 0000000000000000000000000000000000000000..56ce880bbc8929a0a0856307c5fc1a1eb7f9dc7e GIT binary patch literal 3824 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 U^8TBvX?HKbwH4Ds(yqw=0Q^S%rT_o{ literal 0 HcmV?d00001 diff --git a/src/constants/icon/iconfont.woff2 b/src/constants/icon/iconfont.woff2 new file mode 100644 index 0000000000000000000000000000000000000000..377cc61bc988ed369a734d2b218d406c2dfbaa01 GIT binary patch literal 3124 zcmV-449oL(Pew8T0RR9101Pw$3jhEB02R;x01M{;0RR9100000000000000000000 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 O4ODBg%%dQ+$p`_MOyI-- literal 0 HcmV?d00001 diff --git a/src/constants/iconfont.tsx b/src/constants/iconfont.tsx new file mode 100644 index 0000000..33f4f8b --- /dev/null +++ b/src/constants/iconfont.tsx @@ -0,0 +1,30 @@ +import classNames from 'classnames'; +import type { CSSProperties } from 'react'; +import React from 'react'; + +interface IconFontProps { + className?: string; + type: string; + style?: CSSProperties; +} + +export const IconFont: React.FC = (props) => { + return ( + + + + ); +}; diff --git a/src/constants/index.ts b/src/constants/index.ts index ff52998..0d3d9e5 100644 --- a/src/constants/index.ts +++ b/src/constants/index.ts @@ -1,5 +1,3 @@ -import { createFromIconfontCN } from '@ant-design/icons'; - export const RightPanelWidthRange = [20, 80]; export enum LocalStorageKey { @@ -40,10 +38,6 @@ export const FeatureKey = { IsEdit: Symbol('isEdit'), }; -export const IconFont = createFromIconfontCN({ - scriptUrl: '//at.alicdn.com/t/a/font_3567033_q8yw5w6air.js', -}); - export const MapBoxConfig = { token: 'pk.eyJ1IjoibGl1dmlnb25nenVvc2hpIiwiYSI6ImNsaGs2czBrcTBvczUzbnFzOHU0dzk2ZWQifQ.hVvTgcbg_Ym-VQz36psLRg', @@ -65,3 +59,5 @@ export enum OfficeLayerEnum { AmapBuildings = 'amapBuildings', GoogleSatellite = 'googleSatellite', } + +export { IconFont } from './iconfont'; diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 415e3bd..355d24f 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -4,6 +4,7 @@ import { useTranslation } from 'react-i18next'; import type { MutableSnapshot } from 'recoil'; import { RecoilEnv, RecoilRoot } from 'recoil'; import { PrimaryColor } from '../constants'; +import '../constants/icon/iconfont.js'; import '../locales/index'; import { activeTabState, From 22260e791c1c39d04ea36bc152a50df5ad554c21 Mon Sep 17 00:00:00 2001 From: syb01094648 Date: Tue, 24 Oct 2023 18:19:14 +0800 Subject: [PATCH 5/9] =?UTF-8?q?fix:=20=E5=88=A0=E9=99=A4=E6=97=A0=E7=94=A8?= =?UTF-8?q?=E4=BB=A3=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/app-header/styles.ts | 1 - src/components/map-control-group/clear-control/index.tsx | 2 +- src/constants/iconfont.tsx | 4 ++-- 3 files changed, 3 insertions(+), 4 deletions(-) diff --git a/src/components/app-header/styles.ts b/src/components/app-header/styles.ts index 41f15d1..46a65b7 100644 --- a/src/components/app-header/styles.ts +++ b/src/components/app-header/styles.ts @@ -50,7 +50,6 @@ const useStyle = () => { `, localeIcon: css` font-size: 16px; - `, upload: css` height: 200px; diff --git a/src/components/map-control-group/clear-control/index.tsx b/src/components/map-control-group/clear-control/index.tsx index f183029..1e37d76 100644 --- a/src/components/map-control-group/clear-control/index.tsx +++ b/src/components/map-control-group/clear-control/index.tsx @@ -27,7 +27,7 @@ export const ClearControl = () => { >

- +
diff --git a/src/constants/iconfont.tsx b/src/constants/iconfont.tsx index 33f4f8b..47d6cf8 100644 --- a/src/constants/iconfont.tsx +++ b/src/constants/iconfont.tsx @@ -3,8 +3,8 @@ import type { CSSProperties } from 'react'; import React from 'react'; interface IconFontProps { - className?: string; type: string; + className?: string; style?: CSSProperties; } @@ -23,7 +23,7 @@ export const IconFont: React.FC = (props) => { focusable="false" className="" > - + ); From bf698c7ccb134aba7b5b3205c6f5fa5afeb6e236 Mon Sep 17 00:00:00 2001 From: syb01094648 Date: Tue, 24 Oct 2023 18:20:36 +0800 Subject: [PATCH 6/9] =?UTF-8?q?fix:=20=E7=89=88=E6=9C=AC=E5=8D=87=E7=BA=A7?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 197bb94..0a76233 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@antv/l7-editor", - "version": "1.1.3", + "version": "1.1.4", "description": "Geographic data editing tool based on L7", "files": [ "lib", From 3e18f96109143b550d95e7464408f0e71087b710 Mon Sep 17 00:00:00 2001 From: syb01094648 Date: Tue, 24 Oct 2023 18:22:28 +0800 Subject: [PATCH 7/9] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D#=E9=97=AE?= =?UTF-8?q?=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/constants/iconfont.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/constants/iconfont.tsx b/src/constants/iconfont.tsx index 47d6cf8..8fd25b4 100644 --- a/src/constants/iconfont.tsx +++ b/src/constants/iconfont.tsx @@ -23,7 +23,7 @@ export const IconFont: React.FC = (props) => { focusable="false" className="" > - + ); From ccec0b82c7c320d21be9b0468bb01efd52fc5db7 Mon Sep 17 00:00:00 2001 From: syb01094648 Date: Tue, 24 Oct 2023 18:31:26 +0800 Subject: [PATCH 8/9] =?UTF-8?q?fix:=20=E5=88=A0=E9=99=A4icon=E6=96=87?= =?UTF-8?q?=E4=BB=B6=E5=8F=AA=E4=BF=9D=E7=95=99js=E6=96=87=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/app-header/index.tsx | 2 +- src/constants/icon/demo.css | 539 --------------------------- src/constants/icon/demo_index.html | 533 -------------------------- src/constants/icon/iconfont.css | 75 ---- src/constants/icon/iconfont.json | 114 ------ src/constants/icon/iconfont.ttf | Bin 5584 -> 0 bytes src/constants/icon/iconfont.woff | Bin 3824 -> 0 bytes src/constants/icon/iconfont.woff2 | Bin 3124 -> 0 bytes src/constants/{icon => }/iconfont.js | 0 src/pages/index.tsx | 2 +- 10 files changed, 2 insertions(+), 1263 deletions(-) delete mode 100644 src/constants/icon/demo.css delete mode 100644 src/constants/icon/demo_index.html delete mode 100644 src/constants/icon/iconfont.css delete mode 100644 src/constants/icon/iconfont.json delete mode 100644 src/constants/icon/iconfont.ttf delete mode 100644 src/constants/icon/iconfont.woff delete mode 100644 src/constants/icon/iconfont.woff2 rename src/constants/{icon => }/iconfont.js (100%) diff --git a/src/components/app-header/index.tsx b/src/components/app-header/index.tsx index 5a216b4..6ada5d7 100644 --- a/src/components/app-header/index.tsx +++ b/src/components/app-header/index.tsx @@ -10,7 +10,7 @@ import { Button, Divider, Dropdown, Popover, Space, Tooltip, Tour } from 'antd'; import classNames from 'classnames'; import React, { useEffect, useState } from 'react'; import { useTranslation } from 'react-i18next'; -import {IconFont ,LocalStorageKey } from '../../constants'; +import { IconFont, LocalStorageKey } from '../../constants'; import { useFeature, useGlobal } from '../../recoil'; import type { ToolbarProps } from '../../types/l7editor'; import DownloadBtn from './btn/download-btn'; diff --git a/src/constants/icon/demo.css b/src/constants/icon/demo.css deleted file mode 100644 index a67054a..0000000 --- a/src/constants/icon/demo.css +++ /dev/null @@ -1,539 +0,0 @@ -/* Logo 字体 */ -@font-face { - font-family: "iconfont logo"; - src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834'); - src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'), - url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'), - url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'), - url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg'); -} - -.logo { - font-family: "iconfont logo"; - font-size: 160px; - font-style: normal; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; -} - -/* tabs */ -.nav-tabs { - position: relative; -} - -.nav-tabs .nav-more { - position: absolute; - right: 0; - bottom: 0; - height: 42px; - line-height: 42px; - color: #666; -} - -#tabs { - border-bottom: 1px solid #eee; -} - -#tabs li { - cursor: pointer; - width: 100px; - height: 40px; - line-height: 40px; - text-align: center; - font-size: 16px; - border-bottom: 2px solid transparent; - position: relative; - z-index: 1; - margin-bottom: -1px; - color: #666; -} - - -#tabs .active { - border-bottom-color: #f00; - color: #222; -} - -.tab-container .content { - display: none; -} - -/* 页面布局 */ -.main { - padding: 30px 100px; - width: 960px; - margin: 0 auto; -} - -.main .logo { - color: #333; - text-align: left; - margin-bottom: 30px; - line-height: 1; - height: 110px; - margin-top: -50px; - overflow: hidden; - *zoom: 1; -} - -.main .logo a { - font-size: 160px; - color: #333; -} - -.helps { - margin-top: 40px; -} - -.helps pre { - padding: 20px; - margin: 10px 0; - border: solid 1px #e7e1cd; - background-color: #fffdef; - overflow: auto; -} - -.icon_lists { - width: 100% !important; - overflow: hidden; - *zoom: 1; -} - -.icon_lists li { - width: 100px; - margin-bottom: 10px; - margin-right: 20px; - text-align: center; - list-style: none !important; - cursor: default; -} - -.icon_lists li .code-name { - line-height: 1.2; -} - -.icon_lists .icon { - display: block; - height: 100px; - line-height: 100px; - font-size: 42px; - margin: 10px auto; - color: #333; - -webkit-transition: font-size 0.25s linear, width 0.25s linear; - -moz-transition: font-size 0.25s linear, width 0.25s linear; - transition: font-size 0.25s linear, width 0.25s linear; -} - -.icon_lists .icon:hover { - font-size: 100px; -} - -.icon_lists .svg-icon { - /* 通过设置 font-size 来改变图标大小 */ - width: 1em; - /* 图标和文字相邻时，垂直对齐 */ - vertical-align: -0.15em; - /* 通过设置 color 来改变 SVG 的颜色/fill */ - fill: currentColor; - /* path 和 stroke 溢出 viewBox 部分在 IE 下会显示 - normalize.css 中也包含这行 */ - overflow: hidden; -} - -.icon_lists li .name, -.icon_lists li .code-name { - color: #666; -} - -/* markdown 样式 */ -.markdown { - color: #666; - font-size: 14px; - line-height: 1.8; -} - -.highlight { - line-height: 1.5; -} - -.markdown img { - vertical-align: middle; - max-width: 100%; -} - -.markdown h1 { - color: #404040; - font-weight: 500; - line-height: 40px; - margin-bottom: 24px; -} - -.markdown h2, -.markdown h3, -.markdown h4, -.markdown h5, -.markdown h6 { - color: #404040; - margin: 1.6em 0 0.6em 0; - font-weight: 500; - clear: both; -} - -.markdown h1 { - font-size: 28px; -} - -.markdown h2 { - font-size: 22px; -} - -.markdown h3 { - font-size: 16px; -} - -.markdown h4 { - font-size: 14px; -} - -.markdown h5 { - font-size: 12px; -} - -.markdown h6 { - font-size: 12px; -} - -.markdown hr { - height: 1px; - border: 0; - background: #e9e9e9; - margin: 16px 0; - clear: both; -} - -.markdown p { - margin: 1em 0; -} - -.markdown>p, -.markdown>blockquote, -.markdown>.highlight, -.markdown>ol, -.markdown>ul { - width: 80%; -} - -.markdown ul>li { - list-style: circle; -} - -.markdown>ul li, -.markdown blockquote ul>li { - margin-left: 20px; - padding-left: 4px; -} - -.markdown>ul li p, -.markdown>ol li p { - margin: 0.6em 0; -} - -.markdown ol>li { - list-style: decimal; -} - -.markdown>ol li, -.markdown blockquote ol>li { - margin-left: 20px; - padding-left: 4px; -} - -.markdown code { - margin: 0 3px; - padding: 0 5px; - background: #eee; - border-radius: 3px; -} - -.markdown strong, -.markdown b { - font-weight: 600; -} - -.markdown>table { - border-collapse: collapse; - border-spacing: 0px; - empty-cells: show; - border: 1px solid #e9e9e9; - width: 95%; - margin-bottom: 24px; -} - -.markdown>table th { - white-space: nowrap; - color: #333; - font-weight: 600; -} - -.markdown>table th, -.markdown>table td { - border: 1px solid #e9e9e9; - padding: 8px 16px; - text-align: left; -} - -.markdown>table th { - background: #F7F7F7; -} - -.markdown blockquote { - font-size: 90%; - color: #999; - border-left: 4px solid #e9e9e9; - padding-left: 0.8em; - margin: 1em 0; -} - -.markdown blockquote p { - margin: 0; -} - -.markdown .anchor { - opacity: 0; - transition: opacity 0.3s ease; - margin-left: 8px; -} - -.markdown .waiting { - color: #ccc; -} - -.markdown h1:hover .anchor, -.markdown h2:hover .anchor, -.markdown h3:hover .anchor, -.markdown h4:hover .anchor, -.markdown h5:hover .anchor, -.markdown h6:hover .anchor { - opacity: 1; - display: inline-block; -} - -.markdown>br, -.markdown>p>br { - clear: both; -} - - -.hljs { - display: block; - background: white; - padding: 0.5em; - color: #333333; - overflow-x: auto; -} - -.hljs-comment, -.hljs-meta { - color: #969896; -} - -.hljs-string, -.hljs-variable, -.hljs-template-variable, -.hljs-strong, -.hljs-emphasis, -.hljs-quote { - color: #df5000; -} - -.hljs-keyword, -.hljs-selector-tag, -.hljs-type { - color: #a71d5d; -} - -.hljs-literal, -.hljs-symbol, -.hljs-bullet, -.hljs-attribute { - color: #0086b3; -} - -.hljs-section, -.hljs-name { - color: #63a35c; -} - -.hljs-tag { - color: #333333; -} - -.hljs-title, -.hljs-attr, -.hljs-selector-id, -.hljs-selector-class, -.hljs-selector-attr, -.hljs-selector-pseudo { - color: #795da3; -} - -.hljs-addition { - color: #55a532; - background-color: #eaffea; -} - -.hljs-deletion { - color: #bd2c00; - background-color: #ffecec; -} - -.hljs-link { - text-decoration: underline; -} - -/* 代码高亮 */ -/* PrismJS 1.15.0 -https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */ -/** - * prism.js default theme for JavaScript, CSS and HTML - * Based on dabblet (http://dabblet.com) - * @author Lea Verou - */ -code[class*="language-"], -pre[class*="language-"] { - color: black; - background: none; - text-shadow: 0 1px white; - font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; - text-align: left; - white-space: pre; - word-spacing: normal; - word-break: normal; - word-wrap: normal; - line-height: 1.5; - - -moz-tab-size: 4; - -o-tab-size: 4; - tab-size: 4; - - -webkit-hyphens: none; - -moz-hyphens: none; - -ms-hyphens: none; - hyphens: none; -} - -pre[class*="language-"]::-moz-selection, -pre[class*="language-"] ::-moz-selection, -code[class*="language-"]::-moz-selection, -code[class*="language-"] ::-moz-selection { - text-shadow: none; - background: #b3d4fc; -} - -pre[class*="language-"]::selection, -pre[class*="language-"] ::selection, -code[class*="language-"]::selection, -code[class*="language-"] ::selection { - text-shadow: none; - background: #b3d4fc; -} - -@media print { - - code[class*="language-"], - pre[class*="language-"] { - text-shadow: none; - } -} - -/* Code blocks */ -pre[class*="language-"] { - padding: 1em; - margin: .5em 0; - overflow: auto; -} - -:not(pre)>code[class*="language-"], -pre[class*="language-"] { - background: #f5f2f0; -} - -/* Inline code */ -:not(pre)>code[class*="language-"] { - padding: .1em; - border-radius: .3em; - white-space: normal; -} - -.token.comment, -.token.prolog, -.token.doctype, -.token.cdata { - color: slategray; -} - -.token.punctuation { - color: #999; -} - -.namespace { - opacity: .7; -} - -.token.property, -.token.tag, -.token.boolean, -.token.number, -.token.constant, -.token.symbol, -.token.deleted { - color: #905; -} - -.token.selector, -.token.attr-name, -.token.string, -.token.char, -.token.builtin, -.token.inserted { - color: #690; -} - -.token.operator, -.token.entity, -.token.url, -.language-css .token.string, -.style .token.string { - color: #9a6e3a; - background: hsla(0, 0%, 100%, .5); -} - -.token.atrule, -.token.attr-value, -.token.keyword { - color: #07a; -} - -.token.function, -.token.class-name { - color: #DD4A68; -} - -.token.regex, -.token.important, -.token.variable { - color: #e90; -} - -.token.important, -.token.bold { - font-weight: bold; -} - -.token.italic { - font-style: italic; -} - -.token.entity { - cursor: help; -} diff --git a/src/constants/icon/demo_index.html b/src/constants/icon/demo_index.html deleted file mode 100644 index e9c7d62..0000000 --- a/src/constants/icon/demo_index.html +++ /dev/null @@ -1,533 +0,0 @@ - - - - - iconfont Demo - - - - - - - - - - - - - -
-

- - -

-
-
    -
  • Unicode
    • -
  • Font class
    • -
  • Symbol
    • -
- - 查看项目 - -
-
-
-
    - -
  • - -
    i18n
    -
    &#xe669;
    -
    • - -
  • - -
    图层
    -
    &#xe615;
    -
    • - -
  • - -
    晴天 晚上
    -
    &#xe614;
    -
    • - -
  • - -
    太阳
    -
    &#xe613;
    -
    • - -
  • - -
    智能识别
    -
    &#xe81e;
    -
    • - -
  • - -
    中英文切换-英文
    -
    &#xe60f;
    -
    • - -
  • - -
    中英文切换-中文
    -
    &#xe60e;
    -
    • - -
  • - -
    历史
    -
    &#xe60d;
    -
    • - -
  • - -
    json
    -
    &#xe7bd;
    -
    • - -
  • - -
    logistic
    -
    &#xe811;
    -
    • - -
  • - -
    主题切换 (1)
    -
    &#xe606;
    -
    • - -
  • - -
    地图
    -
    &#xe605;
    -
    • - -
  • - -
    缩放
    -
    &#xe604;
    -
    • - -
  • - -
    清空
    -
    &#xe603;
    -
    • - -
  • - -
    自适应
    -
    &#xe618;
    -
    • - -
-
-

Unicode 引用

-
- -

Unicode 是字体在网页端最原始的应用方式，特点是：

-
    -
  • 支持按字体的方式去动态调整图标大小，颜色等等。
    • -
  • 默认情况下不支持多色，直接添加多色图标会自动去色。
    • -
-
-

注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）

-
-

Unicode 使用步骤如下：

-

第一步：拷贝项目下面生成的 @font-face

-
@font-face {
-  font-family: 'iconfont';
-  src: url('iconfont.woff2?t=1698137427069') format('woff2'),
-       url('iconfont.woff?t=1698137427069') format('woff'),
-       url('iconfont.ttf?t=1698137427069') format('truetype');
-}
-
-

第二步：定义使用 iconfont 的样式

-
.iconfont {
-  font-family: "iconfont" !important;
-  font-size: 16px;
-  font-style: normal;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-

第三步：挑选相应图标并获取字体编码，应用于页面

-
-<span class="iconfont">&#x33;</span>
-
-
-

"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。

-
-
-
-
-
    - -
  • - -
    - i18n -
    -
    .icon-in -
    -
    • - -
  • - -
    - 图层 -
    -
    .icon-tuceng -
    -
    • - -
  • - -
    - 晴天 晚上 -
    -
    .icon-a-qingtianwanshang -
    -
    • - -
  • - -
    - 太阳 -
    -
    .icon-taiyang -
    -
    • - -
  • - -
    - 智能识别 -
    -
    .icon-zhinengshibie -
    -
    • - -
  • - -
    - 中英文切换-英文 -
    -
    .icon-zhongyingwenqiehuan-yingwen -
    -
    • - -
  • - -
    - 中英文切换-中文 -
    -
    .icon-zhongyingwenqiehuan-zhongwen -
    -
    • - -
  • - -
    - 历史 -
    -
    .icon-lishi -
    -
    • - -
  • - -
    - json -
    -
    .icon-json -
    -
    • - -
  • - -
    - logistic -
    -
    .icon-logistic -
    -
    • - -
  • - -
    - 主题切换 (1) -
    -
    .icon-a-zhutiqiehuan1 -
    -
    • - -
  • - -
    - 地图 -
    -
    .icon-ditu -
    -
    • - -
  • - -
    - 缩放 -
    -
    .icon-suofang -
    -
    • - -
  • - -
    - 清空 -
    -
    .icon-qingkong -
    -
    • - -
  • - -
    - 自适应 -
    -
    .icon-zishiying -
    -
    • - -
-
-

font-class 引用

-
- -

font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。

-

与 Unicode 使用方式相比，具有如下特点：

-
    -
  • 相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。
    • -
  • 因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。
    • -
-

使用步骤如下：

-

第一步：引入项目下面生成的 fontclass 代码：

-
<link rel="stylesheet" href="./iconfont.css">
-
-

第二步：挑选相应图标并获取类名，应用于页面：

-
<span class="iconfont icon-xxx"></span>
-
-
-

" - iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。

-
-
-
-
-
    - -
  • - -
    i18n
    -
    #icon-in
    -
    • - -
  • - -
    图层
    -
    #icon-tuceng
    -
    • - -
  • - -
    晴天 晚上
    -
    #icon-a-qingtianwanshang
    -
    • - -
  • - -
    太阳
    -
    #icon-taiyang
    -
    • - -
  • - -
    智能识别
    -
    #icon-zhinengshibie
    -
    • - -
  • - -
    中英文切换-英文
    -
    #icon-zhongyingwenqiehuan-yingwen
    -
    • - -
  • - -
    中英文切换-中文
    -
    #icon-zhongyingwenqiehuan-zhongwen
    -
    • - -
  • - -
    历史
    -
    #icon-lishi
    -
    • - -
  • - -
    json
    -
    #icon-json
    -
    • - -
  • - -
    logistic
    -
    #icon-logistic
    -
    • - -
  • - -
    主题切换 (1)
    -
    #icon-a-zhutiqiehuan1
    -
    • - -
  • - -
    地图
    -
    #icon-ditu
    -
    • - -
  • - -
    缩放
    -
    #icon-suofang
    -
    • - -
  • - -
    清空
    -
    #icon-qingkong
    -
    • - -
  • - -
    自适应
    -
    #icon-zishiying
    -
    • - -
-
-

Symbol 引用

-
- -

这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇文章 - 这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：

-
    -
  • 支持多色图标了，不再受单色限制。
    • -
  • 通过一些技巧，支持像字体那样，通过 font-size, color 来调整样式。
    • -
  • 兼容性较差，支持 IE9+，及现代浏览器。
    • -
  • 浏览器渲染 SVG 的性能一般，还不如 png。
    • -
-

使用步骤如下：

-

第一步：引入项目下面生成的 symbol 代码：

-
<script src="./iconfont.js"></script>
-
-

第二步：加入通用 CSS 代码（引入一次就行）：

-
<style>
-.icon {
-  width: 1em;
-  height: 1em;
-  vertical-align: -0.15em;
-  fill: currentColor;
-  overflow: hidden;
-}
-</style>
-
-

第三步：挑选相应图标并获取类名，应用于页面：

-
<svg class="icon" aria-hidden="true">
-  <use xlink:href="#icon-xxx"></use>
-</svg>
-
-
-
- -
-
- - - diff --git a/src/constants/icon/iconfont.css b/src/constants/icon/iconfont.css deleted file mode 100644 index 4e5d928..0000000 --- a/src/constants/icon/iconfont.css +++ /dev/null @@ -1,75 +0,0 @@ -@font-face { - font-family: "iconfont"; /* Project id 3567033 */ - src: url('iconfont.woff2?t=1698137427069') format('woff2'), - url('iconfont.woff?t=1698137427069') format('woff'), - url('iconfont.ttf?t=1698137427069') format('truetype'); -} - -.iconfont { - font-family: "iconfont" !important; - font-size: 16px; - font-style: normal; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; -} - -.icon-in:before { - content: "\e669"; -} - -.icon-tuceng:before { - content: "\e615"; -} - -.icon-a-qingtianwanshang:before { - content: "\e614"; -} - -.icon-taiyang:before { - content: "\e613"; -} - -.icon-zhinengshibie:before { - content: "\e81e"; -} - -.icon-zhongyingwenqiehuan-yingwen:before { - content: "\e60f"; -} - -.icon-zhongyingwenqiehuan-zhongwen:before { - content: "\e60e"; -} - -.icon-lishi:before { - content: "\e60d"; -} - -.icon-json:before { - content: "\e7bd"; -} - -.icon-logistic:before { - content: "\e811"; -} - -.icon-a-zhutiqiehuan1:before { - content: "\e606"; -} - -.icon-ditu:before { - content: "\e605"; -} - -.icon-suofang:before { - content: "\e604"; -} - -.icon-qingkong:before { - content: "\e603"; -} - -.icon-zishiying:before { - content: "\e618"; -} - diff --git a/src/constants/icon/iconfont.json b/src/constants/icon/iconfont.json deleted file mode 100644 index c924947..0000000 --- a/src/constants/icon/iconfont.json +++ /dev/null @@ -1,114 +0,0 @@ -{ - "id": "3567033", - "name": "L7Editor", - "font_family": "iconfont", - "css_prefix_text": "icon-", - "description": "", - "glyphs": [ - { - "icon_id": "13303555", - "name": "i18n", - "font_class": "in", - "unicode": "e669", - "unicode_decimal": 58985 - }, - { - "icon_id": "37579223", - "name": "图层", - "font_class": "tuceng", - "unicode": "e615", - "unicode_decimal": 58901 - }, - { - "icon_id": "37571494", - "name": "晴天 晚上", - "font_class": "a-qingtianwanshang", - "unicode": "e614", - "unicode_decimal": 58900 - }, - { - "icon_id": "37571110", - "name": "太阳", - "font_class": "taiyang", - "unicode": "e613", - "unicode_decimal": 58899 - }, - { - "icon_id": "34499867", - "name": "智能识别", - "font_class": "zhinengshibie", - "unicode": "e81e", - "unicode_decimal": 59422 - }, - { - "icon_id": "37236614", - "name": "中英文切换-英文", - "font_class": "zhongyingwenqiehuan-yingwen", - "unicode": "e60f", - "unicode_decimal": 58895 - }, - { - "icon_id": "37236610", - "name": "中英文切换-中文", - "font_class": "zhongyingwenqiehuan-zhongwen", - "unicode": "e60e", - "unicode_decimal": 58894 - }, - { - "icon_id": "37017029", - "name": "历史", - "font_class": "lishi", - "unicode": "e60d", - "unicode_decimal": 58893 - }, - { - "icon_id": "1444787", - "name": "json", - "font_class": "json", - "unicode": "e7bd", - "unicode_decimal": 59325 - }, - { - "icon_id": "1573888", - "name": "logistic", - "font_class": "logistic", - "unicode": "e811", - "unicode_decimal": 59409 - }, - { - "icon_id": "36866350", - "name": "主题切换 (1)", - "font_class": "a-zhutiqiehuan1", - "unicode": "e606", - "unicode_decimal": 58886 - }, - { - "icon_id": "36863363", - "name": "地图", - "font_class": "ditu", - "unicode": "e605", - "unicode_decimal": 58885 - }, - { - "icon_id": "36861210", - "name": "缩放", - "font_class": "suofang", - "unicode": "e604", - "unicode_decimal": 58884 - }, - { - "icon_id": "36858547", - "name": "清空", - "font_class": "qingkong", - "unicode": "e603", - "unicode_decimal": 58883 - }, - { - "icon_id": "34997067", - "name": "自适应", - "font_class": "zishiying", - "unicode": "e618", - "unicode_decimal": 58904 - } - ] -} diff --git a/src/constants/icon/iconfont.ttf b/src/constants/icon/iconfont.ttf deleted file mode 100644 index 27fa2b4bee073ca9ca9fcbe707bd265351a98e8d..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 5584 zcmd@&TW}lKb@%K7y8sCgT)YeE-FO;HGkqj+5_jU3cJ0bDt?kGjDN4q5mDU4m(zN5YqjttI zmpyj@nv$J<^)n0JyXT&J&bjxTdmeX5fDlqm770r_`i4^5osW6W5CUC@-9IoC3U9LY z|2vM);dpdxCNsOiy7?7Cm^N(FlhX?m)8AXXK#1yRgy?@XmCcNMe);FmBJE9V@hL>` z@3BuHjPs;`#kH{ZYfF+oZZo z`|BgIw<%fqy}GC(>_a%z5T?RRCDoEkL{P>QTZKPDR+Vvir7F@vdI+<#_w)Nn&2*-i zCv|ia%0v0@gkd^2nL+twPQW=j3y1;2Rj?`*fo~Eu>iRY29}xF=`3?U{!hoC%QL~8s zJ_OOf$s&@`J*+6UQIv5HnKu_b-UbTx**fLAMKFi=~U8(NQ)@Z4xaJCYJwj5f3=DWT

IWrrx#4M$lBL{eB$Y6ZX~PpDrChmDKl$LL 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 diff --git a/src/constants/icon/iconfont.woff b/src/constants/icon/iconfont.woff deleted file mode 100644 index 56ce880bbc8929a0a0856307c5fc1a1eb7f9dc7e..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 3824 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 U^8TBvX?HKbwH4Ds(yqw=0Q^S%rT_o{ diff --git a/src/constants/icon/iconfont.woff2 b/src/constants/icon/iconfont.woff2 deleted file mode 100644 index 377cc61bc988ed369a734d2b218d406c2dfbaa01..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 3124 zcmV-449oL(Pew8T0RR9101Pw$3jhEB02R;x01M{;0RR9100000000000000000000 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 O4ODBg%%dQ+$p`_MOyI-- diff --git a/src/constants/icon/iconfont.js b/src/constants/iconfont.js similarity index 100% rename from src/constants/icon/iconfont.js rename to src/constants/iconfont.js diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 355d24f..afca66b 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -4,7 +4,7 @@ import { useTranslation } from 'react-i18next'; import type { MutableSnapshot } from 'recoil'; import { RecoilEnv, RecoilRoot } from 'recoil'; import { PrimaryColor } from '../constants'; -import '../constants/icon/iconfont.js'; +import '../constants/iconfont.js'; import '../locales/index'; import { activeTabState, From 6e385971d4818ca1e1eef1e7d45afad04696d038 Mon Sep 17 00:00:00 2001 From: syb01094648 Date: Wed, 25 Oct 2023 10:23:31 +0800 Subject: [PATCH 9/9] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8Dci=E9=97=AE?= =?UTF-8?q?=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../map-control-group/save-map-options-control/index.tsx | 3 ++- src/constants/iconfont.tsx | 2 ++ 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/src/components/map-control-group/save-map-options-control/index.tsx b/src/components/map-control-group/save-map-options-control/index.tsx index f7724cd..a0d2552 100644 --- a/src/components/map-control-group/save-map-options-control/index.tsx +++ b/src/components/map-control-group/save-map-options-control/index.tsx @@ -3,6 +3,7 @@ import { Tooltip, message } from 'antd'; import classNames from 'classnames'; import React from 'react'; import { useTranslation } from 'react-i18next'; +import { IconFont } from '../../../constants'; import { useGlobal } from '../../../recoil'; import useStyle from './styles'; @@ -35,7 +36,7 @@ const SaveMapOptionsControl: React.FC = () => { onClick={onSave} type="button" > - + diff --git a/src/constants/iconfont.tsx b/src/constants/iconfont.tsx index 8fd25b4..6f36254 100644 --- a/src/constants/iconfont.tsx +++ b/src/constants/iconfont.tsx @@ -6,11 +6,13 @@ interface IconFontProps { type: string; className?: string; style?: CSSProperties; + id?: string; } export const IconFont: React.FC = (props) => { return (