https://github.com/justjavac/chart_as_a_service
Chart as a Service
https://github.com/justjavac/chart_as_a_service
deno echarts
Last synced: 3 months ago
JSON representation
Chart as a Service
- Host: GitHub
- URL: https://github.com/justjavac/chart_as_a_service
- Owner: justjavac
- License: mit
- Created: 2022-04-29T09:08:19.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2022-08-03T13:42:58.000Z (over 3 years ago)
- Last Synced: 2025-04-07T18:03:50.074Z (9 months ago)
- Topics: deno, echarts
- Language: TypeScript
- Homepage: https://chart.deno.dev
- Size: 17.6 KB
- Stars: 16
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Chart Service
服务器端生成 SVG 图片，可以嵌入到任何地方。
![](https://chart.deno.dev?option={"xAxis":{"type":"category","data":["Mon","Tue","Wed","Thu","Fri","Sat","Sun"]},"yAxis":{"type":"value"},"series":[{"data":[150,230,224,218,135,147,260],"type":"line"}]})
Usage:
```
https://chart.deno.dev?w=[width]&h=[height]&option=[json]
```
- `w`: 宽。默认 `500`。
- `h`: 高。默认 `300`。
- `option`: echarts 配置项，。
## Examples:
### 折线图
echarts 配置：
```ts
option = {
xAxis: {
type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
},
yAxis: {
type: 'value'
},
series: [
{
data: [150, 230, 224, 218, 135, 147, 260],
type: 'line'
}
]
};
```
将图表嵌入到 Markdown:
```
![](https://chart.deno.dev?option={"xAxis":{"type":"category","data":["Mon","Tue","Wed","Thu","Fri","Sat","Sun"]},"yAxis":{"type":"value"},"series":[{"data":[150,230,224,218,135,147,260],"type":"line"}]})
```
效果:
![](https://chart.deno.dev?option={"xAxis":{"type":"category","data":["Mon","Tue","Wed","Thu","Fri","Sat","Sun"]},"yAxis":{"type":"value"},"series":[{"data":[150,230,224,218,135,147,260],"type":"line"}]})
### 雷达图
```
https://chart.deno.dev?option={"radar":{"indicator":[{"name":"Sales","max":6500},{"name":"Administration","max":16000},{"name":"Information","max":30000},{"name":"Customer","max":38000},{"name":"Development","max":52000},{"name":"Marketing","max":25000}]},"series":[{"name":"Budget","type":"radar","data":[{"value":[4200,3000,20000,35000,50000,18000],"name":"Allocated"},{"value":[5000,14000,28000,26000,42000,21000],"name":"Actual"}]}]}
```
![](https://chart.deno.dev?option={"radar":{"indicator":[{"name":"Sales","max":6500},{"name":"Administration","max":16000},{"name":"Information","max":30000},{"name":"Customer","max":38000},{"name":"Development","max":52000},{"name":"Marketing","max":25000}]},"series":[{"name":"Budget","type":"radar","data":[{"value":[4200,3000,20000,35000,50000,18000],"name":"Allocated"},{"value":[5000,14000,28000,26000,42000,21000],"name":"Actual"}]}]})