Shape.html 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>The source code</title>
  6. <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
  7. <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
  8. <style type="text/css">
  9. .highlight { display: block; background-color: #ddd; }
  10. </style>
  11. <script type="text/javascript">
  12. function highlight() {
  13. document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
  14. }
  15. </script>
  16. </head>
  17. <body onload="prettyPrint(); highlight();">
  18. <pre class="prettyprint lang-js"><span id='Ext-chart-Shape'>/**
  19. </span> * @private
  20. */
  21. Ext.define('Ext.chart.Shape', {
  22. /* Begin Definitions */
  23. singleton: true,
  24. /* End Definitions */
  25. circle: function (surface, opts) {
  26. return surface.add(Ext.apply({
  27. type: 'circle',
  28. x: opts.x,
  29. y: opts.y,
  30. stroke: null,
  31. radius: opts.radius
  32. }, opts));
  33. },
  34. line: function (surface, opts) {
  35. return surface.add(Ext.apply({
  36. type: 'rect',
  37. x: opts.x - opts.radius,
  38. y: opts.y - opts.radius,
  39. height: 2 * opts.radius,
  40. width: 2 * opts.radius / 5
  41. }, opts));
  42. },
  43. square: function (surface, opts) {
  44. return surface.add(Ext.applyIf({
  45. type: 'rect',
  46. x: opts.x - opts.radius,
  47. y: opts.y - opts.radius,
  48. height: 2 * opts.radius,
  49. width: 2 * opts.radius,
  50. radius: null
  51. }, opts));
  52. },
  53. triangle: function (surface, opts) {
  54. opts.radius *= 1.75;
  55. return surface.add(Ext.apply({
  56. type: 'path',
  57. stroke: null,
  58. path: &quot;M&quot;.concat(opts.x, &quot;,&quot;, opts.y, &quot;m0-&quot;, opts.radius * 0.58, &quot;l&quot;, opts.radius * 0.5, &quot;,&quot;, opts.radius * 0.87, &quot;-&quot;, opts.radius, &quot;,0z&quot;)
  59. }, opts));
  60. },
  61. diamond: function (surface, opts) {
  62. var r = opts.radius;
  63. r *= 1.5;
  64. return surface.add(Ext.apply({
  65. type: 'path',
  66. stroke: null,
  67. path: [&quot;M&quot;, opts.x, opts.y - r, &quot;l&quot;, r, r, -r, r, -r, -r, r, -r, &quot;z&quot;]
  68. }, opts));
  69. },
  70. cross: function (surface, opts) {
  71. var r = opts.radius;
  72. r = r / 1.7;
  73. return surface.add(Ext.apply({
  74. type: 'path',
  75. stroke: null,
  76. path: &quot;M&quot;.concat(opts.x - r, &quot;,&quot;, opts.y, &quot;l&quot;, [-r, -r, r, -r, r, r, r, -r, r, r, -r, r, r, r, -r, r, -r, -r, -r, r, -r, -r, &quot;z&quot;])
  77. }, opts));
  78. },
  79. plus: function (surface, opts) {
  80. var r = opts.radius / 1.3;
  81. return surface.add(Ext.apply({
  82. type: 'path',
  83. stroke: null,
  84. path: &quot;M&quot;.concat(opts.x - r / 2, &quot;,&quot;, opts.y - r / 2, &quot;l&quot;, [0, -r, r, 0, 0, r, r, 0, 0, r, -r, 0, 0, r, -r, 0, 0, -r, -r, 0, 0, -r, &quot;z&quot;])
  85. }, opts));
  86. },
  87. arrow: function (surface, opts) {
  88. var r = opts.radius;
  89. return surface.add(Ext.apply({
  90. type: 'path',
  91. path: &quot;M&quot;.concat(opts.x - r * 0.7, &quot;,&quot;, opts.y - r * 0.4, &quot;l&quot;, [r * 0.6, 0, 0, -r * 0.4, r, r * 0.8, -r, r * 0.8, 0, -r * 0.4, -r * 0.6, 0], &quot;z&quot;)
  92. }, opts));
  93. },
  94. drop: function (surface, x, y, text, size, angle) {
  95. size = size || 30;
  96. angle = angle || 0;
  97. surface.add({
  98. type: 'path',
  99. path: ['M', x, y, 'l', size, 0, 'A', size * 0.4, size * 0.4, 0, 1, 0, x + size * 0.7, y - size * 0.7, 'z'],
  100. fill: '#000',
  101. stroke: 'none',
  102. rotate: {
  103. degrees: 22.5 - angle,
  104. x: x,
  105. y: y
  106. }
  107. });
  108. angle = (angle + 90) * Math.PI / 180;
  109. surface.add({
  110. type: 'text',
  111. x: x + size * Math.sin(angle) - 10, // Shift here, Not sure why.
  112. y: y + size * Math.cos(angle) + 5,
  113. text: text,
  114. 'font-size': size * 12 / 40,
  115. stroke: 'none',
  116. fill: '#fff'
  117. });
  118. }
  119. });</pre>
  120. </body>
  121. </html>