优化标绘demo工具条风格

Author: hhyu1

examples/css/iconfont/iconfont.css

@@ -1,8 +1,8 @@
 @font-face {
  font-family: "iconfont"; /* Project id 2870365 */
- src: url('iconfont.woff2?t=1639987680083') format('woff2'),
- url('iconfont.woff?t=1639987680083') format('woff'),
- url('iconfont.ttf?t=1639987680083') format('truetype');
+ src: url('iconfont.woff2?t=1640312324096') format('woff2'),
+ url('iconfont.woff?t=1640312324096') format('woff'),
+ url('iconfont.ttf?t=1640312324096') format('truetype');
 }
 
 .iconfont {
@@ -13,6 +13,18 @@
  -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-copy2:before {
+ content: "\e629";
+}
+
+.icon-circle-wrong:before {
+ content: "\e69a";
+}
+
+.icon-copy1:before {
+ content: "\e628";
+}
+
 .icon-multiflag:before {
  content: "\e625";
 }

examples/css/iconfont/iconfont.ttf

@@ -13,8 +13,8 @@
  box-shadow: 0 0 3px #999;
  color: #f0f0f0;
  cursor: default;
- font-size: 10px;
- line-height: 12px;
+ font-size: 20px;
+ /* line-height: 12px; */
  /* text-indent: 3px; */
  position: absolute;
  /* top: 2px; */
@@ -29,9 +29,9 @@
  border: 0;
  outline: 0;
  font-family: Helvetica, Arial, sans-serif;
- font-size: 18px;
+ font-size: 20px;
  font-weight: normal;
- line-height: 30px;
+ line-height: 32px;
  color: #000;
  vertical-align: baseline;
  list-style-type: none;
@@ -46,7 +46,7 @@
  border: 2px solid rgba(0, 0, 0, 0.2);
  background-clip: padding-box;
  box-shadow: none;
- width: 30px;
+ width: 32px;
  overflow: visible;
  /* box-shadow: 0 1px 5px rgba(0,0,0,0.65); */
  border-radius: 4px;
@@ -64,9 +64,9 @@
 .plotting-menu > li,
 .plotting-menu > li:hover {
 background-color: #fff;
-border-bottom: 1px solid #ccc;
-width: 30px;
-height: 30px;
+border-bottom: 0px solid #ccc;
+width: 32px;
+height: 32px;
 /* line-height: 18px; */
 display: block;
 /* text-align: center; */
@@ -104,7 +104,7 @@
 /* background-position: 8px;
  background-repeat: no-repeat; */
  color: #000;
- font-size: 18px;
+ font-size: 20px;
  font-weight: normal;
  /* min-height: 20px; */
  text-decoration: none;
@@ -131,8 +131,8 @@
  position: absolute;
  left: -1px;
  top: -1px;
- width: 60px;
- height: 30px;
+ width: 64px;
+ height: 32px;
  /* overflow: hidden; */
  background-color: #fff;
  background-color: rgba(255, 255, 255, 1);
@@ -147,7 +147,7 @@
 }
 
 .plotting-menu > li > ul > li {
- width: 30px;
+ width: 32px;
  padding: 0px;
  /* vertical-align: baseline; */
  float: left;

examples/css/iconfont/iconfont.woff

@@ -32,8 +32,7 @@
  z-index: 888;
  left: 260px;
  color: #000000;
- ba
- ckground-color: #fff;
+ background-color: #fff;
  }
 
  /* #drawMenu {
@@ -164,11 +163,11 @@
  </div>
 </div>
 <div id="plottingMenu" class="plotting-menu">
- <li><span class="icon iconfont icon-stop" title="取消标绘"
+ <li><span class="icon iconfont icon-circle-wrong" title="取消标绘"
  onclick="cancelDraw()"></span></li>
  <li>
  <i class="icon iconfont icon-draw"></i>
- <ul style="width: 150px;">
+ <ul style="width: 160px;">
  <li><span class="icon iconfont icon-draw" title="添加图层"
  onclick="addPlottingLayer()"></span></li>
  <li><span class="icon iconfont icon-lock" title="图层可锁定"
@@ -183,7 +182,7 @@
  </li>
  <li>
  <i class="icon iconfont icon-bound-rectangle-edit"></i>
- <ul style="width: 120px;">
+ <ul style="width: 128px;">
  <li><span class="icon iconfont icon-bound-rectangle-edit" title="外接矩形编辑"
  onclick="editCircusRetangle()"></span></li>
  <li><span class="icon iconfont icon-node-edit" title="节点编辑"
@@ -195,9 +194,9 @@
  </ul>
  </li>
  <li>
- <i class="icon iconfont icon-copy"></i>
- <ul style="width: 180px;">
- <li><span class="icon iconfont icon-copy" title="复制标号"
+ <i class="icon iconfont icon-copy2"></i>
+ <ul style="width: 192px;">
+ <li><span class="icon iconfont icon-copy2" title="复制标号"
  onclick="copySymbol()"></span></li>
  <li><span class="icon iconfont icon-shear" title="剪切标号"
  onclick="cutSymbol()"></span></li>
@@ -213,7 +212,7 @@
  </li>
  <li>
  <i class="icon iconfont icon-cloud-upload"></i>
- <ul style="width: 60px;">
+ <ul style="width: 64px;">
  <li><span class="icon iconfont icon-cloud-upload" title="保存态势图"
  onclick="saveSimulationMap()"></span></li>
  <li><span class="icon iconfont icon-cloud-download" title="加载态势图"
@@ -225,7 +224,7 @@
  </li>
  <li>
  <i class="icon iconfont icon-combination"></i>
- <ul style="width: 90px;">
+ <ul style="width: 96px;">
  <li><span class="icon iconfont icon-combination" title="对多选的标号，创建组合"
  onclick="createGroupObjects()"></span></li>
  <li><span class="icon iconfont icon-multiflag" title="对多选的旗子类标号，创建多旗"
@@ -236,7 +235,7 @@
  </li>
  <li>
  <i class="icon iconfont icon-draw-avoid"></i>
- <ul style="width: 90px;">
+ <ul style="width: 96px;">
  <li><span class="icon iconfont icon-draw-avoid" title="避让编辑"
  onclick="drawAvoidRegion()"></span></li>
  <li><span class="icon iconfont icon-exit-avoid" title="退出避让编辑"
@@ -247,7 +246,7 @@
  </li>
  <li>
  <i class="icon iconfont icon-align-left"></i>
- <ul style="width: 332px;">
+ <ul style="width: 354px;">
  <li><span class="icon iconfont icon-align-left" title="左对齐"
  onclick="setSymbolAlighLeft()"></span></li>
  <li><span class="icon iconfont icon-align-right" title="右对齐"