@aparte/plugin-echarts (中文(简体) )

图表 独立 通过 Apache ECharts (英语)。 。 。 . 每个 ```echarts 答复中的围栏——ECharts option 作为图表绘制的JSON 它流出,无论马克下供货商是安装的,还是没有。 其结果是一种选择的工具 也可以用同样的方式取而代之.

npm install @aparte/plugin-echarts @aparte/core echarts

import { setupECharts } from '@aparte/plugin-echarts';

setupECharts();

@aparte/core 财务报告和审定财务报表 echarts (6.0或更后)为 同行依赖关系. ECharts 装入到 第一张图表,不是在之前,一个图表只有在靠近屏幕时才被绘制出来,所以重新打开一个 长话短说.

栅栏

尸体是ECHHarts的自己,是ECHarts的,是ECHARTS的自己 option作为JSON——没有什么新东西可以学习, 和什么模型已经 从ECharts的文档中知道. echart 也是语言.

```echarts
{
  "title": { "text": "Sales by month" },
  "tooltip": { "trigger": "axis" },
  "xAxis": { "type": "category", "data": ["Jan", "Feb", "Mar"] },
  "yAxis": { "type": "value" },
  "series": [{ "name": "Sales", "type": "bar", "data": [120, 200, 150] }]
}
```

虽然答复流出,但图表取自JSON中已经到达的部分,即: 最后的整数值,括号被关闭——最多每300 ms,所以条以数字形式出现 do;每个帧更新相同的图表. 一旦栅栏关闭, 一个无效的JSON—— 或者是, 但是没有 series 没有 dataset 绘制——显示注释及其出处.

一个工具的结果

setupECharts({
  tool: 'plot_sales',                        // a name, a RegExp, or an array of them
  map: (result, input) => ({                 // optional: your tool's data → an ECharts option
    title: { text: String(input.metric) },
    xAxis: { type: 'category', data: result.months },
    yAxis: {},
    series: [{ type: 'line', data: result.values }],
  }),
});

无 map,结果本身就是选择: structuredContent 当它有一个, 否则它的 文本读作JSON。 当工具运行时,一个静静的盒子将显示图表的位置;等待 批准,拒绝,停止或失败, 单行本说.

聊天的颜色

图表取自聊天符号的外观——正文(--aparte-text),轴标签 (单位:千美元)--aparte-text-muted),轴线和网格线(--aparte-border),工具提示的地盘 (单位:千美元)--aparte-surface-1),字体(--aparte-font-family)),作为透明背景——作为 欧共体 主题,所以任何选项设置自己 胜过它。 轻/暗开关转接器 所设置的图表( e)setTheme),没有再画.

系列颜色从 --aparte-primary,然后验证8个色视 缺损(每相邻一对至少8-----------------------------------------------------------------------------------) 15分全色视星等的 三色视星等 一次踩出亮地 一次踩出暗地 连锁店都开着 初等货代替距离最近的货 ——以一铜为主取而代之的是"黄"——所以没有两人相并相并相并相并相并相并相相并相并相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相 他们是 ECHARTS_SERIES_HUES· ; echartsPalette(primary, dark) 给命令.

echartsTheme(tokens) 是主题本身, 纯正的—— 同样的符号使主题相同, 在节点 和浏览器一样,对于一个应该看起来像聊天的图表:

import * as echarts from 'echarts';
import { echartsTheme, type EChartsTokens } from '@aparte/plugin-echarts';

const tokens: EChartsTokens = {
  text: '#241f2b', muted: '#6d6479', border: '#e5ddce',
  surface: '#fffdf8', background: '#f6f2ea', primary: '#b07d33',
};
echarts.init(document.getElementById('my-chart')!, echartsTheme(tokens), { renderer: 'svg' });

大小、动作、屏幕阅读器

该图填充了气泡的宽度,最高可达40雷姆,在 height (默认为18雷姆) 框中。 它用 ECharts 的 SVG 渲染器绘制: 在任何缩放时都清晰,其正文为 真实文本。 下 prefers-reduced-motion 无动静:动画在根上被关闭,在每一个上 系列,打开 graphic 和在a中 baseOption,一个时间线不 发挥自己,一个 effectScatter 只有悬浮时才有波纹 lines 未绘制线索.

这是一个 figure 按选项命名 title.text,还有"图". 里面是ECHHarts自己写的 说明在(aria.enabled,在聊天语言中,当该语言注册时 ECharts, 英语除外)在插件自己的设置中——一个选项不能关闭其标签或 改为: description 国家;仅指 aria.decal 保留。 一个视觉隐藏的表格 当选项说得很清楚时, 持有数字: a dataset (其第一行标题) eCharts的阅读方式 sourceHeader),一个带有其序列的分类轴,或者一个派命名的值. A 类 没有数据的序列没有列,表格以1000行、50列和10 000个单元格止步, 无论选项问什么——最后一行也隐藏着,当它只列出部分数据时就表示.

它的词跟随聊天语言(其中十个是用语言建的),可以被设定为: extendLocale()数字 :

aparteGlobalConfig.extendLocale({
  echartsChart: 'Chart',                           // the name of an untitled chart
  echartsError: 'This chart could not be drawn.',
  echartsLoading: 'Loading chart',
  echartsWaiting: 'Waiting for your approval',
  echartsNotRun: 'No chart: the tool did not run.',
  echartsFailed: 'No chart: the tool failed.',
  echartsTableCut: 'Only part of the data is listed.', // the hidden table's last line, when it is cut
});

选项

setupECharts(options?, config?) 带 EChartsOptions数字 :

两种设置函数都返回一个处理器,该处理器可以解除渲染器的注册,停止观看主题 并销毁他们绘制的每一张图表.

模特儿的选择是不行的

选项来自模型或工具,所以 sanitizeEChartsOption(option) 随便拿掉什么 ECharts在绘制前会变成HTML,请求或导航——并且只有:

• 工具提示被绘制出,从不写作HTML. 每个 tooltip ("根","系列","数据") 强制 renderMode: 'richText',则只使用 HTML extraCssText, (中文(简体) ), className, (中文(简体) ), appendTo 财务报告和审定财务报表 appendToBody 开始 字符串 formatter 保留:以丰富文本模式 ECharts 绘制 作为文本,所以 <b> 显示为 <b>。 。 。 .
• 没有下载,没有HTML面板. toolbox.feature.saveAsImage (下载,或新标签)和 toolbox.feature.dataView (一个带有文本区域的HTML表格)去.
• 没有照片. A 类 graphic 要素 type: 'image',任何带有 image (图) 填充,丰富文本背景)或 svgElement (一个SVG模式ECharts通过节点建立节点——) (单位:千美元) <script> 将运行),任何 image://… 字符串(一个符号、一个图例或手柄图标),以及任何 字符串持有 CSS url(…) (填入另一个文件)读取其CSS 越出解码,因为一个填充需要 u\rl( 作为 url(; 任何字符串将反斜线与 括号也去.
• 只有颜色去的地方. ECharts 副本 a color, (中文(简体) ), fill, (中文(简体) ), stroke 或任何 …Color 输入 SVG 属性,所以只保留颜色语法:一个名称, #hex,或 rgb() 编号 : rgba() 编号 : hsl() 编号 : hsla() 最多64个字符。 梯度是对象 ECharts 自建;其停站也按同样方式检查.
• 仅作为光标的关键字 . 序列或元素 cursor数据Zoom的 cursorGrab 编号 : cursorGrabbing当它们成为关键词时留下 (单位:千美元)pointer, (中文(简体) ), not-allowed, (中文(简体) ), grab(三); image-set("https://…") 因为浏览器会 当指针通过图表时获取图片.
• 无正则表达. 数据集 filter 变换 reg 编译并运行于每个 值,且图案可以回溯分钟(^(a+)+$因此,每个 reg 继续.
• 无链接. 字符串 link 或者说 sublink (标题、树图或日出节点——ECharts打开) 点击它,和 javascript: 将运行在页面中)去.
• 通过字体没有 CSS . ECharts 写着 fontFamily, (中文(简体) ), fontSize, (中文(简体) ), fontStyle, (中文(简体) ), fontWeight 财务报告和审定财务报表 font 改为 a style 属性; 含有字体名称以外的任何值.
• __proto__, (中文(简体) ), constructor 财务报告和审定财务报表 prototype 钥匙去.

功能不能到达JSON,所以 formatter 或者说 renderItem 召回从来没有。 选项 作为图中元素属性的逃出值( 栅栏) 手芯标记,而不是节点; ECharts将其引入该元素,表格的单元格是 写成文字.

两个切入点

@aparte/plugin-echarts 以第一个图表为基础导入完整的ECharts。 要交出你 拥有——一个只有您使用的图表的更小的建筑——从没有进口的条目导入 从 echarts数字 :

import * as echarts from 'echarts/core';
import { BarChart, LineChart, PieChart } from 'echarts/charts';
import {
  AriaComponent, DatasetComponent, GridComponent, LegendComponent, TitleComponent, TooltipComponent,
} from 'echarts/components';
import { SVGRenderer } from 'echarts/renderers';
import { setupEChartsWith } from '@aparte/plugin-echarts/core';

// `AriaComponent` and `SVGRenderer` are what the plugin itself uses.
echarts.use([
  BarChart, LineChart, PieChart,
  AriaComponent, DatasetComponent, GridComponent, LegendComponent, TitleComponent, TooltipComponent,
  SVGRenderer,
]);
setupEChartsWith(echarts);

setupEChartsWith 将模块,或函数返回其承诺,以及任何对象 形状像 EChartsLike (单位:千美元)init,返回一个 EChartsInstanceLike数字 : setOption, (中文(简体) ), setTheme, (中文(简体) ), resize, (中文(简体) ), dispose) (中文(简体) ). 您的建筑缺少的序列类型图表显示了注释 。 这个 /core 条目导出相同的助手和类型 : sanitizeEChartsOption, (中文(简体) ), echartsTheme, (中文(简体) ), echartsPalette, (中文(简体) ), ECHARTS_SERIES_HUES, (中文(简体) ), EChartsOption, (中文(简体) ), EChartsTokens, (中文(简体) ), EChartsOptions。 。 。 .

仅限无害环境管理.