AnyChart 数据可视化框架

news2024/11/13 8:02:15

AnyChart 数据可视化框架

AnyChart 是一个灵活的 JavaScript(HTML5、SVG、VML)图表框架,适合任何需要数据可视化的解决方案。

目录

  • 下载并安装
  • 开始
  • 插件
  • 将 AnyChart 与 TypeScript 结合使用
  • 将 AnyChart 与 ECMAScript 6 结合使用
  • 技术集成
  • 贡献指南
  • 构建和调试
  • 模块系统
  • 包目录
  • 接触
  • 链接
  • 许可证

下载并安装

有几种方法可以下载/安装 AnyChart。

直接下载

所有二进制文件都位于 dist 文件夹中。

CDN (中文版)

如果您不想自己下载和托管 AnyChart,您可以从 AnyChart CDN(内容交付网络)中包含它:https://www.anychart.com/download/cdn

<head>
<script src="https://cdn.anychart.com/releases/v8/js/anychart-base.min.js"></script>
</head>
包管理器

您可以使用 npmbower 或 yarn 安装 AnyChart:

  • npm install anychart
  • bower install anychart
  • yarn add anychart

开始

开始使用 AnyChart 的最快方法是将框架包含到网页中并编写一些代码。请看下面的这个简单的 HTML 代码段:

<!doctype html>
<body>
<div id="container" style="width: 500px; height: 400px;"></div>
<script src="https://cdn.anychart.com/releases/v8/js/anychart-base.min.js" type="text/javascript"></script>
<script>
    anychart.onDocumentReady(function() {
        // create a pie chart
        var chart = anychart.pie([
            ["Chocolate", 5],
            ["Rhubarb compote", 2],
            ["Crêpe Suzette", 2],
            ["American blueberry", 2],
            ["Buttermilk", 1]
        ]);
        chart.title("Top 5 pancake fillings");
        // set the container where chart will be drawn
        chart.container("container");
        // draw the chart on the page
        chart.draw();
    });
</script>
</body>
</html>
分步快速入门指南
  • AnyChart 快速入门
  • AnyStock 快速入门
  • AnyMap 快速入门
  • AnyGantt 快速入门

插件

AnyChart 为不同类型的技术提供了各种各样的插件,其中包括:

  • AngularJS v1.x 版本
  • AngularJS v2.x 版本
  • 反应
  • 男人
  • 流星
  • NodeJS 的
  • Qlik
  • jQuery 查询

将 AnyChart 与 TypeScript 结合使用

你可以在你的 TypeScript 项目中使用 AnyChart - 我们有我们的库的定义文件,你可以在分发文件夹中找到。 请查看 webpack 和 typescript 集成示例以获取更多详细信息。

将 AnyChart 与 ECMAScript 6 结合使用

您可以通过两种方式在 ECMAScript 6 项目中使用 AnyChart:

普通 ECMAScript 6

要在页面上添加 AnyChart,请使用 section with attribute。<script>type="module"

<script type="module">
    import '_localpath_to_anychart/anychart-bundle.min.js'
    
    // regular AnyChart code here
</script>

有关更多详细信息,请查看 AnyChart ES6 示例。

捆绑工具和模块加载器

您可以将 AnyChart 与任何捆绑工具或模块加载器一起使用,例如 WebPack、Browserify、Require.js 等。 有关更多详细信息,请查看 AnyChart Webpack 示例。

技术集成

AnyChart 可以在任何平台和任何数据库上运行。创建这些示例是为了演示 AnyChart 如何轻松集成到您的环境中。 所有示例均在 Apache 2.0 许可证下分发,并且可以根据您的应用程序进行自定义。如果您对此处未列出的特定集成感兴趣,请联系我们。

ASP.NET、C# 和 MySQLASP.NET、VB.NET 和 MySQLASP.NET、C#、SignalR 和 MySQL
Go、Revel 和 MySQLGo 和 MySQLJava Servlet、Maven、JDBC、JSP 和 MySQL
使用 socket.io 的 NodeJS 和 MongoDBJava Spring、Maven、Hibernate 和 MySQLJulia 和 MySQL
NodeJS Express、Jade 和 MongoDBPHP、Symfony 和 MySQLPHP、Laravel 和 MySQL
PHP、Slim 和 MySQLPerl、Catalyst Web 框架和 MySQLPython、Flask 和 MySQL
Python、Django 和 MySQLR、Shiny 和 MySQLRuby、Sinatra 和 MySQL
Ruby on Rails 和 MySQLScala、Akka 和 MySQLScala、Play 和 MySQL

贡献指南

要为 AnyChart 项目做出贡献,请:

  • Fork AnyChart 存储库。
  • 从分支创建分支。develop
  • 进行您想要贡献的任何更改。
  • 针对分支创建拉取请求。develop

GitHub 文档:分叉仓库。
GitHub 文档:使用拉取请求进行协作。

请注意:

  1. AnyChart 对第三方开发者编写的代码不承担任何责任,直到 pull request 被接受。
  2. 在接受 pull request 后,pull request 的作者将代码的所有权限签名给 AnyChart。

构建和调试

依赖

AnyChart 使用多个第三方库和工具来处理 JavaScript 和 CSS。

  • GraphicsJS - 高性能 SVG/VML 绘图库。
  • Google Closure Library - 强大的低级 JavaScript 库。
  • Google Closure Compiler - 将 JavaScript 代码编译为更好的 JavaScript。
  • lesscpy - Python LESS 编译器。用于编译和缩小 AnyChart UI css。
构建选项

build.pypython 脚本用于 AnyChart 项目。您需要安装 python 才能使用它。

要查看构建脚本的所有可用选项,请使用 或 command:-h--help

./build.py -h.

要查看命令选项,请使用:

./build.py <command_name> -h

要安装所有依赖项,请使用以下命令:deps

./build.py deps.

运行此命令后,您可以使用以下命令编译项目:compile

./build.py compile

这将编译 anychart-bundle 的生产版本和所有模块,并将它们放入文件夹中。您可以在我们的 Modules 文章中阅读有关模块的更多信息。out

要创建用于调试目的的开发版本,请使用 或 option:-d--develop

./build.py compile -d

该选项会生成属性重命名报告变量重命名报告源映射位置映射文件:-df

./build.py compile -df

源映射将缩小的代码映射到源代码。关于在 Chrome 中使用源映射或在 Firefox 中使用源映射的信息。

模块系统

AnyChart 从 v8.0.0 开始就被结构化为模块,所以你可以只使用你需要的。请查看我们的文章 模块 以开始使用模块。

包目录

├── css
│   ├── anychart.less
│   ...
├── dist
│   ├── json-schema.json
│   ├── xml-schema.xsd
│       ...
├── src
│   ├── charts
│   ├── core
│   ├── modules
│   ├── themes
│       ...
│   README.md
│   LICENSE
│   ...
CSS 服务

该文件夹包含编译为一个 .css 文件的 .less CSS 文件。css

来源

该文件夹包含根据项目结构组织的 AnyChart 源代码文件。例如:src

  • charts子文件夹包含图表类
  • core子文件夹包含核心类
  • modules子文件夹包含模块
  • themes包含主题
距离

该文件夹包含二进制文件和 JSON/XML 架构。dist

接触

  • 网站:www.anychart.com
  • 电子邮件: contact@anychart.com
  • 推特:anychart
  • 脸书:AnyCharts
  • LinkedIn:anychart

链接

  • AnyChart 网站
  • 下载 AnyChart
  • AnyChart 许可
  • AnyChart 支持
  • 报告问题
  • AnyChart 游乐场
  • AnyChart 文档
  • AnyChart API 参考
  • AnyChart 示例解决方案
  • AnyChart 集成

​编辑

许可证

© AnyChart.com - JavaScript 图表。保留所有权利。​编辑

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2125733.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

区块链学习笔记1--比特币

区块链是分布式数据存储、点对点传输、共识机制、加密算法等计算机技术的新型应用模式。 从狭义上来说&#xff1a;区块链是一种按照时间顺序将数据区块以顺序相连的方式组合成的一种链式数据结构&#xff0c;并以密码学的方式保证的不可篡改和不可伪造的分布式账本。 意思就是…

Zabbix自定义监控项与触发器

当我们需要获取某台主机上的数据时&#xff0c;直接利用 zabbix 提供的模板可以很方便的获得需要的数据,但是有些特别的数据&#xff0c;利用这些现有的模板或监控项是无法实现的&#xff0c;例如网站状态信息的监控、mysql数据库主从状态等信息。这是就需要自己定义键值和监控…

上门家政做饭系统小程序开发概览

上门做饭系统是一种融合了现代科技手段的创新餐饮服务模式&#xff0c;旨在为用户提供便捷且个性化的上门烹饪体验。通过互联网技术&#xff0c;这一系统连接了专业的私人厨师与有需求的家庭或个人&#xff0c;让高品质的餐饮服务更加触手可及。编辑&#xff1a;qawsed2466 核心…

【C++】优先级队列反向迭代器的实现

一、优先级队列&#xff1a; 优先级队列&#xff08;priority queue&#xff09;是一种容器适配器&#xff0c; 它默认使用vector作为其底层存储数据的容器&#xff0c;在vector上又使用了堆算法将vector中元素构造成堆的结构&#xff0c;因此priority_queue就是堆&#xff0c;…

Rust 助力无服务器构筑云计算新引擎

引言 今年 Amazon Lambda 迎来了它的第一个十周年。在过去的十年里&#xff0c;无服务器架构改变了软件开发的方式&#xff0c;简化了应用程序的部署和扩展&#xff0c;成为云计算的新引擎。而在众多支持无服务器技术的编程语言中&#xff0c;Rust 以其卓越的安全性和高性能成…

项目管理工作流是什么?项目管理工作流管理实战技巧!

项目管理工作流是指在协作过程中通过限制任务状态的流转进行流程控制的一种方式。项目从启动到完成所经历的一系列有序、可控的步骤和流程&#xff0c;它详细描述了项目执行过程中各项任务和活动的顺序、依赖关系、责任人以及完成标准等&#xff0c;是项目成功执行的重要保障。…

java设计模式 桥接模式

桥接模式&#xff08;Bridge Pattern&#xff09;是一种结构型设计模式&#xff0c;旨在将抽象部分与其实现部分分离&#xff0c;使它们都可以独立地变化。桥接模式通过将继承改为组合&#xff0c;实现了在不修改现有类的情况下&#xff0c;动态地切换和扩展抽象类与其具体实现…

Windows 平台安装 Nacos 2.x

环境准备 64 位操作系统&#xff0c;Windows 10 / Linux Centos 7JDK 1.8 安装包下载 安装包下载官方地址&#xff1a;https://github.com/alibaba/nacos/releases 启动 将安装包解压到安装的目录下&#xff0c;改名为 nacos-2.0.4。然后进行到 bin 目录下&#xff0c;打开…

数据集 Look into Person (LIP) 是最流行的单人人体语义分割 >> DataBall

开源数据集 Look into Person (LIP) 是最流行的单人人体语义分割 深度学习 Look into Person (LIP) 是最流行的单人人体分割数据集&#xff0c;它使用像素级注释进行注释&#xff0c;具有19个语义人体部分标签和一个背景标签。LIP包含50,462个带注释的图像&#xff0c;分为30,4…

CAN集线器(工业级、隔离式)

型号&#xff1a; MS-HUB-C 概述 MS-HUB 是一款可通过一路 CAN &#xff0c;一路 RS-232为主口扩展出 7 路 CAN 从口的工业级光电隔离型 CAN 分配器。可以有效的实现 CAN 网络的中继、扩展与隔离。采用先进的自动流控技术自动侦测CAN 信号流向。MS-HUB 具备光电隔离功能&#x…

UEFI学习笔记(二):edk2构建编译流程

UEFI入门&#xff08;二&#xff09;&#xff1a;edk2项目编译流程 一、Build流程框架Build的三个阶段&#xff1a;1、Autogen2、Make3、ImageGen 二、编译构建步骤&#xff1a;1. 安装依赖工具2. 初始化构建环境3. 配置工具链和目标4. 定义平台配置5. 构建并编译 三、uefi-too…

怎么通过Java实现和数据库的连接???(附带练习)

JDBC 今日目标 掌握JDBC的的CRUD理解JDBC中各个对象的作用掌握Druid的使用 1&#xff0c;JDBC概述 在开发中我们使用的是java语言&#xff0c;那么势必要通过java语言操作数据库中的数据。这就是接下来要学习的JDBC。 1.1 JDBC概念 JDBC 就是使用Java语言操作关系型数据库的…

STL-stack/queue/deque(容器适配器)

目录 ​编辑 STL-stack 150. 逆波兰表达式求值 stack queue std::stack deque 性能测试 结构 STL-stack 栈的压入、弹出序列_牛客题霸_牛客网输入两个整数序列&#xff0c;第一个序列表示栈的压入顺序&#xff0c;请判断第二个序列是否可能为该栈的弹出顺序。假。题目…

TESSY创建以及设计一个测试用例

我们以tessy5.1 IDE为例&#xff0c;给大家展示编写一个测试用例的过程。 还不会创建工程的&#xff0c;可以参考以下这篇文章&#xff1a; TESSY创建单元测试或集成测试工程_tessy 集成测试-CSDN博客 接下来我们以这个作为开始状态进行介绍 1、添加源文件 2、添加头文件路径…

存储型XSS漏洞

1.介绍 存储型XSS攻击是一种常见的网络攻击&#xff0c;也称为持久型XSS攻击。与反射型XSS攻击不同&#xff0c;存储型XSS攻击将恶意代码存储在服务器端或数据库中&#xff0c;当其他用户访问该网页时&#xff0c;恶意代码会被执行&#xff0c;导致用户的信息被窃取或造成其他…

Redis相关命令详解

目录 一、认识Redis 二、string 1、重要知识 2、基础命令 3、Key值的设置 三、list 1、重要知识 2、存储结构 3、基础命令 4、list的应用场景 四、hash 1、重要知识 2、基础命令 五、set 1、重要知识 2、基础命令 3、具体应用 六、zset 1、重要知识 2、…

“禁塑行动·我先行”广州绿葆网络发展有限公司与辽宁省慈善联合总会共谱环保新篇章

2024年9月9日&#xff0c;在国家大力推进生态文明建设、全面实施禁塑令政策的大背景下&#xff0c;农工同心公益基金“禁塑行动我先行”公益捐赠辽宁省启动仪式在辽宁省成功举办。此次活动由辽宁省慈善联合总会、农工党辽宁省委会主办&#xff0c;辽宁省慈善联合总会农工同心公…

MUR2060CT-ASEMI快恢复二极管MUR2060CT

编辑&#xff1a;ll MUR2060CT-ASEMI快恢复二极管MUR2060CT 型号&#xff1a;MUR2060CT 品牌&#xff1a;ASEMI 封装&#xff1a;TO-220AB 安装方式&#xff1a;插件 批号&#xff1a;最新 恢复时间&#xff1a;35ns 最大平均正向电流&#xff08;IF&#xff09;&#…

噪声的消除

开关电源的干扰一般是几十K到几百K&#xff1a; 【电源噪声查不出来&#xff1f;不用上板子&#xff0c;滤波器仿真就能搞定】https://www.bilibili.com/video/BV12v411r798?vd_source3cc3c07b09206097d0d8b0aefdf07958 村田消除噪声的仿真软件&#xff1a; SimSurfing - 村…

Kafka原理剖析之「Topic创建」

一、前言 Kafka提供了高性能的读写&#xff0c;而这些读写操作均是操作在Topic上的&#xff0c;Topic的创建就尤为关键&#xff0c;其中涉及分区分配策略、状态流转等&#xff0c;而Topic的新建语句非常简单 bash kafka-topics.sh \ --bootstrap-server localhost:9092 \ // …