Highcharts教程--把js代码从html中抽离出来，放到单独的一个js文件中。由html页面调用
1.html页面写法
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>第一个 Highcharts 图表</title>
<!-- 引入 jquery.js -->
<script src="static/jquery-3.3.1.min.js"></script>
<!-- 引入 highcharts.js -->
<script src="static/highcharts-7.0.3.js"></script></head>
<body> <!-- 图表容器 DOM -->
<div id="container" style="min-width:400px;height:400px"></div> <script src="static/a.js"></script> </body>
</html>
2.a.js文件
$(document).ready(function () {
$('#container').highcharts({
chart: {
type: 'spline',
inverted: true
},
title: {
text: '大气温度和海拔高度关系'
},
subtitle: {
text: '根据标准大气模型绘制'
},
xAxis: {
reversed: false,
title: {
enabled: true,
text: '海拔高度'
},
labels: {
formatter: function () {
return this.value + 'km';
}
},
maxPadding: 0.05,
showLastLabel: true
},
yAxis: {
title: {
text: '温度'
},
labels: {
formatter: function () {
return this.value + '°';
}
},
lineWidth: 2
},
legend: {
enabled: false
},
tooltip: {
headerFormat: '<b>{series.name}</b><br/>',
pointFormat: '{point.x} km: {point.y}°C'
},
plotOptions: {
spline: {
marker: {
enable: false
}
}
},
series: [{
name: '温度',
data: [[0, 15], [10, -50], [20, -56.5], [30, -46.5], [40, -22.1],
[50, -2.5], [60, -27.7], [70, -55.7], [80, -76.5]]
}]
});
});
注意js文件的写法：
$(document).ready(function () {
$('#container').highcharts({
// Highcharts 配置
});
});
或者其简写形式：
$(function () {
$('#container').highcharts({
// Highcharts 配置
});
Highcharts教程--把js代码从html中抽离出来，放到单独的一个js文件中。由html页面调用的更多相关文章
- 在C的头文件中定义的结构体，如何在cpp文件中引用
解决方案1:在cpp文件中放置.c,且在该文件中引用变量 解决方案2:在一个cpp文件中包含.c,但在另一个cpp文件中使用结构体变量 cpp文件1 cpp文件2 #include "dia ...
- 如何调用另一个python文件中的代码
模块的搜索路径 模块的搜索路径都放在了sys.path列表中,如果缺省的sys.path中没有含有自己的模块或包的路径,可以动态的加入(sys.path.apend)即可.下面是sys.path在Wi ...
- js代码突然在花括号回车自动多加了一个大括号
js代码突然在花括号回车自动多加了一个大括号. 检查发现,前面有一个行带有左括号的注释行.
- HTML 5 应用程序缓存（Application Cache）cache manifest 文件使用 html5 中创建manifest缓存以及更新方法 一个manifest文件会创建一份缓存，不同的manifest文件其缓存的内容是互不干扰的
HTML5 离线缓存-manifest简介 HTML 5 应用程序缓存 使用 HTML5,通过创建 cache manifest 文件,可以轻松地创建 web 应用的离线版本. 什么是应用程序缓存(A ...
- 《Java虚拟机原理图解》1.5、 class文件中的方法表集合--method方法在class文件中是怎样组织的
0. 前言 了解JVM虚拟机原理是每一个Java程序员修炼的必经之路.但是由于JVM虚拟机中有很多的东西讲述的比较宽泛,在当前接触到的关于JVM虚拟机原理的教程或者博客中,绝大部分都是充斥的文字性的描 ...
- 《Java虚拟机原理图解》1.4 class文件中的字段表集合--field字段在class文件中是怎样组织的
0.前言 了解JVM虚拟机原理是每一个Java程序员修炼的必经之路.但是由于JVM虚拟机中有很多的东西讲述的比较宽泛,在当前接触到的关于JVM虚拟机原理的教程或者博客中,绝大部分都是充斥的文字性的描述 ...
- 怎样将多个CSS文件导入一个CSS文件中
问题: 在HTML中引入css的其中的两个方法: 导入式和链接式的目的都是将一个独立的css文件引入一个文件中,二者的区别不大,事实上,二者最大的区别在于链接式使用html的标记引入外部css文 ...
- 多个.txt文件合并到一个.txt文件中
如果想要将多个.txt文件合并到一个.txt文件中,可以先将所有.txt文件放到一个文件夹中,然后使用.bat文件完成任务. 例如,在一个文件夹下有1.txt, 2.txt, 3.txt三个文件,想把 ...
- shell如何传递变量到另一个脚本文件中
http://www.jbxue.com/article/shell/20707.html本文介绍了shell脚本传递变量到另一个脚本文件中的方法,在脚本中调用另一脚本,即创建了一个子进程,感兴趣的朋 ...
随机推荐
- LeetCode 451. Sort Characters By Frequency （根据字符出现频率排序）
Given a string, sort it in decreasing order based on the frequency of characters. Example 1: Input: ...
- Ubuntu13.10添加/删除PPA
什么是ppa ppa即Personal Package Archive(个人安装包文档),简单来说就是一些个人或者团体通过独立的网站发布的第三方的软件源.将这些软件源添加到你的电脑上后,你就可以像使用 ...
- cocos2d-x 执行在 genymotion上面
1.jni/Application.mk加入红色圆圈内的參数 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQveWl6aXhpYW5zaGVuZw==/fon ...
- 【Unity】用Shader编程实现3D红心
有些形状,即使没有3D美术设计师提供模型,也能够用代码生成. 对于想保持原创性不想借用他人模型的独立开发人员来说,这无非是一个非常重要的途径. 今天献给大家的是用Shader编程实现的一颗红心,寄托下 ...
- postgis经常使用函数介绍（一）
概述: 在进行地理信息系统开发的过程中,经常使用的空间数据库有esri的sde,postgres的postgis以及mySQL的mysql gis等等,在本文.给大家介绍的是有关postgis的一些经 ...
- The source was not found, but some or all event logs could not be searched. Inaccessible logs: Security.
EventLog.SourceExists https://stackoverflow.com/questions/9564420/the-source-was-not-found-but-some- ...
- 题目收藏夹(啥时候一遍A啥时候删)
以下题目为没有思路或代码离谱错误或看了题解才会的,间隔一周以上再做一遍A掉就删. bzoj1500 bzoj2287 codevs1358 bzoj1725
- [Apple开发者帐户帮助]九、参考（4）支持的功能（macOS）
macOS应用程序可用的功能取决于您的程序成员身份和签名证书. 能力 ADP 开发者ID Apple开发者 应用程序组 App沙盒 游戏中心 硬化运行时 iCloud:CloudKit i ...
- Java 中数组的遍历方式
数组对于每一门编程语言来说都是重要的数据结构之一,当然不同语言对数组的实现及处理也不尽相同. Java 语言中提供的数组是用来存储固定大小的同类型元素. 今天我们就来说一下在java中遍历数组都有哪几 ...
- 【BZOJ3960】DZY Loves Math V（数论）
题目: BZOJ3560 分析: orz跳瓜. 欧拉函数的公式: \[\phi(n)=n(\prod \frac{p_i-1}{p_i})\] 其中 \(p_i\) 取遍 \(n\) 的所有质因子. ...