# mkschart

> mkschart

Latest version **72.0.0** (published 2024-02-15) · 0 weekly downloads

## Install

```sh
npm install mkschart
pnpm add mkschart
yarn add mkschart
bun add mkschart
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; large bundle.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 72.0.0 |
| Published | 2024-02-15 |
| First published | 2024-01-10 |
| Weekly downloads | 0 |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 6 |
| Unpacked size | 14.2 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | hrishith123 |

## Links

- npm: https://www.npmjs.com/package/mkschart
- npm.io page: https://npm.io/package/mkschart

## Dependencies (6)

- [ramda](https://npm.io/package/ramda.md) ^0.29.1
- [react](https://npm.io/package/react.md) ^18.2.0
- [anychart](https://npm.io/package/anychart.md) ^8.12.0
- [date-fns](https://npm.io/package/date-fns.md) ^2.19.0
- [react-dom](https://npm.io/package/react-dom.md) ^18.2.0
- [react-scripts](https://npm.io/package/react-scripts.md) 5.0.1

## Recent versions

- 72.0.0 (latest) — 2024-02-15
- 70.0.0 — 2024-02-15
- 50.0.0 — 2024-02-07
- 49.0.0 — 2024-02-07
- 48.0.0 — 2024-02-07
- 45.0.0 — 2024-02-07
- 41.0.0 — 2024-02-06
- 40.0.0 — 2024-02-06
- 36.0.0 — 2024-02-06
- 34.0.0 — 2024-02-06
- 33.0.0 — 2024-02-06
- 32.0.0 — 2024-02-06
- 31.0.0 — 2024-02-06
- 28.0.0 — 2024-02-06
- 27.0.0 — 2024-02-06
- … 34 more at https://npm.io/package/mkschart/versions

## README

# Getting Started with Create React App

This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).

## Available Scripts

In the project directory, you can run:

### `yarn start`

Runs the app in the development mode.\
Open [http://localhost:3000](http://localhost:3000) to view it in your browser.

The page will reload when you make changes.\
You may also see any lint errors in the console.


### `yarn build`

Rollup bundle is created at dist/mkschart.js


### Dependency
Need to import script in which react project we are going to import the mkschart
  <script src="https://unpkg.com/react@18.2.0/umd/react.development.js"></script>


### Package installation for react
`yarn add mkschart`

### Import methods for react
import MKSChart from 'mkschart'

function App() {
  const data = {
    ticker: ticker,
    apiKey: apiKey,
    baseURL: baseURL,
  };

  return (
    <div style={{ width: '100%', height: '95vh' }}> //height and width must be define
      <MKSChart data={data} />
    </div>
  );
}

export default App;

### Import method using mkschartHTML.js bundle
import { useEffect } from 'react';
import '../mkschartHTML.js'; //path from where the bundle is imported

const MKSChart = ({ data }) => {

  useEffect(() => {
    if (window.createMksChart) {
      window.createMksChart(data);
    } else {
      console.error('createMksChart function not found in the global scope.');
    }
  }, [data])

  return (
    <div style={{ width: '100%', height: '100%', position: 'relative' }}>
      <div id='chart-container' style={{ height: '100%' }} />
    </div>
  )
};

export default MKSChart;

---
_Source: https://npm.io/package/mkschart · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._