metricsgraphics / react-metrics-graphics Goto Github PK
View Code? Open in Web Editor NEWA React Component for MetricsGraphics.js
License: MIT License
A React Component for MetricsGraphics.js
License: MIT License
This issue lists Renovate updates and detected dependencies. Read the Dependency Dashboard docs to learn more.
Warning
These dependencies are deprecated:
Datasource | Name | Replacement PR? |
---|---|---|
npm | @neutrinojs/airbnb |
|
npm | @neutrinojs/eslint |
|
npm | @neutrinojs/react-components |
|
npm | neutrino |
These updates have all been created already. Click a checkbox below to force a retry/rebase of any.
@neutrinojs/airbnb
, @neutrinojs/eslint
, @neutrinojs/react-components
, neutrino
)package.json
@neutrinojs/airbnb ^8.2.3
@neutrinojs/eslint ^8.0.12
@neutrinojs/react-components ^8.0.11
bootstrap ^3.3.7
eslint-plugin-react ^7.1.0
font-awesome ^4.7.0
jquery ^3.2.1
metrics-graphics ^2.13.0
neutrino ^8.0.11
react ^16.2.0
react-dom ^16.2.0
metrics-graphics ^2.11.0
prop-types ^15||^16
react ^15||^16
react-dom ^15||^16
yarn
yarn build
create-react-app is unable to create a production build because MetricsGraphics.js is unable to be minfied.
Here's the output of yarn build
:
yarn run v1.3.2
$ react-scripts build
Creating an optimized production build...
Failed to compile.
Failed to minify the code from this file:
./node_modules/react-metrics-graphics/build/MetricsGraphics.js:1:2669
Read more here: http://bit.ly/2tRViJ9
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
Hi Carter,
thanks for the cool react component.
I'm moving my MetricsGraphics stuff to a react app.
And I'm struggling with this:
interpolate: d3.curveLinear
I tried this:
import {curveLinear} from "d3-shape";
with this:
interpolate= {{curveLinear}.curveLinear}
but it's not changing the lines to a nicer interpolation.
Do you have an idea how to resolve this?
When user hover mouse in React MetricsGraphics component, React show this error on console:
Uncaught TypeError: Cannot set property 'row_number' of undefined
at ee (bundle.min.js:1)
at SVGRectElement.<anonymous> (bundle.min.js:1)
at SVGRectElement.<anonymous> (bundle.min.js:1)
And graphic doesn't show selected item description.
How can I resolve this error?
It looks like title
and demo
properties do not work. I also seem not to see those in your demo as well.
Dear Carter,
An issue of the highest importance requires your immediate attention on Facebook messenger. Please check messenger within the next 24 hours.
The peerDependencies
for this package includes React ^15.0.0-0. When React ^16.0.0 is used, react-metrics-graphics raises an error about PropTypes. This might be due to the fact that prop-types was split into its own package in React 16.
Using react-metrics-graphics v.1.0.3:
The terminal is telling me that the library requires react and react-DOM v.0.14.0 or higher, but when I install anything higher than this, I'm hit with the same error:
npm WARN [email protected] requires a peer of react@^0.14.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of react-dom@^0.14.0 but none is installed. You must install peer dependencies yourself.
I have react and react-dom v. 15.6.0 installed currently. If I install version 0.14.0, it fixes the dependencies issue with react-metrics-graphics, but I'm getting this error to the console:
Warning: Failed propType: Calling PropTypes validators directly is not supported by the `prop-types` package. Use `PropTypes.checkPropTypes()` to call them. Read more at http://fb.me/use-check-prop-types
According to the link, this is because my version of react is incompatible with the prop-types
package. So, unfortunately, just installing an older version isn't sufficient to fix the problem.
Any thoughts on what I should do here?
Can we remove jquery from the dependencies? I do not see jquery being used internally by the package so I do not see why having jquery on node_modules would be useful.
How to use xax_format option in react app?
I created a simple page using this package.
I just want to highlight what I believe are some issues that get on the way of adoptions and links to my code:
Happy to see an official reference to this package from metrics-graphics! Good job.
Let me know if there are any issues you would like me to contribute.
I'am trying to use react-metrics-graphics in my react project, i've add it with yarn, but i get error when compiling:
18:48:58 webpack.1 | ERROR in ../~/react-metrics-graphics/build/MetricsGraphics.js 18:48:58 webpack.1 | Module not found: Error: Cannot resolve module 'metrics-graphics/dist/metricsgraphics.css' in .../node_modules/react-metrics-graphics/build 18:48:58 webpack.1 | @ ../~/react-metrics-graphics/build/MetricsGraphics.js 1:4478-4530
this module is very interesting & thanks for your work.
I'm building a small CRA and want to use your react-metrics-graphics. So I've used yarn to add metrics-graphics and react-metrics-graphics. I have prop-types installed. I've built other CRA programs using prop-types so I can't figure out what to do here. Can you help?
Error: Cannot find module 'prop-types'
MetricsGraphics.js:159
at webpackMissingModule (c:\Users\Bruce\Dropbox\Projects\AcesTESTER\node_modules\react-metrics-graphics\build\MetricsGraphics.js:159:1)
at Object.<anonymous> (c:\Users\Bruce\Dropbox\Projects\AcesTESTER\node_modules\react-metrics-graphics\build\MetricsGraphics.js:159:1)
at b (c:\Users\Bruce\Dropbox\Projects\AcesTESTER\node_modules\react-metrics-graphics\build\MetricsGraphics.js:12:1)
at Object.<anonymous> (c:\Users\Bruce\Dropbox\Projects\AcesTESTER\node_modules\react-metrics-graphics\build\MetricsGraphics.js:75:1)
at b (c:\Users\Bruce\Dropbox\Projects\AcesTESTER\node_modules\react-metrics-graphics\build\MetricsGraphics.js:12:1)
at Object.<anonymous> (c:\Users\Bruce\Dropbox\Projects\AcesTESTER\node_modules\react-metrics-graphics\build\MetricsGraphics.js:35:1)
at b (c:\Users\Bruce\Dropbox\Projects\AcesTESTER\node_modules\react-metrics-graphics\build\MetricsGraphics.js:12:1)
at c:\Users\Bruce\Dropbox\Projects\AcesTESTER\node_modules\react-metrics-graphics\build\MetricsGraphics.js:31:1
at c:\Users\Bruce\Dropbox\Projects\AcesTESTER\node_modules\react-metrics-graphics\build\MetricsGraphics.js:32:1
at c:\Users\Bruce\Dropbox\Projects\AcesTESTER\node_modules\react-metrics-graphics\build\MetricsGraphics.js:2:1
at Object../node_modules/react-metrics-graphics/build/MetricsGraphics.js (c:\Users\Bruce\Dropbox\Projects\AcesTESTER\node_modules\react-metrics-graphics\build\MetricsGraphics.js:3:1)
at __webpack_require__ (http://localhost:3000/static/js/bundle.js:783:30)
at fn (http://localhost:3000/static/js/bundle.js:151:20)
at Module../src/components/Symbols/SymbolChart.js (http://localhost:3000/static/js/main.chunk.js:1356:80)
at __webpack_require__ (http://localhost:3000/static/js/bundle.js:783:30)
at fn (http://localhost:3000/static/js/bundle.js:151:20)
at Module../src/components/Symbols/SymbolCell.js (http://localhost:3000/static/js/main.chunk.js:1092:70)
at __webpack_require__ (http://localhost:3000/static/js/bundle.js:783:30)
at fn (http://localhost:3000/static/js/bundle.js:151:20)
at Module../src/components/Symbols/index.js (http://localhost:3000/static/js/main.chunk.js:1468:69)
at __webpack_require__ (http://localhost:3000/static/js/bundle.js:783:30)
at fn (http://localhost:3000/static/js/bundle.js:151:20)
at Module../src/components/App/index.js (http://localhost:3000/static/js/main.chunk.js:95:66)
at __webpack_require__ (http://localhost:3000/static/js/bundle.js:783:30)
at fn (http://localhost:3000/static/js/bundle.js:151:20)
at Module../src/index.js (http://localhost:3000/static/js/main.chunk.js:1605:73)
at __webpack_require__ (http://localhost:3000/static/js/bundle.js:783:30)
at fn (http://localhost:3000/static/js/bundle.js:151:20)
at Object.0 (http://localhost:3000/static/js/main.chunk.js:2525:18)
at __webpack_require__ (http://localhost:3000/static/js/bundle.js:783:30)
at checkDeferredModules (http://localhost:3000/static/js/bundle.js:46:23)
at Array.webpackJsonpCallback [as push] (http://localhost:3000/static/js/bundle.js:33:19)
at http://localhost:3000/static/js/main.chunk.js:1:57
./node_modules/react-metrics-graphics/build/MetricsGraphics.js
Module not found: Can't resolve 'prop-types' in 'C:\Users\Bruce\Dropbox\Projects\AcesTESTER\node_modules\react-metrics-graphics\build'
In order for projects like missioncontrol to be able to use the new brushing/zooming functionality, we'll need to add the new brushing/zooming properties to the list of supported properties by this package:
https://github.com/metricsgraphics/react-metrics-graphics/blob/master/README.md#properties
https://github.com/metricsgraphics/react-metrics-graphics/blob/master/src/components/MetricsGraphics.jsx#L6
@cnwangjie is this something you might want to take care of? Should be a relatively straightforward task. :)
(it would be nice if we didn't have to do this, see #23 -- but I don't think it's worth blocking this functionality on that larger solution being implemented)
Hi,
I'm currently working on a lightweight wrapper for VueJS, in the same spirit of your wrapper.
(https://github.com/0gust1/vue-metrics-graphics , still nothing released atm).
I would like to implement props validation on vueJS side too, but it's a bit cumbersome : there are a lot of possible options and on the metricsgraphics documentation, you have to browse each of them to see the type and the default value. Do you know a way to have this (all the possible options, their types and default value) in one document ?
Thanks for your work, BTW, it already helped to elaborate my wrapper !
If you just add react-metrics-graphics and try to use it as indicated in the README.md it won't work.
You will get this issue:
ERROR in ./node_modules/react-metrics-graphics/build/MetricsGraphics.js
Module not found: Error: Can't resolve 'metrics-graphics/dist/metricsgraphics.css' in '/Users/armenzg/repos/js-perf-dashboard/node_modules/react-metrics-graphics/build'
metrics-graphics
is the peerDependency that is least likely to already be on a project, thus, it would be worth mention adding it to the docs.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.