|
114 | 114 | <!-- Auto-create -->
|
115 | 115 | </select>
|
116 | 116 | </div>
|
117 |
| - <div class="vp-grid-box sb-option"> |
118 |
| - <label><input type="checkbox" id="showValues" class="vp-state"/><span>Show values</span></label> |
119 |
| - <input type="number" id="showValuesPrecision" class="vp-state" placeholder="Type precision (0 ~ 5)" min="0" max="5"/> |
120 |
| - </div> |
121 |
| - <div class="vp-grid-col-p50 sb-option" style="grid-column-start: 1;grid-column-end: 3;"> |
122 |
| - <div class="vp-grid-box"> |
123 |
| - <label class="vp-bold">Sort values by |
124 |
| - <select id="sortBy" class="vp-state vp-select" style="width: 75px;height:25px;"> |
| 117 | + <div class="vp-grid-box sb-option" style="grid-column-start: 1;grid-column-end: 3;"> |
| 118 | + <hr style="margin:5px;"/> |
| 119 | + <label class="vp-tab-group-title">Sort</label> |
| 120 | + <div class="vp-grid-col-p50"> |
| 121 | + <div class="vp-grid-col-95"> |
| 122 | + <label for="sortType">Order</label> |
| 123 | + <select id="sortType" class="vp-state vp-select m"> |
| 124 | + <option value="">No sorting</option> |
| 125 | + <option value="descending">Sort in descending order</option> |
| 126 | + <option value="ascending">Sort in ascending order</option> |
| 127 | + </select> |
| 128 | + </div> |
| 129 | + <div class="vp-grid-col-95"> |
| 130 | + <label for="sortBy">Sort by</label> |
| 131 | + <select id="sortBy" class="vp-state vp-select m"> |
125 | 132 | <option value="y">y axis</option>
|
126 | 133 | <option value="x">x axis</option>
|
127 | 134 | </select>
|
128 |
| - </label> |
129 |
| - <select id="sortType" class="vp-state"> |
130 |
| - <option value="">No sorting</option> |
131 |
| - <option value="descending">Sort in descending order</option> |
132 |
| - <option value="ascending">Sort in ascending order</option> |
133 |
| - </select> |
| 135 | + </div> |
134 | 136 | </div>
|
135 |
| - <div class="vp-grid-box"> |
136 |
| - <label class="vp-bold">Sort condition</label> |
137 |
| - <input type="text" id="sortHue" class="vp-input vp-state" placeholder="Type hue condition"/> |
138 |
| - <label><input type="checkbox" id="sortHueText" class="vp-state"/><span>Text</span></label> |
| 137 | + <div class="vp-grid-col-95 sb-option"> |
| 138 | + <label for="sortHue">Hue condition</label> |
| 139 | + <div> |
| 140 | + <input type="text" id="sortHue" class="vp-input vp-state" placeholder="Type hue condition"/> |
| 141 | + <label><input type="checkbox" id="sortHueText" class="vp-state" checked/><span>Text</span></label> |
| 142 | + </div> |
139 | 143 | </div>
|
| 144 | + <hr style="margin:5px;"/> |
140 | 145 | </div>
|
141 | 146 | </div>
|
142 | 147 | <label for="userOption" class="vp-bold">User Option</label>
|
|
207 | 212 | <input type="text" id="y_label" class="vp-input vp-state" placeholder="Type Y Label" />
|
208 | 213 | </div>
|
209 | 214 | </div>
|
210 |
| - |
| 215 | + <div class="vp-grid-box sb-option"> |
| 216 | + <hr style="margin:5px;"/> |
| 217 | + <label class="vp-tab-group-title">Show values</label> |
| 218 | + <label><input type="checkbox" id="showValues" class="vp-state"/><span>Show values on the top of bar</span></label> |
| 219 | + <div class="vp-grid-col-95"> |
| 220 | + <label for="showValuesPrecision">Decimal place</label> |
| 221 | + <input type="number" id="showValuesPrecision" class="vp-state" placeholder="Type decimal places(0~5)" min="0" max="5"/> |
| 222 | + </div> |
| 223 | + <hr style="margin:5px;"/> |
| 224 | + </div> |
211 | 225 | <label for="useLegend" class="vp-bold">Legend</label>
|
212 | 226 | <div class="vp-grid-col-p50">
|
213 | 227 | <select id="legendPos" class="vp-select vp-state">
|
|
0 commit comments