Highcharts教程--把js代码从html中抽离出来,放到单独的一个js文件中。由html页面调用...
生活随笔
收集整理的這篇文章主要介紹了
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 配置 });?
轉載于:https://www.cnblogs.com/sanduzxcvbnm/p/10410884.html
總結
以上是生活随笔為你收集整理的Highcharts教程--把js代码从html中抽离出来,放到单独的一个js文件中。由html页面调用...的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 一体水冷电脑cpu风扇(一体式cpu水冷
- 下一篇: wps超级会员取消订阅(退订WPS会员)