挂图 HTML5 图表 SDK
包的内容
该档案包含以下文件:
barchart.chart.js- 将图表组件纳入产品中barchart.chart.d.ts- 用于库的 TypeScript 声明文件;请注意这对两个 TypeScript 都有用 财务报告和审定财务报表 JavaScript 项目index.html- 单一图表的网页;请注意,您可能在一个网页内托管许多图表,我们测试了同时显示的几十个图表index.js- 使用一个 自定义 数据输入(提供完全执行)用于演示目的;实际上,输入由Barchart提供,使用图表只需要几行代码style.css- 一种简单的CSS,用于使用暗色主题设计UI的一些元素chart.def.json- 带有一个符号图的默认图表定义(其状态)和使用暗主题的卷研究AMZN_Daily.json- 亚马逊每日数据示意图,用于示范目的AMZN_Events.json- 亚马逊事件数据以示示范package.json- npm 包定义
如何运行示例
请注意, 由于时间序列数据使用 JavaScript 载入 fetch 功能,必须使用网络服务器为网页服务(换句话说,你不能仅仅打开) index.html 从本地文件系统). 你需要一个非常成熟和受欢迎的 我们喜欢的国家预防机制假设你把SDK解压到 chart-lib 文件夹,只需进入 chart-lib 文件夹并运行 serve .。默认情况下,服务器将服务于 index.html 在5000个港口 为了保持实例的运行,请联系Barchart并获得一个API 密钥,该密钥应取代 <YOUR_API_KEY> 输入 index.js。 。 。 .
浏览器支持
为了保持图表组件的大小合理小,我们已经为上个 EcmaScript (JavaScript) 标准构建了组件. 所有主要浏览器的后2个版本都支持这个标准,因此需要现代浏览器来使用组件.
请注意该部分 能够 用于支持更古老的浏览器(例如IE 11,我们没有测试更古老的版本)而牺牲其大小,而对于非常古老的浏览器来说,其尺寸通常会大大增加.
使用 npm 的库
当示例代码( E)index.html 和相关文件)是完整的,并且是可行的,它没有显示现代的JavaScript开发情景——它更类似于一种传统的方法,即您在HTML中引用库,然后在脚本中使用从Barchart"namespace"中获取的资源.
然而,这只是一种而且肯定不是使用图书馆的唯一方法。 如果您想引用并用您的代码构建库, 您正在使用 无 - 几乎所有现代方法都做到的 - 和任何现代捆绑工网络软件包, (中文(简体) ), 滚动, (中文(简体) ), 括号 或者说 维特和转写器喜欢 宝贝,那么请 一个 两者中:
- 如果您有网络访问权限, 请按惯例从 npm 安装我们的库, 也就是说
npm i @barchart/chart-lib或者说yarn add @barchart/chart-lib - 如果您没有网络访问, 您可以通过运行直接从此归档( 不需要解压缩) 安装软件包
npm i /path/to/chart-lib.tgz或者说yarn add file:/path/to/chart-lib.tgz
你现在可以 import 图表库导出的任何函数/类/算法;以上TypeScript声明文件都对此有记载。 我们的模块名称是 @barchart/chart-lib。 。 。 .
图表部分具有框架不可知性,与任何现代联合来文框架同样有效,而且根本没有框架.
何处找到更多信息
图表组件/SDK不携带任何形式的UI来发. API 图表对应的是 此处记录我们正忙于工作,使文件更清晰,更容易使用,请经常复检.
我们确实有一个产品,叫做部件,它包括UI。 一个 UI 构建器生成 HTML 的小片段, 以获取您的页面上的部件 在部件站点。 。 。 . 同样部件的力量 我们的演示网站。部件使用 Barchart 的尖端(专有)库编写,该库将生成 Web 组件,帮助保持软件包的尺寸小而高效.
请注意,我们正在使用 组件是,在很多 巴图的 产品。 该组件自2016年起投入生产,在几种不同的情景中进行了战斗测试----既基于页面,又基于SPA。 我们很乐意帮助您将组件融入您的产品中.