{"_id":"@alex-wilmer/react-lolliplot","_rev":"3-3acbc55726b9bddfe9ef88871d757a60","name":"@alex-wilmer/react-lolliplot","description":"A protein viewer built with d3 (React Component)","dist-tags":{"latest":"0.6.1"},"versions":{"0.6.1":{"homepage":"https://github.com/oncojs/lolliplot#readme","license":"Apache-2.0","bugs":{"url":"https://github.com/oncojs/lolliplot/issues"},"keywords":["d3","react","reactjs","boilerplate","hot","reload","hmr","live","edit","webpack"],"repository":{"type":"git","url":"git+https://github.com/oncojs/lolliplot.git"},"author":{"name":"OncoJS","url":"https://github.com/oncojs/"},"private":false,"name":"@alex-wilmer/react-lolliplot","version":"0.6.1","description":"A protein viewer built with d3 (React Component)","browser":"dist/umd/index.min.js","main":"dist/lib/index.js","dependencies":{"d3-selection":"^1.0.3","invariant":"^2.2.2","lodash.range":"^3.2.0","react":"^15.4.1","react-faux-dom":"^3.0.1"},"peerDependencies":{},"jsnext:main":"dist/es6/index.js","_id":"@alex-wilmer/react-lolliplot@0.6.1","scripts":{},"_shasum":"aa9b9407f2e500fcf1fd0f906eb40e09b705a30e","_from":".","_npmVersion":"4.1.2","_nodeVersion":"7.7.3","_npmUser":{"name":"alex-wilmer","email":"djazium@gmail.com"},"dist":{"shasum":"aa9b9407f2e500fcf1fd0f906eb40e09b705a30e","tarball":"https://registry.npmjs.org/@alex-wilmer/react-lolliplot/-/react-lolliplot-0.6.1.tgz","integrity":"sha512-8lyyxEPnetJO2TNV3czyPeA1R9FYvT0Ik+PRB/YJFeo5v/opx22Vs2KXblGiD9+5rVbFzmVjwTP0RgCDFaq3sQ==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDotT8hgIA4Y/PahMw0nOZ7oEl6JBdIdaBEtxB373HrmQIhAJkQV0lQ5zRPqtk18PH0wnDVuMCuF3vlSHMa+9v91nyS"}]},"maintainers":[{"name":"alex-wilmer","email":"djazium@gmail.com"}],"_npmOperationalInternal":{"host":"packages-12-west.internal.npmjs.com","tmp":"tmp/react-lolliplot-0.6.1.tgz_1491509479656_0.4873354008886963"}}},"readme":"Protein Lolliplot :lollipop: :bar_chart:\n=====================\n\n![](lolliplot.gif)\n\nVisualization to view relationship between common mutations and their location on a gene.\n\n### **IMPORTANT: This library does NOT provide its own `d3` object**\n\n**You must pass in `d3` to the constructor function. Currently tested with v3 and v4.**\n\n\n## Usage\n\nThis library exports a top level constructor function which generates the chart,\nand a redux store creation function in case you want to set some default store values\nbefore the chart function runs. That is optional though, as the default store will be\nreturned from the constructor.\n\n```\nimport ProteinLolliplot, { setupStore } from '@alex-wilmer/lolliplot'\n\nlet store = setupStore({ domainWidth: 200 })\nstore.subscribe(() => {\n  let state = store.getState()\n  // listen for changes  \n})\n\nlet = {\n  reset,\n  updateStats,\n  draw,\n  remove,\n  store: defaultStore,\n} = ProteinLolliplot(args)\n```\n\n## API\n\n```\ntype TProteinLolliplotArgs = {\n  d3: Object,\n  selector: string,\n  element: Object,\n  data: Object,\n  domainWidth: number,\n  width: number,\n  height: number,\n  store?: Object,\n  hideStats?: bool,\n  animate?: bool,\n  selectedMutationClass?: string,\n  mutationId?: string,\n  yAxisOffset?: number,\n  xAxisOffset?: number,\n  proteinHeight?: number,\n  numXTicks?: number,\n  numYTicks?: number,\n  proteinDb?: string,\n  onMutationClick?: Function,\n  onMutationMouseover?: Function,\n  onMutationMouseout?: Function,\n  onProteinMouseover?: Function,\n  onProteinMouseout?: Function,\n  onInit?: Function,\n}\ntype TProteinLolliplotReturn = {\n  reset: Function,\n  updateStats: Function,\n  draw: Function,\n  remove: Function,\n  store: Object,\n}\n```\n\n### Constructor Arguments\n\n`d3`: Your supplied `d3` object (v3 || v4). **Required!**\n\n`selector`: the selector of the element to attach the chart to\n\n`element`: the element which the viz will attach to. takes precedence over `selector`\n\n**One of `selector` or `element` is required!**\n\n`data`: an object containing an array of proteins and an array of mutations **Required!**\n\n`domainWidth`: The amino acid length of the transcript\n\n`width (optional)`: width of the chart\n\n`height (optional)`: height of the chart\n\n`store (optional)`: the redux store created by `setupStore`\n\n`hideStats (optional)`: if `true`, do not display the summary box next of the chart\n\n`animate (optional)`: animate the view to the new zoom area. defaults to `true`\n\n`selectedMutationClass (optional)`: sets the default filter on the mutation class (Consequence, Impact, etc)\n\n`mutationId (optional)`: will highlight the mutation matching this id\n\n`yAxisOffset (optional)`: The padding between the left side of the chart and the y axis\n\n`xAxisOffset (optional)`: The padding between the bottom of the chart and the x axis\n\n`proteinHeight (optional)`: The height of the protein row under the main chart\n\n`onInit (optional)`: will run once everything has been setup\n\n#### Mouse events\n\nReceive `(data, event)` as arguments.\n\n`onMutationClick (optional)`\n`onMutationMouseover (optional)`\n`onMutationMouseout (optional)`\n`onProteinMouseover (optional)`\n`onProteinMouseout (optional)`\n\n\n### Returned Object\n\n`reset`: Sets the most zoomed out position, and resets any filter options\n\n`updateStats`: Force the stats to update itself based on the current chart zoom level\n\n`draw`: Re-renders the chart (will call recursively while `store.getState().animating === true`)\n\n`remove`: Removes the chart from the DOM and any event handlers created during setup\n\n`store`: The redux store passed in during creation, or the default one if not\n\n## Development\n\n#### Install / Run Dev Server\n\n```\nyarn && yarn start\n```\n\nThen go to http://localhost:8080/\n","maintainers":[{"name":"alex-wilmer","email":"djazium@gmail.com"}],"time":{"modified":"2022-06-12T14:28:03.453Z","created":"2017-04-06T20:11:20.018Z","0.6.1":"2017-04-06T20:11:20.018Z"},"homepage":"https://github.com/oncojs/lolliplot#readme","keywords":["d3","react","reactjs","boilerplate","hot","reload","hmr","live","edit","webpack"],"repository":{"type":"git","url":"git+https://github.com/oncojs/lolliplot.git"},"author":{"name":"OncoJS","url":"https://github.com/oncojs/"},"bugs":{"url":"https://github.com/oncojs/lolliplot/issues"},"license":"Apache-2.0","readmeFilename":"README.md"}