Currently I am using Highcharts for my web app, but now I am building an android app using react-native. Will Highcharts work with React-native.
HighCharts works with the DOM. You cannot use HighCharts or charting libraries that depend on the DOM directly in React Native, but you can use charting libraries in a WebView with React Native. I have not use High Charts specifically, but have used other charting libraries with WebView and it works great.
Here you can use this component to send the config json to the componente and it will be displayed
https://github.com/TradingPal/react-native-highcharts
Two main ways you can utilise Highcharts in React Native app are :
WebView component. I used this technique on other platforms (Appcelerator Titanium) as well.
Official minimal Highcharts wrapper for React : highcharts-react-native.
As of now pre-requisite for this are:
node 11.2+
npm 6.7.0+ or similar package manager
React 16.4+
React native 0.59.3+
To install:
npm install #highcharts/highcharts-react-native
NOTE: There are other un-official wrappers as well like react-native-highcharts but I have not used them.
You can use this module:
react-native-highcharts.
It works using the web engine on Android or iOS and the Highcharts JavaScript module to render dynamic charts.
Example:
<ChartView style={{height:300}} config={conf}></ChartView>
Add this line to the ChartView component : originWhitelist={['']}
Example:
<ChartView style={{height:300}} config={conf} originWhitelist={['']}></ChartView>
Related
I have a nxWorkspace with React, React-Native and Nodejs. I've create a shared assets library to use between React and React Native. I'm able to use it with React, but I have no idea how to use it in the React-Native. I've look at the documents and youtbue videos also, but all of them have used with React or Angular.
apps
- web
- mobile
- server
libs
- shared-assets
Are React, ReactJS and React.js different names for the same thing?
If they are different, what are the differences?
React = react = react.js = reactjs = ...
They all refer to the same JS library.
As Mentioned in their website:
React is a JavaScript library for building user interfaces
From what I know, .js and JS suffixes are a common thing in JavaScript world. Since React is a general world, sometimes they call it ReactJS to show it's a JS library.
Other examples are Next.js, Editor.js, Express.js, Node.js and so on...
Also you can see the website is reactjs.org, but it's called React in the page.
React is a utility package for UI implementation build by javascript.
So the base name is "react", but you can express its language more specifically by attaching js to it and make it bound to the web.
Also, it makes it distinguishable from other libraries called ReactNative.
There is no package such as react.js or ReactJs on npm and the main package is the "react" itself.
These named you've mentioned, might be for the focus on the core name itself, preventing collision from other packages with react itself
There is reactphph but the react keyword is using as a reference to this react not react in any other language or something.
There is module called react elastic carousel for react js. I want to use it in react native for android. Is it possible?
No, React uses HTML tags to render while React Native uses an abstraction over platform native views. They're not compatible.
NO,
Syntax of React & React Native is similar but they both work differently,
React Native components compile into native App component while reactJS is just HTML.
You can read the Difference Between React & React Native for better understanding
When i customize vscode source code, i found it hard to add a page.
I know there are many ways to do so, such as Part/Widget/Browserwindow, but only if i new a Browserwindow can i explicitly load html and js files like in chrome browser and it's friendly.
If i use a Part or a Widget, i need to use native js api to do dom manipulation, and it's so inefficient,
~~so i want to know how did vscode team decide to use no ui framework during the development? Is there some trade-off?~~
i tried to import react and react-dom directly in my own contrib file /vs/workbench/contrib/dialog/browser/dialog.ts, and then get successful compilation and the react component shows up, but i don't know how to add babel with the compilation procedure, so i use react without jsx.
so i want to know how to import react framework into vscode source code project to create ui component? Is there some practices?
I need to use respectively the default iOS and Android Picker in a React web app. I've found a Picker component in React Native which apparently does what I need: https://facebook.github.io/react-native/docs/picker.html Is there any way to import the component in React? Alternatively is it possible to toggle the default picker within React?
There is a project on Github to do exactly what you want called react-native-web which can be found at: https://github.com/necolas/react-native-web
I looked through the repository and found it has the component you want to use.