svg-pan-zoom.d.ts 6.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263
  1. // Type definitions for svg-pan-zoom v3.5.0
  2. // Project: https://github.com/bumbu/svg-pan-zoom
  3. // Definitions by: César Vidril <https://github.com/Yimiprod>
  4. // Definitions: https://github.com/bumbu/svg-pan-zoom
  5. declare namespace SvgPanZoom {
  6. interface Options {
  7. /**
  8. * can be querySelector string or SVGElement (default enabled)
  9. * @type {string|HTMLElement|SVGElement}
  10. */
  11. viewportSelector?: string|HTMLElement|SVGElement;
  12. /**
  13. * enable or disable panning (default enabled)
  14. * @type {boolean}
  15. */
  16. panEnabled?: boolean;
  17. /**
  18. * insert icons to give user an option in addition to mouse events to control pan/zoom (default disabled)
  19. * @type {boolean}
  20. */
  21. controlIconsEnabled?: boolean;
  22. /**
  23. * enable or disable zooming (default enabled)
  24. * @type {boolean}
  25. */
  26. zoomEnabled?: boolean;
  27. /**
  28. * enable or disable zooming by double clicking (default enabled)
  29. * @type {boolean}
  30. */
  31. dblClickZoomEnabled?: boolean;
  32. /**
  33. * enable or disable zooming by scrolling (default enabled)
  34. * @type {boolean}
  35. */
  36. mouseWheelZoomEnabled?: boolean;
  37. /**
  38. * prevent mouse events to bubble up (default enabled)
  39. * @type {boolean}
  40. */
  41. preventMouseEventsDefault?: boolean;
  42. zoomScaleSensitivity?: number; // Zoom sensitivity (Default 0.2)
  43. minZoom?: number; // Minimum Zoom level (Default 0.5)
  44. maxZoom?: number; // Maximum Zoom level (Default 10)
  45. fit?: boolean; // enable or disable viewport fit in SVG (default true)
  46. contain?: boolean; // (default true)
  47. center?: boolean; // enable or disable viewport centering in SVG (default true)
  48. refreshRate?: number | "auto"; // (default 'auto')
  49. beforeZoom?: (oldScale: number, newScale: number) => void | boolean;
  50. onZoom?: (newScale: number) => void;
  51. beforePan?: (oldPan: Point, newPan: Point) => void | boolean | PointModifier;
  52. onPan?: (newPan: Point) => void;
  53. onUpdatedCTM?: (newCTM: SVGMatrix) => void;
  54. customEventsHandler?: CustomEventHandler; // (default null)
  55. eventsListenerElement?: SVGElement; // (default null)
  56. }
  57. interface CustomEventHandler {
  58. init: (options: CustomEventOptions) => void;
  59. haltEventListeners: string[];
  60. destroy: Function;
  61. }
  62. interface CustomEventOptions {
  63. svgElement: SVGSVGElement;
  64. instance: Instance;
  65. }
  66. interface Point {
  67. x: number;
  68. y: number;
  69. }
  70. interface PointModifier {
  71. x: number|boolean;
  72. y: number|boolean;
  73. }
  74. interface Sizes {
  75. width: number;
  76. height: number;
  77. realZoom: number;
  78. viewBox: {
  79. x: number;
  80. y: number;
  81. width: number;
  82. height: number;
  83. };
  84. }
  85. interface Instance {
  86. /**
  87. * Creates a new SvgPanZoom instance with given element selector.
  88. *
  89. * @param {string|HTMLElement|SVGElement} svg selector of the tag on which it is to be applied.
  90. * @param {Object} options provides customization options at the initialization of the object.
  91. * @return {Instance} Current instance
  92. */
  93. (svg: string|HTMLElement|SVGElement, options?: Options): Instance;
  94. /**
  95. * Enables Panning on svg element
  96. * @return {Instance} Current instance
  97. */
  98. enablePan(): Instance;
  99. /**
  100. * Disables panning on svg element
  101. * @return {Instance} Current instance
  102. */
  103. disablePan(): Instance;
  104. /**
  105. * Checks if Panning is enabled or not
  106. * @return {Boolean} true or false based on panning settings
  107. */
  108. isPanEnabled(): boolean;
  109. setBeforePan(fn: (oldPoint: Point, newPoint: Point) => void | boolean | PointModifier): Instance;
  110. setOnPan(fn: (point: Point) => void): Instance;
  111. /**
  112. * Pan to a rendered position
  113. *
  114. * @param {Object} point {x: 0, y: 0}
  115. * @return {Instance} Current instance
  116. */
  117. pan(point: Point): Instance;
  118. /**
  119. * Relatively pan the graph by a specified rendered position vector
  120. *
  121. * @param {Object} point {x: 0, y: 0}
  122. * @return {Instance} Current instance
  123. */
  124. panBy(point: Point): Instance;
  125. /**
  126. * Get pan vector
  127. *
  128. * @return {Object} {x: 0, y: 0}
  129. * @return {Instance} Current instance
  130. */
  131. getPan(): Point;
  132. resetPan(): Instance;
  133. enableZoom(): Instance;
  134. disableZoom(): Instance;
  135. isZoomEnabled(): boolean;
  136. enableControlIcons(): Instance;
  137. disableControlIcons(): Instance;
  138. isControlIconsEnabled(): boolean;
  139. enableDblClickZoom(): Instance;
  140. disableDblClickZoom(): Instance;
  141. isDblClickZoomEnabled(): boolean;
  142. enableMouseWheelZoom(): Instance;
  143. disableMouseWheelZoom(): Instance;
  144. isMouseWheelZoomEnabled(): boolean;
  145. setZoomScaleSensitivity(scale: number): Instance;
  146. setMinZoom(zoom: number): Instance;
  147. setMaxZoom(zoom: number): Instance;
  148. setBeforeZoom(fn: (oldScale: number, newScale: number) => void | boolean): Instance;
  149. setOnZoom(fn: (scale: number) => void): Instance;
  150. zoom(scale: number): void;
  151. zoomIn(): Instance;
  152. zoomOut(): Instance;
  153. zoomBy(scale: number): Instance;
  154. zoomAtPoint(scale: number, point: Point): Instance;
  155. zoomAtPointBy(scale: number, point: Point): Instance;
  156. resetZoom(): Instance;
  157. /**
  158. * Get zoom scale/level
  159. *
  160. * @return {float} zoom scale
  161. */
  162. getZoom(): number;
  163. setOnUpdatedCTM(fn: (newCTM: SVGMatrix) => void): Instance;
  164. /**
  165. * Adjust viewport size (only) so it will fit in SVG
  166. * Does not center image
  167. *
  168. * @return {Instance} Current instance
  169. */
  170. fit(): Instance;
  171. /**
  172. * Adjust viewport size (only) so it will contain in SVG
  173. * Does not center image
  174. *
  175. * @return {Instance} Current instance
  176. */
  177. contain(): Instance;
  178. /**
  179. * Adjust viewport pan (only) so it will be centered in SVG
  180. * Does not zoom/fit image
  181. *
  182. * @return {Instance} Current instance
  183. */
  184. center(): Instance;
  185. /**
  186. * Recalculates cached svg dimensions and controls position
  187. *
  188. * @return {Instance} Current instance
  189. */
  190. resize(): Instance;
  191. /**
  192. * Get all calculate svg dimensions
  193. *
  194. * @return {Object} {width: 0, height: 0, realZoom: 0, viewBox: { width: 0, height: 0 }}
  195. */
  196. getSizes(): Sizes;
  197. reset(): Instance;
  198. /**
  199. * Update content cached BorderBox
  200. * Use when viewport contents change
  201. *
  202. * @return {Instance} Current instance
  203. */
  204. updateBBox(): Instance;
  205. destroy(): void;
  206. }
  207. }
  208. declare const svgPanZoom: SvgPanZoom.Instance;
  209. declare module "svg-pan-zoom" {
  210. export = svgPanZoom;
  211. }