上官网:http://www.highcharts.com/ , http://www.hcharts.cn/ (中文版)例子、API都有原文:http://www.cnblogs.com/linguoguo/p/4181213.html
<!doctype html><html lang="en"><head><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script><script type="text/javascript" src="js/highcharts.js"></script><script type="text/javascript" src="js/exporting.js"></script><script>$(function () {$(‘#container‘).highcharts({chart:{type:‘column‘},xAxis: {categories: [‘Jan‘, ‘Feb‘, ‘Mar‘, ‘A...
配置如下:function init(categoryArray,seriesData,month_first_day,month_last_day,currDay){ var chart = Highcharts.chart(‘container‘, { chart: { type: ‘columnrange‘,// columnrange 依赖 highcharts-more.js inverted: false }, title: { // text: ‘持续时间统计‘ text: ‘‘ }, // subtitle: { // text: ‘Observe...
$.ajax({type:‘get‘,url:JsCore.SysPath + ‘finautil/GetReportProof.aspx‘,dataType: ‘json‘,success:function(data){if(data!=null){var chart = $(‘#container2‘).highcharts();var json = evalJson(data);var arr1= [];var arr2= [];$.each(json,function (key,value) {arr1.push(value.NodeName); arr2.push(value.WorkTime); });chart.xAxis[0].setCategories(arr1); chart.series[0].setData(arr2); }}}); 原文:h...
直接设置属性yAxis.allowDecimals为false即可例子链接如下:https://code.hcharts.cn/highcharts/hhhhnm 原文:http://www.cnblogs.com/YuanFan123/p/6721966.html
var chart = null;
$.getJSON(‘https://data.jianshukeji.com/jsonp?filename=json/usdeur.json&callback=?‘, function (data) {chart = Highcharts.chart(‘container‘, {chart: {zoomType: ‘x‘},title: {text: ‘美元兑欧元汇率走势图‘},subtitle: {text: document.ontouchstart === undefined ?‘鼠标拖动可以进行缩放‘ : ‘手势操作进行缩放‘},xAxis: { lineWidth :0,//去掉x轴线tickWidth:0,//去掉刻度 l...
在设计一个项目中的数据展示页面时。想要设计双X轴,一个轴显示须要的项。一个轴对这些项进行分组。效果如图:Highcharts自带双X轴展示方式。可是效果不是太理想。调整起来也会麻烦些看到Highcharts上有一个分组插件。grouped-categories.js。稍做改动就可以实现想要的效果,代码例如以下:$(function () {var chart = new Highcharts.Chart({chart: {renderTo: "container",type: "column"},title: {text: null},
plotOptions: {c...
Highcharts是非常不错的页面曲线图工具,官网在https://www.highcharts.com/download/问题就是如果工作环境是个封闭的内网,曲线图就无法正常导出,就需要搭建本地导出服务器。搭建方法如下:官网介绍:https://www.hcharts.cn/docs/setting-up-the-server 官方提供了两种方式 一种是npm安装 一种是git安装 这里提供第一种,第二种我自己都没有成功过。首先我们要找台能连接外网的独立服务器,先把环境包都装好。 1.安装nodejswget...
最近在做统计图的时候,碰到一个需求 类似如下:就是在红色虚线框内的折线在不同区域用不同的颜色表示,并且是虚线。开始定位为用highcharts库实现。确定用这个库后,开始在网上查资料,发现有类似的例子,网址是:http://code.hcharts.cn/hcharts.cn/hhhhco 1 $(function () {2 $(‘#container‘).highcharts({3 series: [{4 data: [-10, -5, 0, 5, 10, 15, 10, 10, 5, 0, -5],5 zones: [...
1、坐标点类package cn.test.domain;publicclass Point {double x;double y;public Point(){}public Point(double x, double y) {super();this.x = x;this.y = y;}publicdouble getX() {return x;}publicvoid setX(double x) {this.x = x;}publicdouble getY() {return y;}publicvoid setY(double y) {this.y = y;}
}2、拟合类,带计算部分package cn.test.normcdf;import java.io.IOException;
import java.text.NumberFormat;
im...
直接上代码【官方文档请参见http://www.highcharts.com/docs/working-with-data/getting-data-across-domains-jsonp】【实例http://highcharts-mzm.rhcloud.com/】1、index.html<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>Highcharts Example</title><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></scrip...
HighCharts之2D回归直线的散点1、实例源码ScatterLine.html:<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>HighCharts 2D回归直线的散点</title>
<script type="text/javascript" src="../scripts/jquery-1.11.0.js"></script>
<script type="text/javascript" src="../scripts/js/highcharts.js"></script>
<script type="text/javascript">$(function(){$(‘#scatterLine‘).highcharts({chart: {},xAxis: { /...
在设计一个项目中的数据展示页面时,想要设计双X轴,一个轴显示需要的项,一个轴对这些项进行分组,效果如图:Highcharts自带双X轴展示方式,但是效果不是太理想,调整起来也会麻烦些看到Highcharts上有一个分组插件,grouped-categories.js,稍做修改即可实现想要的效果,代码如下:$(function () {var chart = new Highcharts.Chart({chart: {renderTo: "container",type: "column"},title: {text: null},
plotOptions: {column:...
Highcharts的数据表示(1)
在Highcharts中,将关联的一系列的数据称为数据列。而构成数据的每一个数据单元称为数据节点。下面详细讲解数据列和数据节点的表示方式。数据列就是相关联的一系列数据的集合。例如,第一个实例所呈现的数据就是由七个温度数据构成的集合。他们的关联关系是构成连续的一周温度。在Highcharts中,数据列使用series表示。一个图表中,可以有一个或者多个数据列。所以,series的值是一个数组。形式如下:seri...
1、首先新建一个.NET网站,如图所示: 2、引用所需要的js类库,如下图 highcharts.js可以在网上搜索就可以找到下载了。3、在Default.aspx页面引用js4、在 body 下添加一个<div id="container" style="width: 98%; height: 500px; margin: 0 auto"> , 前台代码如下 1<script type="text/javascript"> 2 $(function() {3var line1 =<%=manTotal%>; 4var data = [<%=percentageStr%>];5 $(‘#container‘).highcharts({6 ...