提供完整的 Highcharts 资源包,包含实例文件、所有的 js 压缩版及源码、导出服务器文件等。

1、资源包的使用:

2、开放的CDN:http://img.hcharts.cn/

二、Highchart的安装:

1、使用npm的安装:

  npm相关文档:http://www.npmjs.com.cn/

npm install highcharts --save
  • 加载  Highcharts
    var Highcharts = require('highcharts');

    // 在 Highcharts 加载之后加载功能模块
    require('highcharts/modules/exporting')(Highcharts);     // 创建图表
    Highcharts.chart('container', {
      /*Highcharts 配置*/
    });
  • 加载 Highstock 或 Highmaps

   Highstock 是完全包含 Highcharts的,所以没必要将两个文件都引用;Highmaps 可以单独使用也可以通过地图模块来引用。

   var Highcharts = require('highcharts/highstock');

   // 加载 地图 模块

   require('highcharts/modules/map')(Highcharts);

   当然如果只需要 Highmaps 功能,那么只需要引用 highmaps.js 即可

   var Highcharts = require('highcharts/highmaps');

2、使用bower的安装:
bower install highcharts --save
bower相关文档:http://www.bowercn.com/
  • 加载 Highcharts

  <script src="/bower_components/highcharts/highcharts.js"></script>

  <script>

    // 创建图表

    Highcharts.Chart('container', {

    /*Highcharts 配置*/

  });

</script>

  • 加载功能模块

  在 Highcharts 的基础上增加模块功能,只需要引入相应的模块文件即可

 <script src="/bower_components/highcharts/modules/exporting.js"></script>
  • 加载 Highstock 或 Highmaps

  Highstock 是完全包含 Highcharts的,所以没必要将两个文件都引用;Highmaps 可以单独使用也可以通过地图模块来引用。

 <script src="/bower_components/highcharts/highstock.js"></script>
 <script src="/bower_components/highcharts/modules/map.js"></script>

  当然如果只需要 Highmaps 功能,那么只需要引用 highmaps.js 即可

 <script src="/bower_components/highcharts/highmaps.js"></script>

Highchart插件下载与安装的更多相关文章

  1. Chrome插件下载和安装方法

    http://jingyan.baidu.com/article/e4511cf35c2df92b845eafb3.html 扩展程序的下载方法   1 每个 Chrome 扩展程序 都有一个固定的 ...

  2. vue开发者工具vue-devtools-4.1.4_0.crx谷歌插件下载及安装

    网盘地址: https://pan.baidu.com/s/14PoaihUHQZEJtiHNWUmdjg 下载好后 谷歌浏览器中扩展程序,开启开发者模式,将下载的文件拖到窗口中即可 然后重启浏览器 ...

  3. ASM - ByteCode插件下载、安装以及相关遇到的问题

    http://asm.ow2.org/eclipse/index.html http://download.forge.objectweb.org/eclipse-update/ http://for ...

  4. Eclipse 插件 —— RunJettyRun 的下载、安装与使用

    关于 Jetty 与 Eclipse 的集成,网上很多都是使用 Eclipse 的一个自动安装功能 —— Software Update.个人不太喜欢这种方式.这种安装方式有点问题:第一,需要网络流畅 ...

  5. chrome 常用插件下载安装

    可在google的应用商店进行下载:chrome://apps/ 但大多时间无法链接. 国内插件下载地址: http://www.cnplugins.com http://chromecj.com/ ...

  6. 【XPath Helper:chrome爬虫网页解析工具 Chrome插件】XPath Helper:chrome爬虫网页解析工具 Chrome插件下载_教程_安装 - 开发者插件 - Chrome插件网

    [XPath Helper:chrome爬虫网页解析工具 Chrome插件]XPath Helper:chrome爬虫网页解析工具 Chrome插件下载_教程_安装 - 开发者插件 - Chrome插 ...

  7. [python]pycharm画图插件matplotlib、numpy、scipy的下载与安装

    最近在用pycharm学习python语言,不得不感叹python语言的强大与人性化! 但对于使用pycharm画图(较复杂的图)就要用到几个插件了,即matplotlib.numpy和scipy!但 ...

  8. JRebel 7.1.5 插件下载 安装 激活 结合 IntelliJ IDEA--自动编译进行热部署---

    Intellij IDEA 安装和配置jrebel进行项目的热部署 https://www.cnblogs.com/a8457013/p/7866625.html Intellij IDEA 使用jr ...

  9. Chrome插件安装的3种方法,解决拖放不能安装的情况,并提供插件下载

    本文摘录于Chrome插件网站 方法一:拖放安装 下载插件的crx文件后,打开Chrome的扩展页面(chrome://extensions/或按Chrome菜单图标>更多工具>扩展程序) ...

随机推荐

  1. Nginx学习笔记(二) Nginx--connection&request

    Nginx--connection&request 在Nginx中,主要包括了连接与处理两部分. connection 在src/core文件夹下包含有connection的源文件,Ngx_c ...

  2. jQuery选择器中,通配符[id^='code']input[id$='code'][id*='code']

     1.选择器 (1)通配符: $("input[id^='code']");//id属性以code开始的所有input标签 $("input[id$='code']&qu ...

  3. Error on line -1 of document : Premature end of file. Nested exception: Premature end of file.

    启动tomcat, 出现, ( 之前都是好好的... ) [lk ] ERROR [08-12 15:10:02] [main] org.springframework.web.context.Con ...

  4. 作为Coder的利器记载

    工作近三年,使用PC快六年,拥抱Mac整一年,投具器石榴裙三年.14年第一次被同事推荐Everything,开启了JeffJade对工具的折腾之旅,并乐此不疲.时去两年,这必然是消耗了一些时间,但对效 ...

  5. iOS---正确使用NSNotification对象

    我们在开发程序的时候,程序内不同对象间的通信是不可避免的,iOS中主要有以下这些通信方式: iOS中的通信方式 图中按照耦合度的强弱和通信的形式(一对一还是一对多)进行了划分,这篇文章我们主要说一下N ...

  6. Kafka 文档用例

    1.2 用例 以下是一些Kafka 常见的用例.关于功能方面的一些概念,可以看这篇博客:http://engineering.linkedin.com/distributed-systems/log- ...

  7. springMVC+ajax 文件上传 带进度条

    前端代码: <form id= "uploadForm"> <p >指定文件名: <input type="text" name= ...

  8. 支持高并发的IIS Web服务器常用设置

    适用的IIS版本:IIS 7.0, IIS 7.5, IIS 8.0 适用的Windows版本:Windows Server 2008, Windows Server 2008 R2, Windows ...

  9. 如何修复Windows 10 Enterprise 在9月更新后图片全部由绘图板打开的情况

    在进行了本月更新日的洗礼之后,企业版的Windows 10 突然发现无法好好的进行图片查看. 因为更新之前,各种图片都是使用“照片程序”打开的(这个是photos app),然后更新之后,这个app就 ...

  10. Oracle简单常用的数据泵导出导入(expdp/impdp)命令举例(上)

    <Oracle简单常用的数据泵导出导入(expdp/impdp)命令举例(上)> <Oracle简单常用的数据泵导出导入(expdp/impdp)命令举例(下)> 目的:指导项 ...