@linkdesign/screen
Version:
屏组件库，但使用场景又不局限于屏。主要用于BI、大盘和屏
109 lines (103 loc) • 2.68 kB
Markdown
---
title: 组件示例
order: 2
---
## 基础用法
```jsx
import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import { DemoWrapper, TreemapChart, config } from '@linkdesign/screen';
const { _cssPrefix } = config;
class App extends Component {
render() {
return (
<DemoWrapper id="demo-Chart">
<TreemapChart
title="全域车位利用率"
options={{
series: [{
data: [
{
name: '上海市',
value: '10',
cell: () => '10%',
itemStyle: {
color: '#0196ff',
},
},
{
name: '江苏省',
value: '10',
cell: () => '10%',
itemStyle: {
color: '#0086e6',
},
},
{
name: '河南省',
value: '10',
cell: () => '10%',
itemStyle: {
color: '#0077cc',
},
},
{
name: '广东省',
value: '10',
cell: () => '10%',
itemStyle: {
color: '#005b9c',
},
},
{
name: '湖南省',
value: '10',
cell: () => '10%',
itemStyle: {
color: '#004d84',
},
},
{
name: '浙江省',
value: '10',
cell: () => '10%',
itemStyle: {
color: '#013e6c',
},
},
{
name: '福建省',
value: '10',
cell: () => '10%',
itemStyle: {
color: '#03355d',
},
},
{
name: '北京市',
value: '28',
cell: () => '10%',
itemStyle: {
color: '#03355d',
},
},
{
name: '其他',
value: '2',
cell: () => '10%',
itemStyle: {
color: '#04192e',
},
},
]
}]
}}
/>
</DemoWrapper>
);
}
}
ReactDOM.render((
<App />
), mountNode);
```