highcharts作图

最新推荐文章于 2023-03-13 19:13:44 发布

VIP文章一天进步一点点

最新推荐文章于 2023-03-13 19:13:44 发布

阅读量2.3k

点赞数

分类专栏： js学习文章标签： js

本文链接：https://blog.csdn.net/mmchinamm/article/details/47043279

版权

若要在web中作图，highcharts可以方便的帮助我们解决这个问题。
1、引用

<script src="jquery-1.7.1.min.js"></script>
<script src="highcharts.js"></script>

这两个src引入的顺序一定要正确，否则页面可能不显示。

2、解释

<html>
<head>
<script type="text/javascript"> 
jQuery(function() {
       
    Highcharts.Chart({   
        chart: {   
            renderTo: 'highchartsdiv', //‘highchartsdiv’为放置图标的id   
            defaultSeriesType: 'spline', //图标类型，line（折线，默认），column（圆柱），spline(圆润的折线)， area, areaspline, bar, pie , scatter
            zoomType: 'x'   //x轴方向可以缩放   
        },   
        credits: {   
            enabled: false   //右下角不显示LOGO   
        },   
        title: {   
            text: '一楼湿度历史记录' //图表标题   
        },   
        subtitle: {   
            text: '2012年'  //副标题   
        },   
        xAxis: {  //x轴   
            categories: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月',   
 '11月', '12月'], //x轴标签名称   
            gridLineWidth: 1, //设置网格宽度为1   
            lineWidth: 2,  //基线宽度   
            labels:{y:26}  //x轴标签位置：距X轴下方26像素   
        },   
        yAxis: {