Chart.php 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271
  1. <?php
  2. namespace Dcat\Admin\Widgets\ApexCharts;
  3. use Dcat\Admin\Support\Helper;
  4. use Dcat\Admin\Widgets\Widget;
  5. use Illuminate\Support\Str;
  6. class Chart extends Widget
  7. {
  8. public static $js = '@apex-charts';
  9. protected $containerSelector;
  10. protected $options = [];
  11. protected $built = false;
  12. protected $scripts = [
  13. 'extend' => 'return options',
  14. ];
  15. public function __construct($containerSelector = null, $options = [])
  16. {
  17. if ($containerSelector && ! is_string($containerSelector)) {
  18. $options = $containerSelector;
  19. $containerSelector = null;
  20. }
  21. $this->selector($containerSelector);
  22. $this->options($options);
  23. }
  24. /**
  25. * 设置或获取图表容器选择器
  26. *
  27. * @param string|null $selector
  28. *
  29. * @return $this|string|null
  30. */
  31. public function selector(?string $selector = null)
  32. {
  33. if ($selector === null) {
  34. return $this->containerSelector;
  35. }
  36. $this->containerSelector = $selector;
  37. if ($selector && ! $this->built) {
  38. $this->autoRender();
  39. }
  40. return $this;
  41. }
  42. /**
  43. * @param string|array $title
  44. *
  45. * @return $this
  46. */
  47. public function title($title)
  48. {
  49. if (is_string($title)) {
  50. $options = ['text' => $title];
  51. } else {
  52. $options = Helper::array($title);
  53. }
  54. $this->options['title'] = $options;
  55. return $this;
  56. }
  57. /**
  58. * @param array $series
  59. *
  60. * @return $this
  61. */
  62. public function series($series)
  63. {
  64. $this->options['series'] = Helper::array($series);
  65. return $this;
  66. }
  67. /**
  68. * @param array $value
  69. *
  70. * @return $this
  71. */
  72. public function labels($value)
  73. {
  74. $this->options['labels'] = Helper::array($value);
  75. return $this;
  76. }
  77. /**
  78. * @param string|array $colors
  79. *
  80. * @return $this
  81. */
  82. public function colors($colors)
  83. {
  84. $this->options['colors'] = Helper::array($colors);
  85. return $this;
  86. }
  87. /**
  88. * @param array $value
  89. *
  90. * @return $this
  91. */
  92. public function stroke($value)
  93. {
  94. $this->options['stroke'] = Helper::array($value);
  95. return $this;
  96. }
  97. /**
  98. * @param array $value
  99. *
  100. * @return $this
  101. */
  102. public function xaxis($value)
  103. {
  104. $this->options['xaxis'] = Helper::array($value);
  105. return $this;
  106. }
  107. /**
  108. * @param array $value
  109. *
  110. * @return $this
  111. */
  112. public function tooltip($value)
  113. {
  114. $this->options['tooltip'] = Helper::array($value);
  115. return $this;
  116. }
  117. /**
  118. * @param array $value
  119. *
  120. * @return $this
  121. */
  122. public function yaxis($value)
  123. {
  124. $this->options['yaxis'] = Helper::array($value);
  125. return $this;
  126. }
  127. /**
  128. * @param array $value
  129. *
  130. * @return $this
  131. */
  132. public function fill($value)
  133. {
  134. $this->options['fill'] = Helper::array($value);
  135. return $this;
  136. }
  137. /**
  138. * @param array $value
  139. *
  140. * @return $this
  141. */
  142. public function chart($value)
  143. {
  144. $this->options['chart'] = Helper::array($value);
  145. return $this;
  146. }
  147. /**
  148. * @param array|bool $value
  149. *
  150. * @return $this
  151. */
  152. public function dataLabels($value)
  153. {
  154. if (is_bool($value)) {
  155. $value = ['enabled' => $value];
  156. }
  157. $this->options['dataLabels'] = Helper::array($value);
  158. return $this;
  159. }
  160. /**
  161. * @param string|\Closure $script
  162. *
  163. * @return $this
  164. */
  165. public function extendOptions($script)
  166. {
  167. $this->scripts['extend'] = value($script);
  168. return $this;
  169. }
  170. /**
  171. * @return string
  172. */
  173. protected function script()
  174. {
  175. $options = json_encode($this->options);
  176. return <<<JS
  177. var options = {$options}, extend = function (options) {
  178. {$this->scripts['extend']}
  179. };
  180. var chart = new ApexCharts(
  181. $("{$this->containerSelector}")[0],
  182. $.extend(options, extend(options))
  183. );
  184. chart.render();
  185. JS;
  186. }
  187. /**
  188. * @return string
  189. */
  190. public function render()
  191. {
  192. if ($this->built) {
  193. return;
  194. }
  195. $this->built = true;
  196. $hasSelector = $this->containerSelector ? true : false;
  197. if (! $hasSelector) {
  198. $id = $this->generateId();
  199. $this->selector('#'.$id);
  200. }
  201. $this->script = $this->script();
  202. $this->collectAssets();
  203. if ($hasSelector) {
  204. return;
  205. }
  206. // 没有指定容器选择器,则需自动生成
  207. $this->setHtmlAttribute([
  208. 'id' => $id,
  209. ]);
  210. return <<<HTML
  211. <div {$this->formatHtmlAttributes()}></div>
  212. HTML;
  213. }
  214. protected function generateId()
  215. {
  216. return 'apex-chart-'.$this->type.Str::random(8);
  217. }
  218. }