w-plot-vue 1.0.4 → 1.0.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (136) hide show
  1. package/README.md +12 -11
  2. package/dist/w-plot-vue.umd.js +13 -2
  3. package/dist/w-plot-vue.umd.js.map +1 -1
  4. package/docs/examples/app.html +1 -1
  5. package/docs/examples/app.umd.js +13 -2
  6. package/docs/examples/app.umd.js.map +1 -1
  7. package/docs/examples/w-bar_horizontal_multi-set(color).html +26 -16
  8. package/docs/examples/w-bar_horizontal_multi-set(color, gradient).html +26 -16
  9. package/docs/examples/w-bar_horizontal_multi-set(series color).html +26 -16
  10. package/docs/examples/w-bar_horizontal_multi-set(series color, gradient).html +26 -16
  11. package/docs/examples/w-bar_horizontal_multi-set.html +26 -16
  12. package/docs/examples/w-bar_horizontal_multi-set__barDisplay(stackNormal).html +26 -16
  13. package/docs/examples/w-bar_horizontal_multi-set__barDisplay(stackPercent).html +26 -16
  14. package/docs/examples/w-bar_horizontal_multi-set__hide legned.html +26 -16
  15. package/docs/examples/w-bar_horizontal_multi-set__show labels.html +26 -16
  16. package/docs/examples/w-bar_horizontal_multi-set_barKpColor(gradient).html +26 -16
  17. package/docs/examples/w-bar_horizontal_multi-set_barKpColor.html +26 -16
  18. package/docs/examples/w-bar_horizontal_multi-set_barUseInnerLabelsForHorizontal_barGroupWidthRatio.html +26 -16
  19. package/docs/examples/w-bar_horizontal_multi-set_barWidthRatio.html +26 -16
  20. package/docs/examples/w-bar_horizontal_multi-set_barWidthRatio_barGroupWidthRatio.html +26 -16
  21. package/docs/examples/w-bar_horizontal_one-set(color).html +26 -16
  22. package/docs/examples/w-bar_horizontal_one-set(color, gradient).html +26 -16
  23. package/docs/examples/w-bar_horizontal_one-set.html +26 -16
  24. package/docs/examples/w-bar_horizontal_one-set_barColor(gradient).html +26 -16
  25. package/docs/examples/w-bar_horizontal_one-set_barColor.html +26 -16
  26. package/docs/examples/w-bar_horizontal_one-set_barKpColor(gradient).html +26 -16
  27. package/docs/examples/w-bar_horizontal_one-set_barKpColor.html +26 -16
  28. package/docs/examples/w-bar_horizontal_one-set_barUseInnerLabelsForHorizontal.html +26 -16
  29. package/docs/examples/w-bar_horizontal_one-set_barWidthRatio.html +26 -16
  30. package/docs/examples/w-bar_horizontal_one-set_barWidthRatio_barGroupWidthRatio.html +26 -16
  31. package/docs/examples/w-bar_horizontal_one-set_hide labels.html +26 -16
  32. package/docs/examples/w-bar_horizontal_one-set_marginLeft_marginRight.html +26 -16
  33. package/docs/examples/w-bar_horizontal_one-set_show legned.html +26 -16
  34. package/docs/examples/w-bar_multi-set(color).html +26 -16
  35. package/docs/examples/w-bar_multi-set(color, gradient).html +26 -16
  36. package/docs/examples/w-bar_multi-set(series color).html +26 -16
  37. package/docs/examples/w-bar_multi-set(series color, gradient).html +26 -16
  38. package/docs/examples/w-bar_multi-set.html +26 -16
  39. package/docs/examples/w-bar_multi-set__barDisplay(stackNormal).html +26 -16
  40. package/docs/examples/w-bar_multi-set__barDisplay(stackNormal)_.html +26 -16
  41. package/docs/examples/w-bar_multi-set__barDisplay(stackPercent).html +26 -16
  42. package/docs/examples/w-bar_multi-set__hide legned.html +26 -16
  43. package/docs/examples/w-bar_multi-set__show labels.html +26 -16
  44. package/docs/examples/w-bar_multi-set_barKpColor(gradient).html +26 -16
  45. package/docs/examples/w-bar_multi-set_barKpColor.html +26 -16
  46. package/docs/examples/w-bar_multi-set_barWidthRatio.html +26 -16
  47. package/docs/examples/w-bar_multi-set_barWidthRatio_barGroupWidthRatio_barBorderRadius.html +26 -16
  48. package/docs/examples/w-bar_one-set(color).html +26 -16
  49. package/docs/examples/w-bar_one-set(color, gradient).html +26 -16
  50. package/docs/examples/w-bar_one-set.html +26 -16
  51. package/docs/examples/w-bar_one-set_barColor(gradient).html +26 -16
  52. package/docs/examples/w-bar_one-set_barColor.html +26 -16
  53. package/docs/examples/w-bar_one-set_barKpColor(gradient).html +26 -16
  54. package/docs/examples/w-bar_one-set_barKpColor.html +26 -16
  55. package/docs/examples/w-bar_one-set_barWidthRatio.html +26 -16
  56. package/docs/examples/w-bar_one-set_barWidthRatio_barGroupWidthRatio_barBorderRadius.html +26 -16
  57. package/docs/examples/w-bar_one-set_hide labels.html +26 -16
  58. package/docs/examples/w-bar_one-set_marginLeft_marginRight_marginTop.html +26 -16
  59. package/docs/examples/w-bar_one-set_show legned.html +26 -16
  60. package/docs/examples/w-pie_one-set(color).html +26 -16
  61. package/docs/examples/w-pie_one-set(color, gradient).html +26 -16
  62. package/docs/examples/w-pie_one-set.html +26 -16
  63. package/docs/examples/w-pie_one-set_hide labels.html +26 -16
  64. package/docs/examples/w-pie_one-set_hide legned.html +26 -16
  65. package/docs/examples/w-pie_one-set_marginLeft_marginRight_marginTop.html +26 -16
  66. package/docs/examples/w-pie_one-set_pieBorderRadius.html +26 -16
  67. package/docs/examples/w-pie_one-set_pieBorderWidth_pieBorderRadius.html +26 -16
  68. package/docs/examples/w-pie_one-set_pieKpColor(gradient).html +26 -16
  69. package/docs/examples/w-pie_one-set_pieKpColor.html +26 -16
  70. package/docs/examples/w-pie_one-set_pieThicknessRatio.html +26 -16
  71. package/docs/examples/{w-plot_default.html → w-plot-2d_default.html} +29 -19
  72. package/docs/examples/w-plot-3d_default.html +209 -0
  73. package/docs/examples/w-rose_multi-set(color).html +26 -16
  74. package/docs/examples/w-rose_multi-set(color, gradient).html +26 -16
  75. package/docs/examples/w-rose_multi-set(series color).html +26 -16
  76. package/docs/examples/w-rose_multi-set(series color, gradient).html +26 -16
  77. package/docs/examples/w-rose_multi-set.html +26 -16
  78. package/docs/examples/w-rose_multi-set__hide legned.html +26 -16
  79. package/docs/examples/w-rose_multi-set__show labels.html +26 -16
  80. package/docs/examples/w-rose_multi-set_roseBorderWidth.html +26 -16
  81. package/docs/examples/w-rose_multi-set_roseKpColor(gradient).html +26 -16
  82. package/docs/examples/w-rose_multi-set_roseKpColor.html +26 -16
  83. package/docs/examples/w-rose_multi-set_roseWidthRatio.html +26 -16
  84. package/docs/examples/w-rose_one-set(color).html +26 -16
  85. package/docs/examples/w-rose_one-set(color, gradient).html +26 -16
  86. package/docs/examples/w-rose_one-set.html +26 -16
  87. package/docs/examples/w-rose_one-set_marginLeft_marginRight_marginTop.html +26 -16
  88. package/docs/examples/w-rose_one-set_roseBorderWidth.html +26 -16
  89. package/docs/examples/w-rose_one-set_roseKpColor(gradient).html +26 -16
  90. package/docs/examples/w-rose_one-set_roseKpColor.html +26 -16
  91. package/docs/examples/w-rose_one-set_roseShowLabels.html +26 -16
  92. package/docs/examples/w-rose_one-set_roseWidthRatio.html +26 -16
  93. package/docs/examples/w-rose_one-set_showLegend.html +26 -16
  94. package/docs/examples/w-rose_one-set_showLegend_legendPosition.html +26 -16
  95. package/docs/examples/w-set-multi_default.html +26 -16
  96. package/docs/examples/w-set-multi_hide labels.html +26 -16
  97. package/docs/examples/w-set-multi_hide legned.html +26 -16
  98. package/docs/examples/w-set-multi_keySelect.html +26 -16
  99. package/docs/examples/w-set-multi_slot head.html +26 -16
  100. package/docs/examples/w-set-multi_textPlotType_kpSelectText_widthSelect.html +26 -16
  101. package/docs/examples/w-set-one_default.html +26 -16
  102. package/docs/examples/w-set-one_hide labels.html +26 -16
  103. package/docs/examples/w-set-one_keySelect.html +26 -16
  104. package/docs/examples/w-set-one_show legned.html +26 -16
  105. package/docs/examples/w-set-one_slot head.html +26 -16
  106. package/docs/examples/w-set-one_textPlotType_kpSelectText_widthSelect.html +26 -16
  107. package/docs/getDefAxis.mjs.html +2 -2
  108. package/docs/getDefChart.mjs.html +2 -2
  109. package/docs/getDefLegend.mjs.html +2 -2
  110. package/docs/getDefOpt.mjs.html +2 -2
  111. package/docs/global.html +2 -2
  112. package/docs/index.html +2 -2
  113. package/docs/module-WBar.html +2 -2
  114. package/docs/module-WPie.html +2 -2
  115. package/docs/{module-WPlot.html → module-WPlot2d.html} +4 -4
  116. package/docs/module-WPlot3d.html +216 -0
  117. package/docs/module-WRose.html +2 -2
  118. package/docs/module-WSetMulti.html +2 -2
  119. package/docs/module-WSetOne.html +2 -2
  120. package/docs/setLegendLoc.mjs.html +2 -2
  121. package/package.json +7 -5
  122. package/src/App.vue +104 -52
  123. package/src/AppZoneWBar.vue +1 -1
  124. package/src/AppZoneWPie.vue +1 -1
  125. package/src/{AppZoneWPlot.vue → AppZoneWPlot2d.vue} +9 -9
  126. package/src/AppZoneWPlot3d.vue +106 -0
  127. package/src/AppZoneWRose.vue +1 -1
  128. package/src/AppZoneWSetMulti.vue +1 -1
  129. package/src/AppZoneWSetOne.vue +1 -1
  130. package/src/components/WBar.vue +4 -4
  131. package/src/components/WPie.vue +4 -4
  132. package/src/components/WPlot3d.vue +1256 -0
  133. package/src/components/WPlotVue.vue +4 -2
  134. package/src/components/WRose.vue +4 -4
  135. package/toolg/gExtractHtml.mjs +22 -15
  136. /package/src/components/{WPlot.vue → WPlot2d.vue} +0 -0
@@ -66,16 +66,9 @@
66
66
  ></script>
67
67
 
68
68
  <!-- w-plot-vue -->
69
- <script src="https://cdn.jsdelivr.net/npm/w-plot-vue@1.0.4/dist/w-plot-vue.umd.js"></script>
69
+ <script src="https://cdn.jsdelivr.net/npm/w-plot-vue@1.0.6/dist/w-plot-vue.umd.js"></script>
70
70
 
71
71
  <style>
72
- .v-application--wrap {
73
- /* width與max-width fix for IE11, 其外不能使用padding或margin避免失效 */
74
- width: 100vw;
75
- max-width: 100vw;
76
- font-family: inherit;
77
- background: #fff;
78
- }
79
72
  .item {
80
73
  /* 因item位於demolink, 提取各範例html後會刪除demolink, 故得額外補上 */
81
74
  border-left: 3px solid #ffba75;
@@ -87,19 +80,36 @@
87
80
  align-items: center;
88
81
  }
89
82
  .head1 {
90
- margin: 0px;
91
83
  padding: 0px 0px 20px 0px;
92
84
  font-size: 2.5rem;
93
85
  }
86
+ .bkh {
87
+ /* 寬 */
88
+ padding: 20px;
89
+ }
90
+ @media screen and (max-width: 800px) {
91
+ /* 中 */
92
+ .bkh {
93
+ padding: 10px;
94
+ }
95
+ }
96
+ @media screen and (max-width: 400px) {
97
+ /* 窄 */
98
+ .bkh {
99
+ padding: 5px;
100
+ }
101
+ }
94
102
  .bk {
103
+ /* 寬 */
104
+ display: inline-block;
95
105
  vertical-align: top;
96
- padding: 10px 0px 60px 0px;
106
+ padding: 0px 80px 60px 0px;
97
107
  }
98
- @media screen and (min-width: 1000px) {
99
- /* 寬版 */
108
+ @media screen and (max-width: 1000px) {
109
+ /* 中窄 */
100
110
  .bk {
101
- display: inline-block;
102
- margin: 0px 80px 0px 0px;
111
+ display: block;
112
+ padding: 0px 0px 50px 0px;
103
113
  }
104
114
  }
105
115
  </style>
@@ -107,7 +117,7 @@
107
117
  <body
108
118
  style="font-family:'Microsoft JhengHei','Avenir','Helvetica'; padding:0px; margin:0px;"
109
119
  >
110
- <v-app id="app" style="font-family:inherit; padding:0px 30px;">
120
+ <div id="app" class="bkh" style>
111
121
  <div class="head1">
112
122
  <span
113
123
  style="cursor:pointer;"
@@ -127,7 +137,7 @@
127
137
  }"
128
138
  ></w-bar>
129
139
  </div>
130
- </v-app>
140
+ </div>
131
141
 
132
142
  <script>
133
143
  //install
@@ -66,16 +66,9 @@
66
66
  ></script>
67
67
 
68
68
  <!-- w-plot-vue -->
69
- <script src="https://cdn.jsdelivr.net/npm/w-plot-vue@1.0.4/dist/w-plot-vue.umd.js"></script>
69
+ <script src="https://cdn.jsdelivr.net/npm/w-plot-vue@1.0.6/dist/w-plot-vue.umd.js"></script>
70
70
 
71
71
  <style>
72
- .v-application--wrap {
73
- /* width與max-width fix for IE11, 其外不能使用padding或margin避免失效 */
74
- width: 100vw;
75
- max-width: 100vw;
76
- font-family: inherit;
77
- background: #fff;
78
- }
79
72
  .item {
80
73
  /* 因item位於demolink, 提取各範例html後會刪除demolink, 故得額外補上 */
81
74
  border-left: 3px solid #ffba75;
@@ -87,19 +80,36 @@
87
80
  align-items: center;
88
81
  }
89
82
  .head1 {
90
- margin: 0px;
91
83
  padding: 0px 0px 20px 0px;
92
84
  font-size: 2.5rem;
93
85
  }
86
+ .bkh {
87
+ /* 寬 */
88
+ padding: 20px;
89
+ }
90
+ @media screen and (max-width: 800px) {
91
+ /* 中 */
92
+ .bkh {
93
+ padding: 10px;
94
+ }
95
+ }
96
+ @media screen and (max-width: 400px) {
97
+ /* 窄 */
98
+ .bkh {
99
+ padding: 5px;
100
+ }
101
+ }
94
102
  .bk {
103
+ /* 寬 */
104
+ display: inline-block;
95
105
  vertical-align: top;
96
- padding: 10px 0px 60px 0px;
106
+ padding: 0px 80px 60px 0px;
97
107
  }
98
- @media screen and (min-width: 1000px) {
99
- /* 寬版 */
108
+ @media screen and (max-width: 1000px) {
109
+ /* 中窄 */
100
110
  .bk {
101
- display: inline-block;
102
- margin: 0px 80px 0px 0px;
111
+ display: block;
112
+ padding: 0px 0px 50px 0px;
103
113
  }
104
114
  }
105
115
  </style>
@@ -107,7 +117,7 @@
107
117
  <body
108
118
  style="font-family:'Microsoft JhengHei','Avenir','Helvetica'; padding:0px; margin:0px;"
109
119
  >
110
- <v-app id="app" style="font-family:inherit; padding:0px 30px;">
120
+ <div id="app" class="bkh" style>
111
121
  <div class="head1">
112
122
  <span
113
123
  style="cursor:pointer;"
@@ -128,7 +138,7 @@
128
138
  }"
129
139
  ></w-bar>
130
140
  </div>
131
- </v-app>
141
+ </div>
132
142
 
133
143
  <script>
134
144
  //install
@@ -66,16 +66,9 @@
66
66
  ></script>
67
67
 
68
68
  <!-- w-plot-vue -->
69
- <script src="https://cdn.jsdelivr.net/npm/w-plot-vue@1.0.4/dist/w-plot-vue.umd.js"></script>
69
+ <script src="https://cdn.jsdelivr.net/npm/w-plot-vue@1.0.6/dist/w-plot-vue.umd.js"></script>
70
70
 
71
71
  <style>
72
- .v-application--wrap {
73
- /* width與max-width fix for IE11, 其外不能使用padding或margin避免失效 */
74
- width: 100vw;
75
- max-width: 100vw;
76
- font-family: inherit;
77
- background: #fff;
78
- }
79
72
  .item {
80
73
  /* 因item位於demolink, 提取各範例html後會刪除demolink, 故得額外補上 */
81
74
  border-left: 3px solid #ffba75;
@@ -87,19 +80,36 @@
87
80
  align-items: center;
88
81
  }
89
82
  .head1 {
90
- margin: 0px;
91
83
  padding: 0px 0px 20px 0px;
92
84
  font-size: 2.5rem;
93
85
  }
86
+ .bkh {
87
+ /* 寬 */
88
+ padding: 20px;
89
+ }
90
+ @media screen and (max-width: 800px) {
91
+ /* 中 */
92
+ .bkh {
93
+ padding: 10px;
94
+ }
95
+ }
96
+ @media screen and (max-width: 400px) {
97
+ /* 窄 */
98
+ .bkh {
99
+ padding: 5px;
100
+ }
101
+ }
94
102
  .bk {
103
+ /* 寬 */
104
+ display: inline-block;
95
105
  vertical-align: top;
96
- padding: 10px 0px 60px 0px;
106
+ padding: 0px 80px 60px 0px;
97
107
  }
98
- @media screen and (min-width: 1000px) {
99
- /* 寬版 */
108
+ @media screen and (max-width: 1000px) {
109
+ /* 中窄 */
100
110
  .bk {
101
- display: inline-block;
102
- margin: 0px 80px 0px 0px;
111
+ display: block;
112
+ padding: 0px 0px 50px 0px;
103
113
  }
104
114
  }
105
115
  </style>
@@ -107,7 +117,7 @@
107
117
  <body
108
118
  style="font-family:'Microsoft JhengHei','Avenir','Helvetica'; padding:0px; margin:0px;"
109
119
  >
110
- <v-app id="app" style="font-family:inherit; padding:0px 30px;">
120
+ <div id="app" class="bkh" style>
111
121
  <div class="head1">
112
122
  <span
113
123
  style="cursor:pointer;"
@@ -128,7 +138,7 @@
128
138
  }"
129
139
  ></w-bar>
130
140
  </div>
131
- </v-app>
141
+ </div>
132
142
 
133
143
  <script>
134
144
  //install
@@ -66,16 +66,9 @@
66
66
  ></script>
67
67
 
68
68
  <!-- w-plot-vue -->
69
- <script src="https://cdn.jsdelivr.net/npm/w-plot-vue@1.0.4/dist/w-plot-vue.umd.js"></script>
69
+ <script src="https://cdn.jsdelivr.net/npm/w-plot-vue@1.0.6/dist/w-plot-vue.umd.js"></script>
70
70
 
71
71
  <style>
72
- .v-application--wrap {
73
- /* width與max-width fix for IE11, 其外不能使用padding或margin避免失效 */
74
- width: 100vw;
75
- max-width: 100vw;
76
- font-family: inherit;
77
- background: #fff;
78
- }
79
72
  .item {
80
73
  /* 因item位於demolink, 提取各範例html後會刪除demolink, 故得額外補上 */
81
74
  border-left: 3px solid #ffba75;
@@ -87,19 +80,36 @@
87
80
  align-items: center;
88
81
  }
89
82
  .head1 {
90
- margin: 0px;
91
83
  padding: 0px 0px 20px 0px;
92
84
  font-size: 2.5rem;
93
85
  }
86
+ .bkh {
87
+ /* 寬 */
88
+ padding: 20px;
89
+ }
90
+ @media screen and (max-width: 800px) {
91
+ /* 中 */
92
+ .bkh {
93
+ padding: 10px;
94
+ }
95
+ }
96
+ @media screen and (max-width: 400px) {
97
+ /* 窄 */
98
+ .bkh {
99
+ padding: 5px;
100
+ }
101
+ }
94
102
  .bk {
103
+ /* 寬 */
104
+ display: inline-block;
95
105
  vertical-align: top;
96
- padding: 10px 0px 60px 0px;
106
+ padding: 0px 80px 60px 0px;
97
107
  }
98
- @media screen and (min-width: 1000px) {
99
- /* 寬版 */
108
+ @media screen and (max-width: 1000px) {
109
+ /* 中窄 */
100
110
  .bk {
101
- display: inline-block;
102
- margin: 0px 80px 0px 0px;
111
+ display: block;
112
+ padding: 0px 0px 50px 0px;
103
113
  }
104
114
  }
105
115
  </style>
@@ -107,7 +117,7 @@
107
117
  <body
108
118
  style="font-family:'Microsoft JhengHei','Avenir','Helvetica'; padding:0px; margin:0px;"
109
119
  >
110
- <v-app id="app" style="font-family:inherit; padding:0px 30px;">
120
+ <div id="app" class="bkh" style>
111
121
  <div class="head1">
112
122
  <span
113
123
  style="cursor:pointer;"
@@ -137,7 +147,7 @@
137
147
  }"
138
148
  ></w-bar>
139
149
  </div>
140
- </v-app>
150
+ </div>
141
151
 
142
152
  <script>
143
153
  //install
@@ -66,16 +66,9 @@
66
66
  ></script>
67
67
 
68
68
  <!-- w-plot-vue -->
69
- <script src="https://cdn.jsdelivr.net/npm/w-plot-vue@1.0.4/dist/w-plot-vue.umd.js"></script>
69
+ <script src="https://cdn.jsdelivr.net/npm/w-plot-vue@1.0.6/dist/w-plot-vue.umd.js"></script>
70
70
 
71
71
  <style>
72
- .v-application--wrap {
73
- /* width與max-width fix for IE11, 其外不能使用padding或margin避免失效 */
74
- width: 100vw;
75
- max-width: 100vw;
76
- font-family: inherit;
77
- background: #fff;
78
- }
79
72
  .item {
80
73
  /* 因item位於demolink, 提取各範例html後會刪除demolink, 故得額外補上 */
81
74
  border-left: 3px solid #ffba75;
@@ -87,19 +80,36 @@
87
80
  align-items: center;
88
81
  }
89
82
  .head1 {
90
- margin: 0px;
91
83
  padding: 0px 0px 20px 0px;
92
84
  font-size: 2.5rem;
93
85
  }
86
+ .bkh {
87
+ /* 寬 */
88
+ padding: 20px;
89
+ }
90
+ @media screen and (max-width: 800px) {
91
+ /* 中 */
92
+ .bkh {
93
+ padding: 10px;
94
+ }
95
+ }
96
+ @media screen and (max-width: 400px) {
97
+ /* 窄 */
98
+ .bkh {
99
+ padding: 5px;
100
+ }
101
+ }
94
102
  .bk {
103
+ /* 寬 */
104
+ display: inline-block;
95
105
  vertical-align: top;
96
- padding: 10px 0px 60px 0px;
106
+ padding: 0px 80px 60px 0px;
97
107
  }
98
- @media screen and (min-width: 1000px) {
99
- /* 寬版 */
108
+ @media screen and (max-width: 1000px) {
109
+ /* 中窄 */
100
110
  .bk {
101
- display: inline-block;
102
- margin: 0px 80px 0px 0px;
111
+ display: block;
112
+ padding: 0px 0px 50px 0px;
103
113
  }
104
114
  }
105
115
  </style>
@@ -107,7 +117,7 @@
107
117
  <body
108
118
  style="font-family:'Microsoft JhengHei','Avenir','Helvetica'; padding:0px; margin:0px;"
109
119
  >
110
- <v-app id="app" style="font-family:inherit; padding:0px 30px;">
120
+ <div id="app" class="bkh" style>
111
121
  <div class="head1">
112
122
  <span
113
123
  style="cursor:pointer;"
@@ -135,7 +145,7 @@
135
145
  }"
136
146
  ></w-bar>
137
147
  </div>
138
- </v-app>
148
+ </div>
139
149
 
140
150
  <script>
141
151
  //install
@@ -66,16 +66,9 @@
66
66
  ></script>
67
67
 
68
68
  <!-- w-plot-vue -->
69
- <script src="https://cdn.jsdelivr.net/npm/w-plot-vue@1.0.4/dist/w-plot-vue.umd.js"></script>
69
+ <script src="https://cdn.jsdelivr.net/npm/w-plot-vue@1.0.6/dist/w-plot-vue.umd.js"></script>
70
70
 
71
71
  <style>
72
- .v-application--wrap {
73
- /* width與max-width fix for IE11, 其外不能使用padding或margin避免失效 */
74
- width: 100vw;
75
- max-width: 100vw;
76
- font-family: inherit;
77
- background: #fff;
78
- }
79
72
  .item {
80
73
  /* 因item位於demolink, 提取各範例html後會刪除demolink, 故得額外補上 */
81
74
  border-left: 3px solid #ffba75;
@@ -87,19 +80,36 @@
87
80
  align-items: center;
88
81
  }
89
82
  .head1 {
90
- margin: 0px;
91
83
  padding: 0px 0px 20px 0px;
92
84
  font-size: 2.5rem;
93
85
  }
86
+ .bkh {
87
+ /* 寬 */
88
+ padding: 20px;
89
+ }
90
+ @media screen and (max-width: 800px) {
91
+ /* 中 */
92
+ .bkh {
93
+ padding: 10px;
94
+ }
95
+ }
96
+ @media screen and (max-width: 400px) {
97
+ /* 窄 */
98
+ .bkh {
99
+ padding: 5px;
100
+ }
101
+ }
94
102
  .bk {
103
+ /* 寬 */
104
+ display: inline-block;
95
105
  vertical-align: top;
96
- padding: 10px 0px 60px 0px;
106
+ padding: 0px 80px 60px 0px;
97
107
  }
98
- @media screen and (min-width: 1000px) {
99
- /* 寬版 */
108
+ @media screen and (max-width: 1000px) {
109
+ /* 中窄 */
100
110
  .bk {
101
- display: inline-block;
102
- margin: 0px 80px 0px 0px;
111
+ display: block;
112
+ padding: 0px 0px 50px 0px;
103
113
  }
104
114
  }
105
115
  </style>
@@ -107,7 +117,7 @@
107
117
  <body
108
118
  style="font-family:'Microsoft JhengHei','Avenir','Helvetica'; padding:0px; margin:0px;"
109
119
  >
110
- <v-app id="app" style="font-family:inherit; padding:0px 30px;">
120
+ <div id="app" class="bkh" style>
111
121
  <div class="head1">
112
122
  <span
113
123
  style="cursor:pointer;"
@@ -130,7 +140,7 @@
130
140
  }"
131
141
  ></w-bar>
132
142
  </div>
133
- </v-app>
143
+ </div>
134
144
 
135
145
  <script>
136
146
  //install
@@ -66,16 +66,9 @@
66
66
  ></script>
67
67
 
68
68
  <!-- w-plot-vue -->
69
- <script src="https://cdn.jsdelivr.net/npm/w-plot-vue@1.0.4/dist/w-plot-vue.umd.js"></script>
69
+ <script src="https://cdn.jsdelivr.net/npm/w-plot-vue@1.0.6/dist/w-plot-vue.umd.js"></script>
70
70
 
71
71
  <style>
72
- .v-application--wrap {
73
- /* width與max-width fix for IE11, 其外不能使用padding或margin避免失效 */
74
- width: 100vw;
75
- max-width: 100vw;
76
- font-family: inherit;
77
- background: #fff;
78
- }
79
72
  .item {
80
73
  /* 因item位於demolink, 提取各範例html後會刪除demolink, 故得額外補上 */
81
74
  border-left: 3px solid #ffba75;
@@ -87,19 +80,36 @@
87
80
  align-items: center;
88
81
  }
89
82
  .head1 {
90
- margin: 0px;
91
83
  padding: 0px 0px 20px 0px;
92
84
  font-size: 2.5rem;
93
85
  }
86
+ .bkh {
87
+ /* 寬 */
88
+ padding: 20px;
89
+ }
90
+ @media screen and (max-width: 800px) {
91
+ /* 中 */
92
+ .bkh {
93
+ padding: 10px;
94
+ }
95
+ }
96
+ @media screen and (max-width: 400px) {
97
+ /* 窄 */
98
+ .bkh {
99
+ padding: 5px;
100
+ }
101
+ }
94
102
  .bk {
103
+ /* 寬 */
104
+ display: inline-block;
95
105
  vertical-align: top;
96
- padding: 10px 0px 60px 0px;
106
+ padding: 0px 80px 60px 0px;
97
107
  }
98
- @media screen and (min-width: 1000px) {
99
- /* 寬版 */
108
+ @media screen and (max-width: 1000px) {
109
+ /* 中窄 */
100
110
  .bk {
101
- display: inline-block;
102
- margin: 0px 80px 0px 0px;
111
+ display: block;
112
+ padding: 0px 0px 50px 0px;
103
113
  }
104
114
  }
105
115
  </style>
@@ -107,7 +117,7 @@
107
117
  <body
108
118
  style="font-family:'Microsoft JhengHei','Avenir','Helvetica'; padding:0px; margin:0px;"
109
119
  >
110
- <v-app id="app" style="font-family:inherit; padding:0px 30px;">
120
+ <div id="app" class="bkh" style>
111
121
  <div class="head1">
112
122
  <span
113
123
  style="cursor:pointer;"
@@ -128,7 +138,7 @@
128
138
  }"
129
139
  ></w-bar>
130
140
  </div>
131
- </v-app>
141
+ </div>
132
142
 
133
143
  <script>
134
144
  //install
@@ -66,16 +66,9 @@
66
66
  ></script>
67
67
 
68
68
  <!-- w-plot-vue -->
69
- <script src="https://cdn.jsdelivr.net/npm/w-plot-vue@1.0.4/dist/w-plot-vue.umd.js"></script>
69
+ <script src="https://cdn.jsdelivr.net/npm/w-plot-vue@1.0.6/dist/w-plot-vue.umd.js"></script>
70
70
 
71
71
  <style>
72
- .v-application--wrap {
73
- /* width與max-width fix for IE11, 其外不能使用padding或margin避免失效 */
74
- width: 100vw;
75
- max-width: 100vw;
76
- font-family: inherit;
77
- background: #fff;
78
- }
79
72
  .item {
80
73
  /* 因item位於demolink, 提取各範例html後會刪除demolink, 故得額外補上 */
81
74
  border-left: 3px solid #ffba75;
@@ -87,19 +80,36 @@
87
80
  align-items: center;
88
81
  }
89
82
  .head1 {
90
- margin: 0px;
91
83
  padding: 0px 0px 20px 0px;
92
84
  font-size: 2.5rem;
93
85
  }
86
+ .bkh {
87
+ /* 寬 */
88
+ padding: 20px;
89
+ }
90
+ @media screen and (max-width: 800px) {
91
+ /* 中 */
92
+ .bkh {
93
+ padding: 10px;
94
+ }
95
+ }
96
+ @media screen and (max-width: 400px) {
97
+ /* 窄 */
98
+ .bkh {
99
+ padding: 5px;
100
+ }
101
+ }
94
102
  .bk {
103
+ /* 寬 */
104
+ display: inline-block;
95
105
  vertical-align: top;
96
- padding: 10px 0px 60px 0px;
106
+ padding: 0px 80px 60px 0px;
97
107
  }
98
- @media screen and (min-width: 1000px) {
99
- /* 寬版 */
108
+ @media screen and (max-width: 1000px) {
109
+ /* 中窄 */
100
110
  .bk {
101
- display: inline-block;
102
- margin: 0px 80px 0px 0px;
111
+ display: block;
112
+ padding: 0px 0px 50px 0px;
103
113
  }
104
114
  }
105
115
  </style>
@@ -107,7 +117,7 @@
107
117
  <body
108
118
  style="font-family:'Microsoft JhengHei','Avenir','Helvetica'; padding:0px; margin:0px;"
109
119
  >
110
- <v-app id="app" style="font-family:inherit; padding:0px 30px;">
120
+ <div id="app" class="bkh" style>
111
121
  <div class="head1">
112
122
  <span
113
123
  style="cursor:pointer;"
@@ -133,7 +143,7 @@
133
143
  }"
134
144
  ></w-bar>
135
145
  </div>
136
- </v-app>
146
+ </div>
137
147
 
138
148
  <script>
139
149
  //install