android highcharts柱状图实例,Highcharts 基本柱形图

Highcharts 基本柱形图

以下实例演示了基本柱形图。

我们在前面的章节已经了解了 Highcharts 基本配置语法。接下来让我们来看下其他的配置。

配置

chart 配置

设置 chart 的 type 属性为 column ，chart.type 描述了图表类型。默认值为 "line"。

var chart = {

type: 'column'

};

实例

文件名：highcharts_column_basic.htm

Highcharts 教程 | 菜鸟教程(runoob.com)

$(document).ready(function() {

var chart = {

type: 'column'

};

var title = {

text: '每月平均降雨量'

};

var subtitle = {

text: 'Source: runoob.com'

};

var xAxis = {

categories: ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'],

crosshair: true

};

var yAxis = {

min: 0,

title: {

text: '降雨量 (mm)'

}

};

var tooltip = {

headerFormat: '{point.key}

pointFormat: '

{series.name}: ' +

{point.y:.1f} mm',

footerFormat: '

shared: true,

useHTML: true

};

var plotOptions = {

column: {

pointPadding: 0.2,

borderWidth: 0

}

};

var credits = {

enabled: false

};

var series= [{

data: [49.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]

}, {

data: [83.6, 78.8, 98.5, 93.4, 106.0, 84.5, 105.0, 104.3, 91.2, 83.5, 106.6, 92.3]

}, {

data: [48.9, 38.8, 39.3, 41.4, 47.0, 48.3, 59.0, 59.6, 52.4, 65.2, 59.3, 51.2]

}, {

data: [42.4, 33.2, 34.5, 39.7, 52.6, 75.5, 57.4, 60.4, 47.6, 39.1, 46.8, 51.1]

}];

var json = {};

json.chart = chart;

json.title = title;

json.subtitle = subtitle;

json.tooltip = tooltip;

json.xAxis = xAxis;

json.yAxis = yAxis;

json.series = series;

json.plotOptions = plotOptions;

json.credits = credits;

$('#container').highcharts(json);

});

以上实例输出结果为：

android highcharts柱状图实例,Highcharts 基本柱形图相关推荐

java - (highCharts)柱状图生成及美化
柱状图生成及美化一.基本柱状图 1.效果示例 2.java代码实现 2.1 柱状图封装类 2.2 调用类 2.3 基础数据类二.柱状图的3D效果设置 1.效果示例 2.代码实现三.堆叠柱状图 1 ...
技术实践 | Android Flutter 多实例实践
导读:Flutter CLI 工具支持将 Flutter Module 打包成 Android AAR 包以供外部依赖使用,即 Flutter AAR.在一个没有使用 Flutter 技术栈的 And ...
Highcharts JS去除Highcharts.com链接的方法
1.Highcharts JS去除Highcharts.com链接的方法在js文件中找到Credits,然后把enable的属性从!0改为0. 也可以更改为自己需要的: enabled:设置是否显示 ...
Android JNI简单实例（android 调用C/C++代码）
转载自 xiechengfa 最终编辑 xiechengfa Android JNI简单实例关键字: android.jni Android的jni实例 android 的应用程序(Dalvik VM ...
OpenCV android sdk配置OpenCV android NDK开发实例
OpenCV android sdk配置OpenCV android NDK开发实例 [尊重原创,转载请注明出处]http://blog.csdn.net/guyuealian/article/det ...
android 滑动拦截,Android 滑动拦截实例代码解析
废话不多说了,直接给大家贴代码了,具体代码如下所示: package demo.hq.com.fby; import android.content.Context; import android.u ...
Android串口通信实例分析【附源码】
Android 串口通信实例分析,用的时开源的android-serialport-api 这个是用android ndk实现的串口通信,我把他做了一个简化,适合于一般的程序的串口通信移植,欢迎拍砖- ...
android远程linux命令,测试可用的Android远程语音识别实例
测试可用的Android远程语音识别实例: 代码下载在: 相关文件下载在Linux公社的1号FTP服务器里,下载地址: 用户名:www.linuxidc.com 密码:www.muu.cc 在 201 ...
Android Hello World 实例【TODO】
Table of Contents Android Hello World 实例创建 Android 应用 Android应用程序剖析主要活动文件 Manifest文件 Strings 文件 R ...
python柱状图代码_python+matplotlib实现礼盒柱状图实例代码
演示结果: 完整代码: import matplotlib.pyplot as plt import numpy as np from matplotlib.image import BboxImag ...

android highcharts柱状图实例,Highcharts 基本柱形图

android highcharts柱状图实例,Highcharts 基本柱形图相关推荐

最新文章

热门文章