mirror of
https://github.com/tursom/typecho-plugin-Access.git
synced 2025-01-16 07:10:06 +08:00
first commit
This commit is contained in:
空樱酱
commit
4f6e0ad16c
455
Access.php
Normal file
455
Access.php
Normal file
@ -0,0 +1,455 @@
|
||||
<?php
|
||||
class Access_Extend
|
||||
{
|
||||
protected $db;
|
||||
protected $prefix;
|
||||
protected $table;
|
||||
protected $config;
|
||||
protected $request;
|
||||
protected $pageSize;
|
||||
protected $isDrop;
|
||||
private static $_instance = null;
|
||||
public $action;
|
||||
public $title;
|
||||
public $logs = array();
|
||||
public $overview = array();
|
||||
|
||||
public function __construct()
|
||||
{
|
||||
$this->db = Typecho_Db::get();
|
||||
$this->prefix = $this->db->getPrefix();
|
||||
$this->table = $this->prefix . 'access';
|
||||
$this->config = Typecho_Widget::widget('Widget_Options')->plugin('Access');
|
||||
$this->request = Typecho_Request::getInstance();
|
||||
$this->pageSize = $this->config->pageSize;
|
||||
$this->isDrop = $this->config->isDrop;
|
||||
if ($this->pageSize == null || $this->isDrop == null) {
|
||||
throw new Typecho_Plugin_Exception('请先设置插件！');
|
||||
}
|
||||
switch ($this->request->get('action')) {
|
||||
case 'logs':
|
||||
default:
|
||||
$this->action = 'logs';
|
||||
$this->title = '访问日志';
|
||||
$this->parseLogs();
|
||||
break;
|
||||
case 'overview':
|
||||
$this->action = 'overview';
|
||||
$this->title = '访问概览';
|
||||
$this->parseOverview();
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
public $spiderArray = array(
|
||||
"TencentTraveler",
|
||||
"Baiduspider",
|
||||
"BaiduGame",
|
||||
"Googlebot",
|
||||
"msnbot",
|
||||
"Sosospider+",
|
||||
"Sogou web spider",
|
||||
"ia_archiver",
|
||||
"Yahoo! Slurp",
|
||||
"YoudaoBot",
|
||||
"Yahoo Slurp",
|
||||
"MSNBot",
|
||||
"Java (Often spam bot)",
|
||||
"BaiDuSpider",
|
||||
"Voila",
|
||||
"Yandex bot",
|
||||
"BSpider",
|
||||
"twiceler",
|
||||
"Sogou Spider",
|
||||
"Speedy Spider",
|
||||
"Google AdSense",
|
||||
"Heritrix",
|
||||
"Python-urllib",
|
||||
"Alexa (IA Archiver)",
|
||||
"Ask",
|
||||
"Exabot",
|
||||
"Custo",
|
||||
"OutfoxBot/YodaoBot",
|
||||
"yacy",
|
||||
"SurveyBot",
|
||||
"legs",
|
||||
"lwp-trivial",
|
||||
"Nutch",
|
||||
"StackRambler",
|
||||
"The web archive (IA Archiver)",
|
||||
"Perl tool",
|
||||
"MJ12bot",
|
||||
"Netcraft",
|
||||
"MSIECrawler",
|
||||
"WGet tools",
|
||||
"larbin",
|
||||
"Fish search",
|
||||
"crawler",
|
||||
"bingbot",
|
||||
);
|
||||
|
||||
public static function getInstance()
|
||||
{
|
||||
if (!(self::$_instance instanceof self)) {
|
||||
self::$_instance = new self();
|
||||
}
|
||||
return self::$_instance;
|
||||
}
|
||||
|
||||
public function parseUA($ua)
|
||||
{
|
||||
$os = null;
|
||||
if ($this->isSpider($ua)) {
|
||||
$os = '爬虫';
|
||||
} elseif (preg_match('/Windows NT 6.0/i', $ua)) {
|
||||
$os = "Windows Vista";
|
||||
} elseif (preg_match('/Windows NT 6.1/i', $ua)) {
|
||||
$os = "Windows 7";
|
||||
} elseif (preg_match('/Windows NT 6.2/i', $ua)) {
|
||||
$os = "Windows 8";
|
||||
} elseif (preg_match('/Windows NT 6.3/i', $ua)) {
|
||||
$os = "Windows 8.1";
|
||||
} elseif (preg_match('/Windows NT 10.0/i', $ua)) {
|
||||
$os = "Windows 10";
|
||||
} elseif (preg_match('/Windows NT 5.1/i', $ua)) {
|
||||
$os = "Windows XP";
|
||||
} elseif (preg_match('/Windows NT 5.2/i', $ua) && preg_match('/Win64/i', $ua)) {
|
||||
$os = "Windows XP 64 bit";
|
||||
} elseif (preg_match('/Android ([0-9.]+)/i', $ua, $matches)) {
|
||||
$os = "Android " . $matches[1];
|
||||
} elseif (preg_match('/iPhone OS ([_0-9]+)/i', $ua, $matches)) {
|
||||
$os = 'iPhone ' . $matches[1];
|
||||
} elseif (preg_match('/Ubuntu/i', $ua, $matches)) {
|
||||
$os = 'Ubuntu ';
|
||||
} elseif (preg_match('/Mac OS X ([0-9_]+)/i', $ua, $matches)) {
|
||||
$os = 'Mac OS ' . $matches[1];
|
||||
} elseif (preg_match('/Linux/i', $ua, $matches)) {
|
||||
$os = 'Linux';
|
||||
} else {
|
||||
$os = '未知';
|
||||
}
|
||||
|
||||
if ($this->isSpider($ua)) {
|
||||
$browser = '爬虫';
|
||||
} elseif (preg_match('#(Camino|Chimera)[ /]([a-zA-Z0-9.]+)#i', $ua, $matches)) {
|
||||
$browser = 'Camino ' . $matches[2];
|
||||
} elseif (preg_match('#SE 2([a-zA-Z0-9.]+)#i', $ua, $matches)) {
|
||||
$browser = '搜狗浏览器 2' . $matches[1];
|
||||
} elseif (preg_match('#360([a-zA-Z0-9.]+)#i', $ua, $matches)) {
|
||||
$browser = '360浏览器 ' . $matches[1];
|
||||
} elseif (preg_match('#Maxthon( |\/)([a-zA-Z0-9.]+)#i', $ua, $matches)) {
|
||||
$browser = 'Maxthon ' . $matches[2];
|
||||
} elseif (preg_match('#Chrome/([a-zA-Z0-9.]+)#i', $ua, $matches)) {
|
||||
$browser = 'Chrome ' . $matches[1];
|
||||
} elseif (preg_match('#XiaoMi/MiuiBrowser/([0-9.]+)#i', $ua, $matches)) {
|
||||
$browser = '小米浏览器 ' . $matches[1];
|
||||
} elseif (preg_match('#Safari/([a-zA-Z0-9.]+)#i', $ua, $matches)) {
|
||||
$browser = 'Safari ' . $matches[1];
|
||||
} elseif (preg_match('#opera mini#i', $ua)) {
|
||||
preg_match('#Opera/([a-zA-Z0-9.]+)#i', $ua, $matches);
|
||||
$browser = 'Opera Mini ' . $matches[1];
|
||||
} elseif (preg_match('#Opera.([a-zA-Z0-9.]+)#i', $ua, $matches)) {
|
||||
$browser = 'Opera ' . $matches[1];
|
||||
} elseif (preg_match('#TencentTraveler ([a-zA-Z0-9.]+)#i', $ua, $matches)) {
|
||||
$browser = '腾讯TT浏览器 ' . $matches[1];
|
||||
} elseif (preg_match('#UCWEB([a-zA-Z0-9.]+)#i', $ua, $matches)) {
|
||||
$browser = 'UCWEB ' . $matches[1];
|
||||
} elseif (preg_match('#MSIE ([a-zA-Z0-9.]+)#i', $ua, $matches)) {
|
||||
$browser = 'Internet Explorer ' . $matches[1];
|
||||
} elseif (preg_match('#Trident#', $ua, $matches)) {
|
||||
$browser = 'Internet Explorer 11';
|
||||
} elseif (preg_match('#Edge/12.0#i', $ua, $matches)) {
|
||||
//win10中spartan浏览器
|
||||
$browser = 'Spartan';
|
||||
} elseif (preg_match('#(Firefox|Phoenix|Firebird|BonEcho|GranParadiso|Minefield|Iceweasel)/([a-zA-Z0-9.]+)#i', $ua, $matches)) {
|
||||
$browser = 'Firefox ' . $matches[2];
|
||||
} else {
|
||||
$browser = '未知';
|
||||
}
|
||||
return $os . " | " . $browser;
|
||||
}
|
||||
|
||||
public function isSpider($ua)
|
||||
{
|
||||
$ua = strtolower($ua);
|
||||
if (!empty($ua)) {
|
||||
foreach ($this->spiderArray as $val) {
|
||||
$str = strtolower($val);
|
||||
if (strpos($ua, $str) !== false) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
protected function getWhere($type)
|
||||
{
|
||||
$where_str = '';
|
||||
foreach ($this->spiderArray as $value) {
|
||||
$where_str .= "ua {1} LIKE " . "'%{$value}%' {2} ";
|
||||
}
|
||||
$where_str = rtrim($where_str, '{2} ');
|
||||
switch ($type) {
|
||||
case 1:
|
||||
$where = str_replace('{1}', 'NOT', $where_str);
|
||||
$where = str_replace('{2}', 'and', $where);
|
||||
break;
|
||||
case 2:
|
||||
$where = str_replace('{1}', '', $where_str);
|
||||
$where = str_replace('{2}', 'or', $where);
|
||||
break;
|
||||
case 3:
|
||||
$where = '1=1';
|
||||
break;
|
||||
default:
|
||||
throw new Typecho_Plugin_Exception('参数不正确！');
|
||||
}
|
||||
return 'WHERE ' . $where;
|
||||
}
|
||||
|
||||
protected function parseLogs()
|
||||
{
|
||||
$type = $this->request->get('type', 1);
|
||||
$p = $this->request->get('page', 1);
|
||||
$offset = (max(intval($p), 1) - 1) * $this->pageSize;
|
||||
$where = $this->getWhere($type);
|
||||
|
||||
$this->logs['list'] = $this->db->fetchAll("SELECT * FROM {$this->table} {$where} ORDER BY id DESC LIMIT {$this->pageSize} OFFSET {$offset}");
|
||||
|
||||
$this->logs['rows'] = count($this->db->fetchAll("SELECT * FROM {$this->table} {$where}"));
|
||||
include_once dirname(__FILE__) . '/lib/Page.php';
|
||||
$pager = new Page($this->pageSize, $this->logs['rows'], $p, 10);
|
||||
$this->logs['page'] = $pager->show();
|
||||
}
|
||||
|
||||
protected function parseOverview()
|
||||
{
|
||||
//$where = $this->getWhere(1);
|
||||
|
||||
$where = 'WHERE 1=1';
|
||||
|
||||
$this->overview['ip']['today']['total'] = 0;
|
||||
$this->overview['uv']['today']['total'] = 0;
|
||||
$this->overview['pv']['today']['total'] = 0;
|
||||
$this->overview['ip']['yesterday']['total'] = 0;
|
||||
$this->overview['uv']['yesterday']['total'] = 0;
|
||||
$this->overview['pv']['yesterday']['total'] = 0;
|
||||
|
||||
for ($i = 0; $i < 24; $i++) {
|
||||
$today = date("Y-m-d");
|
||||
$start = strtotime(date("{$today} {$i}:00:00"));
|
||||
$end = strtotime(date("{$today} {$i}:59:59"));
|
||||
$this->overview['ip']['today']['hours'][] = count($this->db->fetchAll("SELECT DISTINCT ip FROM {$this->table} {$where} AND date BETWEEN {$start} AND {$end}"));
|
||||
$this->overview['ip']['today']['total'] += $this->overview['ip']['today']['hours'][$i];
|
||||
$this->overview['uv']['today']['hours'][] = count($this->db->fetchAll("SELECT DISTINCT ip,ua FROM {$this->table} {$where} AND date BETWEEN {$start} AND {$end}"));
|
||||
$this->overview['uv']['today']['total'] += $this->overview['uv']['today']['hours'][$i];
|
||||
$this->overview['pv']['today']['hours'][] = count($this->db->fetchAll("SELECT ip FROM {$this->table} {$where} AND date BETWEEN {$start} AND {$end}"));
|
||||
$this->overview['pv']['today']['total'] += $this->overview['pv']['today']['hours'][$i];
|
||||
}
|
||||
|
||||
for ($i = 0; $i < 24; $i++) {
|
||||
$yesterday = date("Y-m-d", time() - 24 * 60 * 60);
|
||||
$start = strtotime(date("{$yesterday} {$i}:00:00"));
|
||||
$end = strtotime(date("{$yesterday} {$i}:59:59"));
|
||||
$this->overview['ip']['yesterday']['hours'][] = count($this->db->fetchAll("SELECT DISTINCT ip FROM {$this->table} {$where} AND date BETWEEN {$start} AND {$end}"));
|
||||
$this->overview['ip']['yesterday']['total'] += $this->overview['ip']['yesterday']['hours'][$i];
|
||||
$this->overview['uv']['yesterday']['hours'][] = count($this->db->fetchAll("SELECT DISTINCT ip,ua FROM {$this->table} {$where} AND date BETWEEN {$start} AND {$end}"));
|
||||
$this->overview['uv']['yesterday']['total'] += $this->overview['uv']['yesterday']['hours'][$i];
|
||||
$this->overview['pv']['yesterday']['hours'][] = count($this->db->fetchAll("SELECT ip FROM {$this->table} {$where} AND date BETWEEN {$start} AND {$end}"));
|
||||
$this->overview['pv']['yesterday']['total'] += $this->overview['pv']['yesterday']['hours'][$i];
|
||||
}
|
||||
|
||||
$this->overview['ip']['all']['total'] = count($this->db->fetchAll("SELECT DISTINCT ip FROM {$this->table} {$where}"));
|
||||
$this->overview['uv']['all']['total'] = count($this->db->fetchAll("SELECT DISTINCT ip,ua FROM {$this->table} {$where}"));
|
||||
$this->overview['pv']['all']['total'] = count($this->db->fetchAll("SELECT ip FROM {$this->table} {$where}"));
|
||||
|
||||
$this->overview['chart']['title']['text'] = date("Y-m-d 统计");
|
||||
$this->overview['chart']['xAxis']['categories'] = $this->buildObject(array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23), true);
|
||||
$this->overview['chart']['series']['pv'] = $this->buildObject($this->overview['pv']['today']['hours'], false);
|
||||
$this->overview['chart']['series']['uv'] = $this->buildObject($this->overview['uv']['today']['hours'], false);
|
||||
$this->overview['chart']['series']['ip'] = $this->buildObject($this->overview['ip']['today']['hours'], false);
|
||||
|
||||
}
|
||||
|
||||
protected function buildObject($array, $quote)
|
||||
{
|
||||
$obj = json_encode($array);
|
||||
$obj = str_replace("\"", "'", $obj);
|
||||
if ($quote) {
|
||||
return $obj;
|
||||
} else {
|
||||
return str_replace("'", '', $obj);
|
||||
}
|
||||
}
|
||||
|
||||
public function getAddress($ip)
|
||||
{
|
||||
if (!filter_var($ip, FILTER_VALIDATE_IP)) {
|
||||
return 'Invalid IP address';
|
||||
}
|
||||
|
||||
$ipdatafile = dirname(__FILE__) . '/lib/qqwry.dat';
|
||||
if (!$fd = @fopen($ipdatafile, 'rb')) {
|
||||
return 'Invalid IP data file';
|
||||
}
|
||||
|
||||
$ip = explode('.', $ip);
|
||||
$ipNum = $ip[0] * 16777216 + $ip[1] * 65536 + $ip[2] * 256 + $ip[3];
|
||||
|
||||
if (!($DataBegin = fread($fd, 4)) || !($DataEnd = fread($fd, 4))) {
|
||||
return;
|
||||
}
|
||||
|
||||
@$ipbegin = implode('', unpack('L', $DataBegin));
|
||||
if ($ipbegin < 0) {
|
||||
$ipbegin += pow(2, 32);
|
||||
}
|
||||
|
||||
@$ipend = implode('', unpack('L', $DataEnd));
|
||||
if ($ipend < 0) {
|
||||
$ipend += pow(2, 32);
|
||||
}
|
||||
|
||||
$ipAllNum = ($ipend - $ipbegin) / 7 + 1;
|
||||
|
||||
$BeginNum = $ip2num = $ip1num = 0;
|
||||
$ipAddr1 = $ipAddr2 = '';
|
||||
$EndNum = $ipAllNum;
|
||||
|
||||
while ($ip1num > $ipNum || $ip2num < $ipNum) {
|
||||
$Middle = intval(($EndNum + $BeginNum) / 2);
|
||||
|
||||
fseek($fd, $ipbegin + 7 * $Middle);
|
||||
$ipData1 = fread($fd, 4);
|
||||
if (strlen($ipData1) < 4) {
|
||||
fclose($fd);
|
||||
return 'System Error';
|
||||
}
|
||||
$ip1num = implode('', unpack('L', $ipData1));
|
||||
if ($ip1num < 0) {
|
||||
$ip1num += pow(2, 32);
|
||||
}
|
||||
|
||||
if ($ip1num > $ipNum) {
|
||||
$EndNum = $Middle;
|
||||
continue;
|
||||
}
|
||||
|
||||
$DataSeek = fread($fd, 3);
|
||||
if (strlen($DataSeek) < 3) {
|
||||
fclose($fd);
|
||||
return 'System Error';
|
||||
}
|
||||
$DataSeek = implode('', unpack('L', $DataSeek . chr(0)));
|
||||
fseek($fd, $DataSeek);
|
||||
$ipData2 = fread($fd, 4);
|
||||
if (strlen($ipData2) < 4) {
|
||||
fclose($fd);
|
||||
return 'System Error';
|
||||
}
|
||||
$ip2num = implode('', unpack('L', $ipData2));
|
||||
if ($ip2num < 0) {
|
||||
$ip2num += pow(2, 32);
|
||||
}
|
||||
|
||||
if ($ip2num < $ipNum) {
|
||||
if ($Middle == $BeginNum) {
|
||||
fclose($fd);
|
||||
return 'Unknown';
|
||||
}
|
||||
$BeginNum = $Middle;
|
||||
}
|
||||
}
|
||||
|
||||
$ipFlag = fread($fd, 1);
|
||||
if ($ipFlag == chr(1)) {
|
||||
$ipSeek = fread($fd, 3);
|
||||
if (strlen($ipSeek) < 3) {
|
||||
fclose($fd);
|
||||
return 'System Error';
|
||||
}
|
||||
$ipSeek = implode('', unpack('L', $ipSeek . chr(0)));
|
||||
fseek($fd, $ipSeek);
|
||||
$ipFlag = fread($fd, 1);
|
||||
}
|
||||
|
||||
if ($ipFlag == chr(2)) {
|
||||
$AddrSeek = fread($fd, 3);
|
||||
if (strlen($AddrSeek) < 3) {
|
||||
fclose($fd);
|
||||
return 'System Error';
|
||||
}
|
||||
$ipFlag = fread($fd, 1);
|
||||
if ($ipFlag == chr(2)) {
|
||||
$AddrSeek2 = fread($fd, 3);
|
||||
if (strlen($AddrSeek2) < 3) {
|
||||
fclose($fd);
|
||||
return 'System Error';
|
||||
}
|
||||
$AddrSeek2 = implode('', unpack('L', $AddrSeek2 . chr(0)));
|
||||
fseek($fd, $AddrSeek2);
|
||||
} else {
|
||||
fseek($fd, -1, SEEK_CUR);
|
||||
}
|
||||
|
||||
while (($char = fread($fd, 1)) != chr(0)) {
|
||||
$ipAddr2 .= $char;
|
||||
}
|
||||
|
||||
$AddrSeek = implode('', unpack('L', $AddrSeek . chr(0)));
|
||||
fseek($fd, $AddrSeek);
|
||||
|
||||
while (($char = fread($fd, 1)) != chr(0)) {
|
||||
$ipAddr1 .= $char;
|
||||
}
|
||||
|
||||
} else {
|
||||
fseek($fd, -1, SEEK_CUR);
|
||||
while (($char = fread($fd, 1)) != chr(0)) {
|
||||
$ipAddr1 .= $char;
|
||||
}
|
||||
|
||||
$ipFlag = fread($fd, 1);
|
||||
if ($ipFlag == chr(2)) {
|
||||
$AddrSeek2 = fread($fd, 3);
|
||||
if (strlen($AddrSeek2) < 3) {
|
||||
fclose($fd);
|
||||
return 'System Error';
|
||||
}
|
||||
$AddrSeek2 = implode('', unpack('L', $AddrSeek2 . chr(0)));
|
||||
fseek($fd, $AddrSeek2);
|
||||
} else {
|
||||
fseek($fd, -1, SEEK_CUR);
|
||||
}
|
||||
while (($char = fread($fd, 1)) != chr(0)) {
|
||||
$ipAddr2 .= $char;
|
||||
}
|
||||
|
||||
}
|
||||
fclose($fd);
|
||||
|
||||
if (preg_match('/http/i', $ipAddr2)) {
|
||||
$ipAddr2 = '';
|
||||
}
|
||||
$ipaddr = "$ipAddr1 $ipAddr2";
|
||||
$ipaddr = preg_replace('/^\s*/is', '', $ipaddr);
|
||||
$ipaddr = preg_replace('/\s*$/is', '', $ipaddr);
|
||||
if (preg_match('/http/i', $ipaddr) || $ipaddr == '') {
|
||||
$ipaddr = 'Unknown';
|
||||
}
|
||||
|
||||
$charset = mb_detect_encoding($ipaddr, array('UTF-8', 'GBK', 'GB2312'));
|
||||
$charset = strtolower($charset);
|
||||
if ('cp936' == $charset) {
|
||||
$charset = 'GBK';
|
||||
}
|
||||
if ("utf-8" != $charset) {
|
||||
$ipaddr = iconv($charset, "UTF-8//IGNORE", $ipaddr);
|
||||
}
|
||||
return $ipaddr;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
114
Plugin.php
Normal file
114
Plugin.php
Normal file
@ -0,0 +1,114 @@
|
||||
<?php
|
||||
/**
|
||||
* Typecho Access Plugin
|
||||
*
|
||||
* @package Access
|
||||
* @author Kokororin
|
||||
* @version 1.0
|
||||
* @link https://kotori.love
|
||||
*/
|
||||
class Access_Plugin implements Typecho_Plugin_Interface
|
||||
{
|
||||
public static $panel = 'Access/page/console.php';
|
||||
public static function activate()
|
||||
{
|
||||
$msg = Access_Plugin::install();
|
||||
Helper::addPanel(1, self::$panel, 'Access控制台', 'Access插件控制台', 'subscriber');
|
||||
Typecho_Plugin::factory('Widget_Archive')->header = array('Access_Plugin', 'start');
|
||||
return _t($msg);
|
||||
}
|
||||
|
||||
public static function deactivate()
|
||||
{
|
||||
$config = Typecho_Widget::widget('Widget_Options')->plugin('Access');
|
||||
$isDrop = $config->isDrop;
|
||||
if ($isDrop == 0) {
|
||||
$db = Typecho_Db::get();
|
||||
$prefix = $db->getPrefix();
|
||||
$db->query("DROP TABLE `" . $prefix . "access`", Typecho_Db::WRITE);
|
||||
}
|
||||
Helper::removePanel(1, self::$panel);
|
||||
}
|
||||
|
||||
public static function config(Typecho_Widget_Helper_Form $form)
|
||||
{
|
||||
$pageSize = new Typecho_Widget_Helper_Form_Element_Text(
|
||||
'pageSize', null, '',
|
||||
'分页数量', '每页显示的日志数量');
|
||||
$isDrop = new Typecho_Widget_Helper_Form_Element_Radio(
|
||||
'isDrop', array(
|
||||
'0' => '删除',
|
||||
'1' => '不删除',
|
||||
), '', '删除数据表:', '请选择是否在禁用插件时，删除日志数据表');
|
||||
$form->addInput($pageSize);
|
||||
$form->addInput($isDrop);
|
||||
}
|
||||
|
||||
public static function personalConfig(Typecho_Widget_Helper_Form $form)
|
||||
{}
|
||||
|
||||
public static function install()
|
||||
{
|
||||
if (substr(trim(dirname(__FILE__), '/'), -6) != 'Access') {
|
||||
throw new Typecho_Plugin_Exception('插件目录名必须为Access');
|
||||
}
|
||||
$installDb = Typecho_Db::get();
|
||||
$type = explode('_', $installDb->getAdapterName());
|
||||
$type = array_pop($type);
|
||||
$prefix = $installDb->getPrefix();
|
||||
$scripts = "CREATE TABLE `typecho_access` (
|
||||
`id` int(10) unsigned NOT NULL auto_increment,
|
||||
`ua` varchar(255) default NULL,
|
||||
`url` varchar(64) default NULL,
|
||||
`ip` varchar(16) default NULL,
|
||||
`date` int(10) unsigned default '0',
|
||||
PRIMARY KEY (`id`)
|
||||
) ENGINE=MYISAM DEFAULT CHARSET=%charset%;";
|
||||
$scripts = str_replace('typecho_', $prefix, $scripts);
|
||||
$scripts = str_replace('%charset%', 'utf8', $scripts);
|
||||
$scripts = explode(';', $scripts);
|
||||
try {
|
||||
foreach ($scripts as $script) {
|
||||
$script = trim($script);
|
||||
if ($script) {
|
||||
$installDb->query($script, Typecho_Db::WRITE);
|
||||
}
|
||||
}
|
||||
return '成功创建数据表，插件启用成功';
|
||||
} catch (Typecho_Db_Exception $e) {
|
||||
$code = $e->getCode();
|
||||
if (('Mysql' == $type && $code == (1050 || '42S01'))) {
|
||||
$script = 'SELECT * from `' . $prefix . 'access`';
|
||||
$installDb->query($script, Typecho_Db::READ);
|
||||
return '数据表已存在，插件启用成功';
|
||||
} else {
|
||||
throw new Typecho_Plugin_Exception('数据表建立失败，插件启用失败。错误号：' . $code);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
public static function start()
|
||||
{
|
||||
$config = Typecho_Widget::widget('Widget_Options')->plugin('Access');
|
||||
|
||||
$request = new Typecho_Request;
|
||||
$ip = $request->getIp();
|
||||
$url = $_SERVER['REQUEST_URI'];
|
||||
if ($ip == null) {
|
||||
$ip = 'UnKnow';
|
||||
}
|
||||
$options = Typecho_Widget::widget('Widget_Options');
|
||||
$timeStamp = $options->gmtTime;
|
||||
$offset = $options->timezone - $options->serverTimezone;
|
||||
$gtime = $timeStamp + $offset;
|
||||
$db = Typecho_Db::get();
|
||||
$rows = array(
|
||||
'ua' => $_SERVER['HTTP_USER_AGENT'],
|
||||
'url' => $url,
|
||||
'ip' => $ip,
|
||||
'date' => $gtime,
|
||||
);
|
||||
$db->query($db->insert('table.access')->rows($rows));
|
||||
|
||||
}
|
||||
}
|
||||
129
lib/Page.php
Normal file
129
lib/Page.php
Normal file
@ -0,0 +1,129 @@
|
||||
<?php
|
||||
class Page
|
||||
{
|
||||
private $each_disNums; //每页显示的条目数
|
||||
private $nums; //总条目数
|
||||
private $current_page; //当前被选中的页
|
||||
private $sub_pages; //每次显示的页数
|
||||
private $pageNums; //总页数
|
||||
private $page_array = array(); //用来构造分页的数组
|
||||
private $subPage_link; //每个分页的链接
|
||||
/**
|
||||
*
|
||||
* __construct是SubPages的构造函数，用来在创建类的时候自动运行.
|
||||
* @$each_disNums 每页显示的条目数
|
||||
* @nums 总条目数
|
||||
* @current_num 当前被选中的页
|
||||
* @sub_pages 每次显示的页数
|
||||
* @subPage_link 每个分页的链接
|
||||
* @subPage_type 显示分页的类型
|
||||
*
|
||||
* 当@subPage_type=1的时候为普通分页模式
|
||||
* example： 共4523条记录,每页显示10条,当前第1/453页 [首页] [上页] [下页] [尾页]
|
||||
* 当@subPage_type=2的时候为经典分页样式
|
||||
* example： 当前第1/453页 [首页] [上页] 1 2 3 4 5 6 7 8 9 10 [下页] [尾页]
|
||||
*/
|
||||
public function __construct($each_disNums, $nums, $current_page, $sub_pages)
|
||||
{
|
||||
$this->each_disNums = intval($each_disNums);
|
||||
$this->nums = intval($nums);
|
||||
if (!$current_page) {
|
||||
$this->current_page = 1;
|
||||
} else {
|
||||
$this->current_page = intval($current_page);
|
||||
}
|
||||
$this->sub_pages = intval($sub_pages);
|
||||
$this->pageNums = ceil($nums / $each_disNums);
|
||||
$uri = $_SERVER['REQUEST_URI'];
|
||||
$uri = str_replace('&page=' . $this->current_page, '', $uri);
|
||||
$uri = str_replace('?page=' . $this->current_page, '', $uri);
|
||||
$this->subPage_link = Typecho_Widget::widget('Widget_Options')->index . $uri . "&page=";
|
||||
}
|
||||
|
||||
/*
|
||||
__destruct析构函数，当类不在使用的时候调用，该函数用来释放资源。
|
||||
*/
|
||||
public function __destruct()
|
||||
{
|
||||
unset($each_disNums);
|
||||
unset($nums);
|
||||
unset($current_page);
|
||||
unset($sub_pages);
|
||||
unset($pageNums);
|
||||
unset($page_array);
|
||||
unset($subPage_link);
|
||||
}
|
||||
/*
|
||||
用来给建立分页的数组初始化的函数。
|
||||
*/
|
||||
public function initArray()
|
||||
{
|
||||
for ($i = 0; $i < $this->sub_pages; $i++) {
|
||||
$this->page_array[$i] = $i;
|
||||
}
|
||||
return $this->page_array;
|
||||
}
|
||||
/*
|
||||
construct_num_Page该函数使用来构造显示的条目
|
||||
即使：[1][2][3][4][5][6][7][8][9][10]
|
||||
*/
|
||||
public function construct_num_Page()
|
||||
{
|
||||
if ($this->pageNums < $this->sub_pages) {
|
||||
$current_array = array();
|
||||
for ($i = 0; $i < $this->pageNums; $i++) {
|
||||
$current_array[$i] = $i + 1;
|
||||
}
|
||||
} else {
|
||||
$current_array = $this->initArray();
|
||||
if ($this->current_page <= 3) {
|
||||
for ($i = 0; $i < count($current_array); $i++) {
|
||||
$current_array[$i] = $i + 1;
|
||||
}
|
||||
} elseif ($this->current_page <= $this->pageNums && $this->current_page > $this->pageNums - $this->sub_pages + 1) {
|
||||
for ($i = 0; $i < count($current_array); $i++) {
|
||||
$current_array[$i] = ($this->pageNums) - ($this->sub_pages) + 1 + $i;
|
||||
}
|
||||
} else {
|
||||
for ($i = 0; $i < count($current_array); $i++) {
|
||||
$current_array[$i] = $this->current_page - 2 + $i;
|
||||
}
|
||||
}
|
||||
}
|
||||
return $current_array;
|
||||
}
|
||||
/*
|
||||
构造经典模式的分页
|
||||
当前第1/453页 [首页] [上页] 1 2 3 4 5 6 7 8 9 10 [下页] [尾页]
|
||||
*/
|
||||
public function show()
|
||||
{
|
||||
$str = "";
|
||||
if ($this->current_page > 1) {
|
||||
$firstPageUrl = $this->subPage_link . "1";
|
||||
$prevPageUrl = $this->subPage_link . ($this->current_page - 1);
|
||||
$str .= '<li><a href="' . $prevPageUrl . '">«</a></li>';
|
||||
} else {
|
||||
$str .= '';
|
||||
}
|
||||
$a = $this->construct_num_Page();
|
||||
for ($i = 0; $i < count($a); $i++) {
|
||||
$s = $a[$i];
|
||||
if ($s == $this->current_page) {
|
||||
$str .= '<li class="current"><a href="' . $url . '">' . $s . '</a></li>';
|
||||
} else {
|
||||
$url = $this->subPage_link . $s;
|
||||
$str .= '<li><a href="' . $url . '">' . $s . '</a></li>';
|
||||
}
|
||||
}
|
||||
if ($this->current_page < $this->pageNums) {
|
||||
$lastPageUrl = $this->subPage_link . $this->pageNums;
|
||||
$nextPageUrl = $this->subPage_link . ($this->current_page + 1);
|
||||
$str .= '<li><a href="' . $nextPageUrl . '">»</a></li>';
|
||||
} else {
|
||||
$str .= '';
|
||||
}
|
||||
return $str;
|
||||
}
|
||||
|
||||
}
|
||||
84
lib/highcharts/examples/3d-column-interactive/index.htm
Normal file
84
lib/highcharts/examples/3d-column-interactive/index.htm
Normal file
@ -0,0 +1,84 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
#container, #sliders {
|
||||
min-width: 310px;
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
#container {
|
||||
height: 400px;
|
||||
}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
// Set up the chart
|
||||
var chart = new Highcharts.Chart({
|
||||
chart: {
|
||||
renderTo: 'container',
|
||||
type: 'column',
|
||||
margin: 75,
|
||||
options3d: {
|
||||
enabled: true,
|
||||
alpha: 15,
|
||||
beta: 15,
|
||||
depth: 50,
|
||||
viewDistance: 25
|
||||
}
|
||||
},
|
||||
title: {
|
||||
text: 'Chart rotation demo'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Test options by dragging the sliders below'
|
||||
},
|
||||
plotOptions: {
|
||||
column: {
|
||||
depth: 25
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
|
||||
}]
|
||||
});
|
||||
|
||||
function showValues() {
|
||||
$('#R0-value').html(chart.options.chart.options3d.alpha);
|
||||
$('#R1-value').html(chart.options.chart.options3d.beta);
|
||||
}
|
||||
|
||||
// Activate the sliders
|
||||
$('#R0').on('change', function () {
|
||||
chart.options.chart.options3d.alpha = this.value;
|
||||
showValues();
|
||||
chart.redraw(false);
|
||||
});
|
||||
$('#R1').on('change', function () {
|
||||
chart.options.chart.options3d.beta = this.value;
|
||||
showValues();
|
||||
chart.redraw(false);
|
||||
});
|
||||
|
||||
showValues();
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/highcharts-3d.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container"></div>
|
||||
<div id="sliders">
|
||||
<table>
|
||||
<tr><td>Alpha Angle</td><td><input id="R0" type="range" min="0" max="45" value="15"/> <span id="R0-value" class="value"></span></td></tr>
|
||||
<tr><td>Beta Angle</td><td><input id="R1" type="range" min="0" max="45" value="15"/> <span id="R1-value" class="value"></span></td></tr>
|
||||
</table>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
64
lib/highcharts/examples/3d-column-null-values/index.htm
Normal file
64
lib/highcharts/examples/3d-column-null-values/index.htm
Normal file
@ -0,0 +1,64 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
#container {
|
||||
height: 400px;
|
||||
min-width: 310px;
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'column',
|
||||
margin: 75,
|
||||
options3d: {
|
||||
enabled: true,
|
||||
alpha: 10,
|
||||
beta: 25,
|
||||
depth: 70
|
||||
}
|
||||
},
|
||||
title: {
|
||||
text: '3D chart with null values'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Notice the difference between a 0 value and a null point'
|
||||
},
|
||||
plotOptions: {
|
||||
column: {
|
||||
depth: 25
|
||||
}
|
||||
},
|
||||
xAxis: {
|
||||
categories: Highcharts.getOptions().lang.shortMonths
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: null
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: 'Sales',
|
||||
data: [2, 3, null, 4, 0, 5, 1, 4, 6, 3]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/highcharts-3d.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="height: 400px"></div>
|
||||
</body>
|
||||
</html>
|
||||
@ -0,0 +1,92 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
#container {
|
||||
height: 400px;
|
||||
min-width: 310px;
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
|
||||
chart: {
|
||||
type: 'column',
|
||||
options3d: {
|
||||
enabled: true,
|
||||
alpha: 15,
|
||||
beta: 15,
|
||||
viewDistance: 25,
|
||||
depth: 40
|
||||
},
|
||||
marginTop: 80,
|
||||
marginRight: 40
|
||||
},
|
||||
|
||||
title: {
|
||||
text: 'Total fruit consumption, grouped by gender'
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas']
|
||||
},
|
||||
|
||||
yAxis: {
|
||||
allowDecimals: false,
|
||||
min: 0,
|
||||
title: {
|
||||
text: 'Number of fruits'
|
||||
}
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
headerFormat: '<b>{point.key}</b><br>',
|
||||
pointFormat: '<span style="color:{series.color}">\u25CF</span> {series.name}: {point.y} / {point.stackTotal}'
|
||||
},
|
||||
|
||||
plotOptions: {
|
||||
column: {
|
||||
stacking: 'normal',
|
||||
depth: 40
|
||||
}
|
||||
},
|
||||
|
||||
series: [{
|
||||
name: 'John',
|
||||
data: [5, 3, 4, 7, 2],
|
||||
stack: 'male'
|
||||
}, {
|
||||
name: 'Joe',
|
||||
data: [3, 4, 4, 2, 5],
|
||||
stack: 'male'
|
||||
}, {
|
||||
name: 'Jane',
|
||||
data: [2, 5, 6, 2, 1],
|
||||
stack: 'female'
|
||||
}, {
|
||||
name: 'Janet',
|
||||
data: [3, 0, 4, 4, 3],
|
||||
stack: 'female'
|
||||
}]
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/highcharts-3d.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="height: 400px"></div>
|
||||
</body>
|
||||
</html>
|
||||
59
lib/highcharts/examples/3d-pie-donut/index.htm
Normal file
59
lib/highcharts/examples/3d-pie-donut/index.htm
Normal file
@ -0,0 +1,59 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'pie',
|
||||
options3d: {
|
||||
enabled: true,
|
||||
alpha: 45
|
||||
}
|
||||
},
|
||||
title: {
|
||||
text: 'Contents of Highsoft\'s weekly fruit delivery'
|
||||
},
|
||||
subtitle: {
|
||||
text: '3D donut in Highcharts'
|
||||
},
|
||||
plotOptions: {
|
||||
pie: {
|
||||
innerSize: 100,
|
||||
depth: 45
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: 'Delivered amount',
|
||||
data: [
|
||||
['Bananas', 8],
|
||||
['Kiwi', 3],
|
||||
['Mixed nuts', 1],
|
||||
['Oranges', 6],
|
||||
['Apples', 8],
|
||||
['Pears', 4],
|
||||
['Clementines', 4],
|
||||
['Reddish (bag)', 1],
|
||||
['Grapes (bunch)', 1]
|
||||
]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/highcharts-3d.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="height: 400px"></div>
|
||||
</body>
|
||||
</html>
|
||||
68
lib/highcharts/examples/3d-pie/index.htm
Normal file
68
lib/highcharts/examples/3d-pie/index.htm
Normal file
@ -0,0 +1,68 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'pie',
|
||||
options3d: {
|
||||
enabled: true,
|
||||
alpha: 45,
|
||||
beta: 0
|
||||
}
|
||||
},
|
||||
title: {
|
||||
text: 'Browser market shares at a specific website, 2014'
|
||||
},
|
||||
tooltip: {
|
||||
pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
|
||||
},
|
||||
plotOptions: {
|
||||
pie: {
|
||||
allowPointSelect: true,
|
||||
cursor: 'pointer',
|
||||
depth: 35,
|
||||
dataLabels: {
|
||||
enabled: true,
|
||||
format: '{point.name}'
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
type: 'pie',
|
||||
name: 'Browser share',
|
||||
data: [
|
||||
['Firefox', 45.0],
|
||||
['IE', 26.8],
|
||||
{
|
||||
name: 'Chrome',
|
||||
y: 12.8,
|
||||
sliced: true,
|
||||
selected: true
|
||||
},
|
||||
['Safari', 8.5],
|
||||
['Opera', 6.2],
|
||||
['Others', 0.7]
|
||||
]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/highcharts-3d.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="height: 400px"></div>
|
||||
</body>
|
||||
</html>
|
||||
134
lib/highcharts/examples/3d-scatter-draggable/index.htm
Normal file
134
lib/highcharts/examples/3d-scatter-draggable/index.htm
Normal file
@ -0,0 +1,134 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
#container {
|
||||
height: 400px;
|
||||
min-width: 310px;
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
|
||||
// Give the points a 3D feel by adding a radial gradient
|
||||
Highcharts.getOptions().colors = $.map(Highcharts.getOptions().colors, function (color) {
|
||||
return {
|
||||
radialGradient: {
|
||||
cx: 0.4,
|
||||
cy: 0.3,
|
||||
r: 0.5
|
||||
},
|
||||
stops: [
|
||||
[0, color],
|
||||
[1, Highcharts.Color(color).brighten(-0.2).get('rgb')]
|
||||
]
|
||||
};
|
||||
});
|
||||
|
||||
// Set up the chart
|
||||
var chart = new Highcharts.Chart({
|
||||
chart: {
|
||||
renderTo: 'container',
|
||||
margin: 100,
|
||||
type: 'scatter',
|
||||
options3d: {
|
||||
enabled: true,
|
||||
alpha: 10,
|
||||
beta: 30,
|
||||
depth: 250,
|
||||
viewDistance: 5,
|
||||
|
||||
frame: {
|
||||
bottom: { size: 1, color: 'rgba(0,0,0,0.02)' },
|
||||
back: { size: 1, color: 'rgba(0,0,0,0.04)' },
|
||||
side: { size: 1, color: 'rgba(0,0,0,0.06)' }
|
||||
}
|
||||
}
|
||||
},
|
||||
title: {
|
||||
text: 'Draggable box'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Click and drag the plot area to rotate in space'
|
||||
},
|
||||
plotOptions: {
|
||||
scatter: {
|
||||
width: 10,
|
||||
height: 10,
|
||||
depth: 10
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
min: 0,
|
||||
max: 10,
|
||||
title: null
|
||||
},
|
||||
xAxis: {
|
||||
min: 0,
|
||||
max: 10,
|
||||
gridLineWidth: 1
|
||||
},
|
||||
zAxis: {
|
||||
min: 0,
|
||||
max: 10,
|
||||
showFirstLabel: false
|
||||
},
|
||||
legend: {
|
||||
enabled: false
|
||||
},
|
||||
series: [{
|
||||
name: 'Reading',
|
||||
colorByPoint: true,
|
||||
data: [[1, 6, 5], [8, 7, 9], [1, 3, 4], [4, 6, 8], [5, 7, 7], [6, 9, 6], [7, 0, 5], [2, 3, 3], [3, 9, 8], [3, 6, 5], [4, 9, 4], [2, 3, 3], [6, 9, 9], [0, 7, 0], [7, 7, 9], [7, 2, 9], [0, 6, 2], [4, 6, 7], [3, 7, 7], [0, 1, 7], [2, 8, 6], [2, 3, 7], [6, 4, 8], [3, 5, 9], [7, 9, 5], [3, 1, 7], [4, 4, 2], [3, 6, 2], [3, 1, 6], [6, 8, 5], [6, 6, 7], [4, 1, 1], [7, 2, 7], [7, 7, 0], [8, 8, 9], [9, 4, 1], [8, 3, 4], [9, 8, 9], [3, 5, 3], [0, 2, 4], [6, 0, 2], [2, 1, 3], [5, 8, 9], [2, 1, 1], [9, 7, 6], [3, 0, 2], [9, 9, 0], [3, 4, 8], [2, 6, 1], [8, 9, 2], [7, 6, 5], [6, 3, 1], [9, 3, 1], [8, 9, 3], [9, 1, 0], [3, 8, 7], [8, 0, 0], [4, 9, 7], [8, 6, 2], [4, 3, 0], [2, 3, 5], [9, 1, 4], [1, 1, 4], [6, 0, 2], [6, 1, 6], [3, 8, 8], [8, 8, 7], [5, 5, 0], [3, 9, 6], [5, 4, 3], [6, 8, 3], [0, 1, 5], [6, 7, 3], [8, 3, 2], [3, 8, 3], [2, 1, 6], [4, 6, 7], [8, 9, 9], [5, 4, 2], [6, 1, 3], [6, 9, 5], [4, 8, 2], [9, 7, 4], [5, 4, 2], [9, 6, 1], [2, 7, 3], [4, 5, 4], [6, 8, 1], [3, 4, 0], [2, 2, 6], [5, 1, 2], [9, 9, 7], [6, 9, 9], [8, 4, 3], [4, 1, 7], [6, 2, 5], [0, 4, 9], [3, 5, 9], [6, 9, 1], [1, 9, 2]]
|
||||
}]
|
||||
});
|
||||
|
||||
|
||||
// Add mouse events for rotation
|
||||
$(chart.container).bind('mousedown.hc touchstart.hc', function (e) {
|
||||
e = chart.pointer.normalize(e);
|
||||
|
||||
var posX = e.pageX,
|
||||
posY = e.pageY,
|
||||
alpha = chart.options.chart.options3d.alpha,
|
||||
beta = chart.options.chart.options3d.beta,
|
||||
newAlpha,
|
||||
newBeta,
|
||||
sensitivity = 5; // lower is more sensitive
|
||||
|
||||
$(document).bind({
|
||||
'mousemove.hc touchdrag.hc': function (e) {
|
||||
// Run beta
|
||||
newBeta = beta + (posX - e.pageX) / sensitivity;
|
||||
chart.options.chart.options3d.beta = newBeta;
|
||||
|
||||
// Run alpha
|
||||
newAlpha = alpha + (e.pageY - posY) / sensitivity;
|
||||
chart.options.chart.options3d.alpha = newAlpha;
|
||||
|
||||
chart.redraw(false);
|
||||
},
|
||||
'mouseup touchend': function () {
|
||||
$(document).unbind('.hc');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/highcharts-3d.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="height: 400px"></div>
|
||||
</body>
|
||||
</html>
|
||||
90
lib/highcharts/examples/area-basic/index.htm
Normal file
90
lib/highcharts/examples/area-basic/index.htm
Normal file
@ -0,0 +1,90 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'area'
|
||||
},
|
||||
title: {
|
||||
text: 'US and USSR nuclear stockpiles'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Source: <a href="http://thebulletin.metapress.com/content/c4120650912x74k7/fulltext.pdf">' +
|
||||
'thebulletin.metapress.com</a>'
|
||||
},
|
||||
xAxis: {
|
||||
allowDecimals: false,
|
||||
labels: {
|
||||
formatter: function () {
|
||||
return this.value; // clean, unformatted number for year
|
||||
}
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Nuclear weapon states'
|
||||
},
|
||||
labels: {
|
||||
formatter: function () {
|
||||
return this.value / 1000 + 'k';
|
||||
}
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
pointFormat: '{series.name} produced <b>{point.y:,.0f}</b><br/>warheads in {point.x}'
|
||||
},
|
||||
plotOptions: {
|
||||
area: {
|
||||
pointStart: 1940,
|
||||
marker: {
|
||||
enabled: false,
|
||||
symbol: 'circle',
|
||||
radius: 2,
|
||||
states: {
|
||||
hover: {
|
||||
enabled: true
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: 'USA',
|
||||
data: [null, null, null, null, null, 6, 11, 32, 110, 235, 369, 640,
|
||||
1005, 1436, 2063, 3057, 4618, 6444, 9822, 15468, 20434, 24126,
|
||||
27387, 29459, 31056, 31982, 32040, 31233, 29224, 27342, 26662,
|
||||
26956, 27912, 28999, 28965, 27826, 25579, 25722, 24826, 24605,
|
||||
24304, 23464, 23708, 24099, 24357, 24237, 24401, 24344, 23586,
|
||||
22380, 21004, 17287, 14747, 13076, 12555, 12144, 11009, 10950,
|
||||
10871, 10824, 10577, 10527, 10475, 10421, 10358, 10295, 10104]
|
||||
}, {
|
||||
name: 'USSR/Russia',
|
||||
data: [null, null, null, null, null, null, null, null, null, null,
|
||||
5, 25, 50, 120, 150, 200, 426, 660, 869, 1060, 1605, 2471, 3322,
|
||||
4238, 5221, 6129, 7089, 8339, 9399, 10538, 11643, 13092, 14478,
|
||||
15915, 17385, 19055, 21205, 23044, 25393, 27935, 30062, 32049,
|
||||
33952, 35804, 37431, 39197, 45000, 43000, 41000, 39000, 37000,
|
||||
35000, 33000, 31000, 29000, 27000, 25000, 24000, 23000, 22000,
|
||||
21000, 20000, 19000, 18000, 18000, 17000, 16000]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
83
lib/highcharts/examples/area-inverted/index.htm
Normal file
83
lib/highcharts/examples/area-inverted/index.htm
Normal file
@ -0,0 +1,83 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'area',
|
||||
inverted: true
|
||||
},
|
||||
title: {
|
||||
text: 'Average fruit consumption during one week'
|
||||
},
|
||||
subtitle: {
|
||||
style: {
|
||||
position: 'absolute',
|
||||
right: '0px',
|
||||
bottom: '10px'
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
layout: 'vertical',
|
||||
align: 'right',
|
||||
verticalAlign: 'top',
|
||||
x: -150,
|
||||
y: 100,
|
||||
floating: true,
|
||||
borderWidth: 1,
|
||||
backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'
|
||||
},
|
||||
xAxis: {
|
||||
categories: [
|
||||
'Monday',
|
||||
'Tuesday',
|
||||
'Wednesday',
|
||||
'Thursday',
|
||||
'Friday',
|
||||
'Saturday',
|
||||
'Sunday'
|
||||
]
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Number of units'
|
||||
},
|
||||
labels: {
|
||||
formatter: function () {
|
||||
return this.value;
|
||||
}
|
||||
},
|
||||
min: 0
|
||||
},
|
||||
plotOptions: {
|
||||
area: {
|
||||
fillOpacity: 0.5
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: 'John',
|
||||
data: [3, 4, 3, 5, 4, 10, 12]
|
||||
}, {
|
||||
name: 'Jane',
|
||||
data: [1, 3, 4, 3, 3, 5, 4]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
83
lib/highcharts/examples/area-missing/index.htm
Normal file
83
lib/highcharts/examples/area-missing/index.htm
Normal file
@ -0,0 +1,83 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'area',
|
||||
spacingBottom: 30
|
||||
},
|
||||
title: {
|
||||
text: 'Fruit consumption *'
|
||||
},
|
||||
subtitle: {
|
||||
text: '* Jane\'s banana consumption is unknown',
|
||||
floating: true,
|
||||
align: 'right',
|
||||
verticalAlign: 'bottom',
|
||||
y: 15
|
||||
},
|
||||
legend: {
|
||||
layout: 'vertical',
|
||||
align: 'left',
|
||||
verticalAlign: 'top',
|
||||
x: 150,
|
||||
y: 100,
|
||||
floating: true,
|
||||
borderWidth: 1,
|
||||
backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'
|
||||
},
|
||||
xAxis: {
|
||||
categories: ['Apples', 'Pears', 'Oranges', 'Bananas', 'Grapes', 'Plums', 'Strawberries', 'Raspberries']
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Y-Axis'
|
||||
},
|
||||
labels: {
|
||||
formatter: function () {
|
||||
return this.value;
|
||||
}
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
formatter: function () {
|
||||
return '<b>' + this.series.name + '</b><br/>' +
|
||||
this.x + ': ' + this.y;
|
||||
}
|
||||
},
|
||||
plotOptions: {
|
||||
area: {
|
||||
fillOpacity: 0.5
|
||||
}
|
||||
},
|
||||
credits: {
|
||||
enabled: false
|
||||
},
|
||||
series: [{
|
||||
name: 'John',
|
||||
data: [0, 1, 4, 4, 5, 2, 3, 7]
|
||||
}, {
|
||||
name: 'Jane',
|
||||
data: [1, 0, 3, null, 3, 1, 2, 1]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
47
lib/highcharts/examples/area-negative/index.htm
Normal file
47
lib/highcharts/examples/area-negative/index.htm
Normal file
@ -0,0 +1,47 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'area'
|
||||
},
|
||||
title: {
|
||||
text: 'Area chart with negative values'
|
||||
},
|
||||
xAxis: {
|
||||
categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas']
|
||||
},
|
||||
credits: {
|
||||
enabled: false
|
||||
},
|
||||
series: [{
|
||||
name: 'John',
|
||||
data: [5, 3, 4, 7, 2]
|
||||
}, {
|
||||
name: 'Jane',
|
||||
data: [2, -2, -3, 2, 1]
|
||||
}, {
|
||||
name: 'Joe',
|
||||
data: [3, 4, 4, -2, 5]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
77
lib/highcharts/examples/area-stacked-percent/index.htm
Normal file
77
lib/highcharts/examples/area-stacked-percent/index.htm
Normal file
@ -0,0 +1,77 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'area'
|
||||
},
|
||||
title: {
|
||||
text: 'Historic and Estimated Worldwide Population Distribution by Region'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Source: Wikipedia.org'
|
||||
},
|
||||
xAxis: {
|
||||
categories: ['1750', '1800', '1850', '1900', '1950', '1999', '2050'],
|
||||
tickmarkPlacement: 'on',
|
||||
title: {
|
||||
enabled: false
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Percent'
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.percentage:.1f}%</b> ({point.y:,.0f} millions)<br/>',
|
||||
shared: true
|
||||
},
|
||||
plotOptions: {
|
||||
area: {
|
||||
stacking: 'percent',
|
||||
lineColor: '#ffffff',
|
||||
lineWidth: 1,
|
||||
marker: {
|
||||
lineWidth: 1,
|
||||
lineColor: '#ffffff'
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: 'Asia',
|
||||
data: [502, 635, 809, 947, 1402, 3634, 5268]
|
||||
}, {
|
||||
name: 'Africa',
|
||||
data: [106, 107, 111, 133, 221, 767, 1766]
|
||||
}, {
|
||||
name: 'Europe',
|
||||
data: [163, 203, 276, 408, 547, 729, 628]
|
||||
}, {
|
||||
name: 'America',
|
||||
data: [18, 31, 54, 156, 339, 818, 1201]
|
||||
}, {
|
||||
name: 'Oceania',
|
||||
data: [2, 2, 2, 6, 13, 30, 46]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; max-width: 800px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
82
lib/highcharts/examples/area-stacked/index.htm
Normal file
82
lib/highcharts/examples/area-stacked/index.htm
Normal file
@ -0,0 +1,82 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'area'
|
||||
},
|
||||
title: {
|
||||
text: 'Historic and Estimated Worldwide Population Growth by Region'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Source: Wikipedia.org'
|
||||
},
|
||||
xAxis: {
|
||||
categories: ['1750', '1800', '1850', '1900', '1950', '1999', '2050'],
|
||||
tickmarkPlacement: 'on',
|
||||
title: {
|
||||
enabled: false
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Billions'
|
||||
},
|
||||
labels: {
|
||||
formatter: function () {
|
||||
return this.value / 1000;
|
||||
}
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
shared: true,
|
||||
valueSuffix: ' millions'
|
||||
},
|
||||
plotOptions: {
|
||||
area: {
|
||||
stacking: 'normal',
|
||||
lineColor: '#666666',
|
||||
lineWidth: 1,
|
||||
marker: {
|
||||
lineWidth: 1,
|
||||
lineColor: '#666666'
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: 'Asia',
|
||||
data: [502, 635, 809, 947, 1402, 3634, 5268]
|
||||
}, {
|
||||
name: 'Africa',
|
||||
data: [106, 107, 111, 133, 221, 767, 1766]
|
||||
}, {
|
||||
name: 'Europe',
|
||||
data: [163, 203, 276, 408, 547, 729, 628]
|
||||
}, {
|
||||
name: 'America',
|
||||
data: [18, 31, 54, 156, 339, 818, 1201]
|
||||
}, {
|
||||
name: 'Oceania',
|
||||
data: [2, 2, 2, 6, 13, 30, 46]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
138
lib/highcharts/examples/arearange-line/index.htm
Normal file
138
lib/highcharts/examples/arearange-line/index.htm
Normal file
@ -0,0 +1,138 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
|
||||
var ranges = [
|
||||
[1246406400000, 14.3, 27.7],
|
||||
[1246492800000, 14.5, 27.8],
|
||||
[1246579200000, 15.5, 29.6],
|
||||
[1246665600000, 16.7, 30.7],
|
||||
[1246752000000, 16.5, 25.0],
|
||||
[1246838400000, 17.8, 25.7],
|
||||
[1246924800000, 13.5, 24.8],
|
||||
[1247011200000, 10.5, 21.4],
|
||||
[1247097600000, 9.2, 23.8],
|
||||
[1247184000000, 11.6, 21.8],
|
||||
[1247270400000, 10.7, 23.7],
|
||||
[1247356800000, 11.0, 23.3],
|
||||
[1247443200000, 11.6, 23.7],
|
||||
[1247529600000, 11.8, 20.7],
|
||||
[1247616000000, 12.6, 22.4],
|
||||
[1247702400000, 13.6, 19.6],
|
||||
[1247788800000, 11.4, 22.6],
|
||||
[1247875200000, 13.2, 25.0],
|
||||
[1247961600000, 14.2, 21.6],
|
||||
[1248048000000, 13.1, 17.1],
|
||||
[1248134400000, 12.2, 15.5],
|
||||
[1248220800000, 12.0, 20.8],
|
||||
[1248307200000, 12.0, 17.1],
|
||||
[1248393600000, 12.7, 18.3],
|
||||
[1248480000000, 12.4, 19.4],
|
||||
[1248566400000, 12.6, 19.9],
|
||||
[1248652800000, 11.9, 20.2],
|
||||
[1248739200000, 11.0, 19.3],
|
||||
[1248825600000, 10.8, 17.8],
|
||||
[1248912000000, 11.8, 18.5],
|
||||
[1248998400000, 10.8, 16.1]
|
||||
],
|
||||
averages = [
|
||||
[1246406400000, 21.5],
|
||||
[1246492800000, 22.1],
|
||||
[1246579200000, 23],
|
||||
[1246665600000, 23.8],
|
||||
[1246752000000, 21.4],
|
||||
[1246838400000, 21.3],
|
||||
[1246924800000, 18.3],
|
||||
[1247011200000, 15.4],
|
||||
[1247097600000, 16.4],
|
||||
[1247184000000, 17.7],
|
||||
[1247270400000, 17.5],
|
||||
[1247356800000, 17.6],
|
||||
[1247443200000, 17.7],
|
||||
[1247529600000, 16.8],
|
||||
[1247616000000, 17.7],
|
||||
[1247702400000, 16.3],
|
||||
[1247788800000, 17.8],
|
||||
[1247875200000, 18.1],
|
||||
[1247961600000, 17.2],
|
||||
[1248048000000, 14.4],
|
||||
[1248134400000, 13.7],
|
||||
[1248220800000, 15.7],
|
||||
[1248307200000, 14.6],
|
||||
[1248393600000, 15.3],
|
||||
[1248480000000, 15.3],
|
||||
[1248566400000, 15.8],
|
||||
[1248652800000, 15.2],
|
||||
[1248739200000, 14.8],
|
||||
[1248825600000, 14.4],
|
||||
[1248912000000, 15],
|
||||
[1248998400000, 13.6]
|
||||
];
|
||||
|
||||
|
||||
$('#container').highcharts({
|
||||
|
||||
title: {
|
||||
text: 'July temperatures'
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
type: 'datetime'
|
||||
},
|
||||
|
||||
yAxis: {
|
||||
title: {
|
||||
text: null
|
||||
}
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
crosshairs: true,
|
||||
shared: true,
|
||||
valueSuffix: '°C'
|
||||
},
|
||||
|
||||
legend: {
|
||||
},
|
||||
|
||||
series: [{
|
||||
name: 'Temperature',
|
||||
data: averages,
|
||||
zIndex: 1,
|
||||
marker: {
|
||||
fillColor: 'white',
|
||||
lineWidth: 2,
|
||||
lineColor: Highcharts.getOptions().colors[0]
|
||||
}
|
||||
}, {
|
||||
name: 'Range',
|
||||
data: ranges,
|
||||
type: 'arearange',
|
||||
lineWidth: 0,
|
||||
linkedTo: ':previous',
|
||||
color: Highcharts.getOptions().colors[0],
|
||||
fillOpacity: 0.3,
|
||||
zIndex: 0
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/highcharts-more.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
65
lib/highcharts/examples/arearange/index.htm
Normal file
65
lib/highcharts/examples/arearange/index.htm
Normal file
@ -0,0 +1,65 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=range.json&callback=?', function (data) {
|
||||
|
||||
$('#container').highcharts({
|
||||
|
||||
chart: {
|
||||
type: 'arearange',
|
||||
zoomType: 'x'
|
||||
},
|
||||
|
||||
title: {
|
||||
text: 'Temperature variation by day'
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
type: 'datetime'
|
||||
},
|
||||
|
||||
yAxis: {
|
||||
title: {
|
||||
text: null
|
||||
}
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
crosshairs: true,
|
||||
shared: true,
|
||||
valueSuffix: '°C'
|
||||
},
|
||||
|
||||
legend: {
|
||||
enabled: false
|
||||
},
|
||||
|
||||
series: [{
|
||||
name: 'Temperatures',
|
||||
data: data
|
||||
}]
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/highcharts-more.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
81
lib/highcharts/examples/areaspline/index.htm
Normal file
81
lib/highcharts/examples/areaspline/index.htm
Normal file
@ -0,0 +1,81 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'areaspline'
|
||||
},
|
||||
title: {
|
||||
text: 'Average fruit consumption during one week'
|
||||
},
|
||||
legend: {
|
||||
layout: 'vertical',
|
||||
align: 'left',
|
||||
verticalAlign: 'top',
|
||||
x: 150,
|
||||
y: 100,
|
||||
floating: true,
|
||||
borderWidth: 1,
|
||||
backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'
|
||||
},
|
||||
xAxis: {
|
||||
categories: [
|
||||
'Monday',
|
||||
'Tuesday',
|
||||
'Wednesday',
|
||||
'Thursday',
|
||||
'Friday',
|
||||
'Saturday',
|
||||
'Sunday'
|
||||
],
|
||||
plotBands: [{ // visualize the weekend
|
||||
from: 4.5,
|
||||
to: 6.5,
|
||||
color: 'rgba(68, 170, 213, .2)'
|
||||
}]
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Fruit units'
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
shared: true,
|
||||
valueSuffix: ' units'
|
||||
},
|
||||
credits: {
|
||||
enabled: false
|
||||
},
|
||||
plotOptions: {
|
||||
areaspline: {
|
||||
fillOpacity: 0.5
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: 'John',
|
||||
data: [3, 4, 3, 5, 4, 10, 12]
|
||||
}, {
|
||||
name: 'Jane',
|
||||
data: [1, 3, 4, 3, 3, 5, 4]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
84
lib/highcharts/examples/bar-basic/index.htm
Normal file
84
lib/highcharts/examples/bar-basic/index.htm
Normal file
@ -0,0 +1,84 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'bar'
|
||||
},
|
||||
title: {
|
||||
text: 'Historic World Population by Region'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Source: <a href="https://en.wikipedia.org/wiki/World_population">Wikipedia.org</a>'
|
||||
},
|
||||
xAxis: {
|
||||
categories: ['Africa', 'America', 'Asia', 'Europe', 'Oceania'],
|
||||
title: {
|
||||
text: null
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
min: 0,
|
||||
title: {
|
||||
text: 'Population (millions)',
|
||||
align: 'high'
|
||||
},
|
||||
labels: {
|
||||
overflow: 'justify'
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
valueSuffix: ' millions'
|
||||
},
|
||||
plotOptions: {
|
||||
bar: {
|
||||
dataLabels: {
|
||||
enabled: true
|
||||
}
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
layout: 'vertical',
|
||||
align: 'right',
|
||||
verticalAlign: 'top',
|
||||
x: -40,
|
||||
y: 80,
|
||||
floating: true,
|
||||
borderWidth: 1,
|
||||
backgroundColor: ((Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'),
|
||||
shadow: true
|
||||
},
|
||||
credits: {
|
||||
enabled: false
|
||||
},
|
||||
series: [{
|
||||
name: 'Year 1800',
|
||||
data: [107, 31, 635, 203, 2]
|
||||
}, {
|
||||
name: 'Year 1900',
|
||||
data: [133, 156, 947, 408, 6]
|
||||
}, {
|
||||
name: 'Year 2012',
|
||||
data: [1052, 954, 4250, 740, 38]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; max-width: 800px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
94
lib/highcharts/examples/bar-negative-stack/index.htm
Normal file
94
lib/highcharts/examples/bar-negative-stack/index.htm
Normal file
@ -0,0 +1,94 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
// Data gathered from http://populationpyramid.net/germany/2015/
|
||||
$(function () {
|
||||
// Age categories
|
||||
var categories = ['0-4', '5-9', '10-14', '15-19',
|
||||
'20-24', '25-29', '30-34', '35-39', '40-44',
|
||||
'45-49', '50-54', '55-59', '60-64', '65-69',
|
||||
'70-74', '75-79', '80-84', '85-89', '90-94',
|
||||
'95-99', '100 + '];
|
||||
$(document).ready(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'bar'
|
||||
},
|
||||
title: {
|
||||
text: 'Population pyramid for Germany, 2015'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Source: <a href="http://populationpyramid.net/germany/2015/">Population Pyramids of the World from 1950 to 2100</a>'
|
||||
},
|
||||
xAxis: [{
|
||||
categories: categories,
|
||||
reversed: false,
|
||||
labels: {
|
||||
step: 1
|
||||
}
|
||||
}, { // mirror axis on right side
|
||||
opposite: true,
|
||||
reversed: false,
|
||||
categories: categories,
|
||||
linkedTo: 0,
|
||||
labels: {
|
||||
step: 1
|
||||
}
|
||||
}],
|
||||
yAxis: {
|
||||
title: {
|
||||
text: null
|
||||
},
|
||||
labels: {
|
||||
formatter: function () {
|
||||
return Math.abs(this.value) + '%';
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
plotOptions: {
|
||||
series: {
|
||||
stacking: 'normal'
|
||||
}
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
formatter: function () {
|
||||
return '<b>' + this.series.name + ', age ' + this.point.category + '</b><br/>' +
|
||||
'Population: ' + Highcharts.numberFormat(Math.abs(this.point.y), 0);
|
||||
}
|
||||
},
|
||||
|
||||
series: [{
|
||||
name: 'Male',
|
||||
data: [-2.2, -2.2, -2.3, -2.5, -2.7, -3.1, -3.2,
|
||||
-3.0, -3.2, -4.3, -4.4, -3.6, -3.1, -2.4,
|
||||
-2.5, -2.3, -1.2, -0.6, -0.2, -0.0, -0.0]
|
||||
}, {
|
||||
name: 'Female',
|
||||
data: [2.1, 2.0, 2.2, 2.4, 2.6, 3.0, 3.1, 2.9,
|
||||
3.1, 4.1, 4.3, 3.6, 3.4, 2.6, 2.9, 2.9,
|
||||
1.8, 1.2, 0.6, 0.1, 0.0]
|
||||
}]
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; max-width: 800px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
58
lib/highcharts/examples/bar-stacked/index.htm
Normal file
58
lib/highcharts/examples/bar-stacked/index.htm
Normal file
@ -0,0 +1,58 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'bar'
|
||||
},
|
||||
title: {
|
||||
text: 'Stacked bar chart'
|
||||
},
|
||||
xAxis: {
|
||||
categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas']
|
||||
},
|
||||
yAxis: {
|
||||
min: 0,
|
||||
title: {
|
||||
text: 'Total fruit consumption'
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
reversed: true
|
||||
},
|
||||
plotOptions: {
|
||||
series: {
|
||||
stacking: 'normal'
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: 'John',
|
||||
data: [5, 3, 4, 7, 2]
|
||||
}, {
|
||||
name: 'Jane',
|
||||
data: [2, 2, 3, 2, 1]
|
||||
}, {
|
||||
name: 'Joe',
|
||||
data: [3, 4, 4, 2, 5]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; max-width: 800px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
95
lib/highcharts/examples/box-plot/index.htm
Normal file
95
lib/highcharts/examples/box-plot/index.htm
Normal file
@ -0,0 +1,95 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
|
||||
chart: {
|
||||
type: 'boxplot'
|
||||
},
|
||||
|
||||
title: {
|
||||
text: 'Highcharts Box Plot Example'
|
||||
},
|
||||
|
||||
legend: {
|
||||
enabled: false
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
categories: ['1', '2', '3', '4', '5'],
|
||||
title: {
|
||||
text: 'Experiment No.'
|
||||
}
|
||||
},
|
||||
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Observations'
|
||||
},
|
||||
plotLines: [{
|
||||
value: 932,
|
||||
color: 'red',
|
||||
width: 1,
|
||||
label: {
|
||||
text: 'Theoretical mean: 932',
|
||||
align: 'center',
|
||||
style: {
|
||||
color: 'gray'
|
||||
}
|
||||
}
|
||||
}]
|
||||
},
|
||||
|
||||
series: [{
|
||||
name: 'Observations',
|
||||
data: [
|
||||
[760, 801, 848, 895, 965],
|
||||
[733, 853, 939, 980, 1080],
|
||||
[714, 762, 817, 870, 918],
|
||||
[724, 802, 806, 871, 950],
|
||||
[834, 836, 864, 882, 910]
|
||||
],
|
||||
tooltip: {
|
||||
headerFormat: '<em>Experiment No {point.key}</em><br/>'
|
||||
}
|
||||
}, {
|
||||
name: 'Outlier',
|
||||
color: Highcharts.getOptions().colors[0],
|
||||
type: 'scatter',
|
||||
data: [ // x, y positions where 0 is the first category
|
||||
[0, 644],
|
||||
[4, 718],
|
||||
[4, 951],
|
||||
[4, 969]
|
||||
],
|
||||
marker: {
|
||||
fillColor: 'white',
|
||||
lineWidth: 1,
|
||||
lineColor: Highcharts.getOptions().colors[0]
|
||||
},
|
||||
tooltip: {
|
||||
pointFormat: 'Observation: {point.y}'
|
||||
}
|
||||
}]
|
||||
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/highcharts-more.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="height: 400px; margin: auto; min-width: 310px; max-width: 600px"></div>
|
||||
</body>
|
||||
</html>
|
||||
98
lib/highcharts/examples/bubble-3d/index.htm
Normal file
98
lib/highcharts/examples/bubble-3d/index.htm
Normal file
@ -0,0 +1,98 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
|
||||
chart: {
|
||||
type: 'bubble',
|
||||
plotBorderWidth: 1,
|
||||
zoomType: 'xy'
|
||||
},
|
||||
|
||||
title: {
|
||||
text: 'Highcharts bubbles with radial gradient fill'
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
gridLineWidth: 1
|
||||
},
|
||||
|
||||
yAxis: {
|
||||
startOnTick: false,
|
||||
endOnTick: false
|
||||
},
|
||||
|
||||
series: [{
|
||||
data: [
|
||||
[9, 81, 63],
|
||||
[98, 5, 89],
|
||||
[51, 50, 73],
|
||||
[41, 22, 14],
|
||||
[58, 24, 20],
|
||||
[78, 37, 34],
|
||||
[55, 56, 53],
|
||||
[18, 45, 70],
|
||||
[42, 44, 28],
|
||||
[3, 52, 59],
|
||||
[31, 18, 97],
|
||||
[79, 91, 63],
|
||||
[93, 23, 23],
|
||||
[44, 83, 22]
|
||||
],
|
||||
marker: {
|
||||
fillColor: {
|
||||
radialGradient: { cx: 0.4, cy: 0.3, r: 0.7 },
|
||||
stops: [
|
||||
[0, 'rgba(255,255,255,0.5)'],
|
||||
[1, Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0.5).get('rgba')]
|
||||
]
|
||||
}
|
||||
}
|
||||
}, {
|
||||
data: [
|
||||
[42, 38, 20],
|
||||
[6, 18, 1],
|
||||
[1, 93, 55],
|
||||
[57, 2, 90],
|
||||
[80, 76, 22],
|
||||
[11, 74, 96],
|
||||
[88, 56, 10],
|
||||
[30, 47, 49],
|
||||
[57, 62, 98],
|
||||
[4, 16, 16],
|
||||
[46, 10, 11],
|
||||
[22, 87, 89],
|
||||
[57, 91, 82],
|
||||
[45, 15, 98]
|
||||
],
|
||||
marker: {
|
||||
fillColor: {
|
||||
radialGradient: { cx: 0.4, cy: 0.3, r: 0.7 },
|
||||
stops: [
|
||||
[0, 'rgba(255,255,255,0.5)'],
|
||||
[1, Highcharts.Color(Highcharts.getOptions().colors[1]).setOpacity(0.5).get('rgba')]
|
||||
]
|
||||
}
|
||||
}
|
||||
}]
|
||||
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/highcharts-more.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; max-width: 600px; height: 400px; margin: 0 auto;"></div>
|
||||
</body>
|
||||
</html>
|
||||
139
lib/highcharts/examples/bubble/index.htm
Normal file
139
lib/highcharts/examples/bubble/index.htm
Normal file
@ -0,0 +1,139 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
.highcharts-tooltip h3 {
|
||||
margin: 0.3em 0;
|
||||
}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
|
||||
chart: {
|
||||
type: 'bubble',
|
||||
plotBorderWidth: 1,
|
||||
zoomType: 'xy'
|
||||
},
|
||||
|
||||
legend: {
|
||||
enabled: false
|
||||
},
|
||||
|
||||
title: {
|
||||
text: 'Sugar and fat intake per country'
|
||||
},
|
||||
|
||||
subtitle: {
|
||||
text: 'Source: <a href="http://www.euromonitor.com/">Euromonitor</a> and <a href="https://data.oecd.org/">OECD</a>'
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
gridLineWidth: 1,
|
||||
title: {
|
||||
text: 'Daily fat intake'
|
||||
},
|
||||
labels: {
|
||||
format: '{value} gr'
|
||||
},
|
||||
plotLines: [{
|
||||
color: 'black',
|
||||
dashStyle: 'dot',
|
||||
width: 2,
|
||||
value: 65,
|
||||
label: {
|
||||
align: 'middle',
|
||||
rotation: 0,
|
||||
y: 15,
|
||||
style: {
|
||||
fontStyle: 'italic'
|
||||
},
|
||||
text: 'Safe fat intake 65g/day'
|
||||
},
|
||||
zIndex: 3
|
||||
}]
|
||||
},
|
||||
|
||||
yAxis: {
|
||||
startOnTick: false,
|
||||
endOnTick: false,
|
||||
title: {
|
||||
text: 'Daily sugar intake'
|
||||
},
|
||||
labels: {
|
||||
format: '{value} gr'
|
||||
},
|
||||
maxPadding: 0.2,
|
||||
plotLines: [{
|
||||
color: 'black',
|
||||
dashStyle: 'dot',
|
||||
width: 2,
|
||||
value: 50,
|
||||
label: {
|
||||
align: 'right',
|
||||
style: {
|
||||
fontStyle: 'italic'
|
||||
},
|
||||
text: 'Safe sugar intake 50g/day',
|
||||
x: -10
|
||||
},
|
||||
zIndex: 3
|
||||
}]
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
useHTML: true,
|
||||
headerFormat: '<table>',
|
||||
pointFormat: '<tr><th colspan="2"><h3>{point.country}</h3></th></tr>' +
|
||||
'<tr><th>Fat intake:</th><td>{point.x}g</td></tr>' +
|
||||
'<tr><th>Sugar intake:</th><td>{point.y}g</td></tr>' +
|
||||
'<tr><th>Obesity (adults):</th><td>{point.z}%</td></tr>',
|
||||
footerFormat: '</table>',
|
||||
followPointer: true
|
||||
},
|
||||
|
||||
plotOptions: {
|
||||
series: {
|
||||
dataLabels: {
|
||||
enabled: true,
|
||||
format: '{point.name}'
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
series: [{
|
||||
data: [
|
||||
{x: 95, y: 95, z: 13.8, name: 'BE', country: 'Belgium'},
|
||||
{x: 86.5, y: 102.9, z: 14.7, name: 'DE', country: 'Germany'},
|
||||
{x: 80.8, y: 91.5, z: 15.8, name: 'FI', country: 'Finland'},
|
||||
{x: 80.4, y: 102.5, z: 12, name: 'NL', country: 'Netherlands'},
|
||||
{x: 80.3, y: 86.1, z: 11.8, name: 'SE', country: 'Sweden'},
|
||||
{x: 78.4, y: 70.1, z: 16.6, name: 'ES', country: 'Spain'},
|
||||
{x: 74.2, y: 68.5, z: 14.5, name: 'FR', country: 'France'},
|
||||
{x: 73.5, y: 83.1, z: 10, name: 'NO', country: 'Norway'},
|
||||
{x: 71, y: 93.2, z: 24.7, name: 'UK', country: 'United Kingdom'},
|
||||
{x: 69.2, y: 57.6, z: 10.4, name: 'IT', country: 'Italy'},
|
||||
{x: 68.6, y: 20, z: 16, name: 'RU', country: 'Russia'},
|
||||
{x: 65.5, y: 126.4, z: 35.3, name: 'US', country: 'United States'},
|
||||
{x: 65.4, y: 50.8, z: 28.5, name: 'HU', country: 'Hungary'},
|
||||
{x: 63.4, y: 51.8, z: 15.4, name: 'PT', country: 'Portugal'},
|
||||
{x: 64, y: 82.9, z: 31.3, name: 'NZ', country: 'New Zealand'}
|
||||
]
|
||||
}]
|
||||
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/highcharts-more.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="height: 400px; min-width: 310px; max-width: 600px; margin: 0 auto"></div>
|
||||
</body>
|
||||
</html>
|
||||
88
lib/highcharts/examples/column-basic/index.htm
Normal file
88
lib/highcharts/examples/column-basic/index.htm
Normal file
@ -0,0 +1,88 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'column'
|
||||
},
|
||||
title: {
|
||||
text: 'Monthly Average Rainfall'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Source: WorldClimate.com'
|
||||
},
|
||||
xAxis: {
|
||||
categories: [
|
||||
'Jan',
|
||||
'Feb',
|
||||
'Mar',
|
||||
'Apr',
|
||||
'May',
|
||||
'Jun',
|
||||
'Jul',
|
||||
'Aug',
|
||||
'Sep',
|
||||
'Oct',
|
||||
'Nov',
|
||||
'Dec'
|
||||
],
|
||||
crosshair: true
|
||||
},
|
||||
yAxis: {
|
||||
min: 0,
|
||||
title: {
|
||||
text: 'Rainfall (mm)'
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
|
||||
pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
|
||||
'<td style="padding:0"><b>{point.y:.1f} mm</b></td></tr>',
|
||||
footerFormat: '</table>',
|
||||
shared: true,
|
||||
useHTML: true
|
||||
},
|
||||
plotOptions: {
|
||||
column: {
|
||||
pointPadding: 0.2,
|
||||
borderWidth: 0
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: 'Tokyo',
|
||||
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]
|
||||
|
||||
}, {
|
||||
name: 'New York',
|
||||
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]
|
||||
|
||||
}, {
|
||||
name: 'London',
|
||||
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]
|
||||
|
||||
}, {
|
||||
name: 'Berlin',
|
||||
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]
|
||||
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
275
lib/highcharts/examples/column-drilldown/index.htm
Normal file
275
lib/highcharts/examples/column-drilldown/index.htm
Normal file
@ -0,0 +1,275 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
// Create the chart
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'column'
|
||||
},
|
||||
title: {
|
||||
text: 'Browser market shares. January, 2015 to May, 2015'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Click the columns to view versions. Source: <a href="http://netmarketshare.com">netmarketshare.com</a>.'
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category'
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Total percent market share'
|
||||
}
|
||||
|
||||
},
|
||||
legend: {
|
||||
enabled: false
|
||||
},
|
||||
plotOptions: {
|
||||
series: {
|
||||
borderWidth: 0,
|
||||
dataLabels: {
|
||||
enabled: true,
|
||||
format: '{point.y:.1f}%'
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
|
||||
pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.2f}%</b> of total<br/>'
|
||||
},
|
||||
|
||||
series: [{
|
||||
name: "Brands",
|
||||
colorByPoint: true,
|
||||
data: [{
|
||||
name: "Microsoft Internet Explorer",
|
||||
y: 56.33,
|
||||
drilldown: "Microsoft Internet Explorer"
|
||||
}, {
|
||||
name: "Chrome",
|
||||
y: 24.03,
|
||||
drilldown: "Chrome"
|
||||
}, {
|
||||
name: "Firefox",
|
||||
y: 10.38,
|
||||
drilldown: "Firefox"
|
||||
}, {
|
||||
name: "Safari",
|
||||
y: 4.77,
|
||||
drilldown: "Safari"
|
||||
}, {
|
||||
name: "Opera",
|
||||
y: 0.91,
|
||||
drilldown: "Opera"
|
||||
}, {
|
||||
name: "Proprietary or Undetectable",
|
||||
y: 0.2,
|
||||
drilldown: null
|
||||
}]
|
||||
}],
|
||||
drilldown: {
|
||||
series: [{
|
||||
name: "Microsoft Internet Explorer",
|
||||
id: "Microsoft Internet Explorer",
|
||||
data: [
|
||||
[
|
||||
"v11.0",
|
||||
24.13
|
||||
],
|
||||
[
|
||||
"v8.0",
|
||||
17.2
|
||||
],
|
||||
[
|
||||
"v9.0",
|
||||
8.11
|
||||
],
|
||||
[
|
||||
"v10.0",
|
||||
5.33
|
||||
],
|
||||
[
|
||||
"v6.0",
|
||||
1.06
|
||||
],
|
||||
[
|
||||
"v7.0",
|
||||
0.5
|
||||
]
|
||||
]
|
||||
}, {
|
||||
name: "Chrome",
|
||||
id: "Chrome",
|
||||
data: [
|
||||
[
|
||||
"v40.0",
|
||||
5
|
||||
],
|
||||
[
|
||||
"v41.0",
|
||||
4.32
|
||||
],
|
||||
[
|
||||
"v42.0",
|
||||
3.68
|
||||
],
|
||||
[
|
||||
"v39.0",
|
||||
2.96
|
||||
],
|
||||
[
|
||||
"v36.0",
|
||||
2.53
|
||||
],
|
||||
[
|
||||
"v43.0",
|
||||
1.45
|
||||
],
|
||||
[
|
||||
"v31.0",
|
||||
1.24
|
||||
],
|
||||
[
|
||||
"v35.0",
|
||||
0.85
|
||||
],
|
||||
[
|
||||
"v38.0",
|
||||
0.6
|
||||
],
|
||||
[
|
||||
"v32.0",
|
||||
0.55
|
||||
],
|
||||
[
|
||||
"v37.0",
|
||||
0.38
|
||||
],
|
||||
[
|
||||
"v33.0",
|
||||
0.19
|
||||
],
|
||||
[
|
||||
"v34.0",
|
||||
0.14
|
||||
],
|
||||
[
|
||||
"v30.0",
|
||||
0.14
|
||||
]
|
||||
]
|
||||
}, {
|
||||
name: "Firefox",
|
||||
id: "Firefox",
|
||||
data: [
|
||||
[
|
||||
"v35",
|
||||
2.76
|
||||
],
|
||||
[
|
||||
"v36",
|
||||
2.32
|
||||
],
|
||||
[
|
||||
"v37",
|
||||
2.31
|
||||
],
|
||||
[
|
||||
"v34",
|
||||
1.27
|
||||
],
|
||||
[
|
||||
"v38",
|
||||
1.02
|
||||
],
|
||||
[
|
||||
"v31",
|
||||
0.33
|
||||
],
|
||||
[
|
||||
"v33",
|
||||
0.22
|
||||
],
|
||||
[
|
||||
"v32",
|
||||
0.15
|
||||
]
|
||||
]
|
||||
}, {
|
||||
name: "Safari",
|
||||
id: "Safari",
|
||||
data: [
|
||||
[
|
||||
"v8.0",
|
||||
2.56
|
||||
],
|
||||
[
|
||||
"v7.1",
|
||||
0.77
|
||||
],
|
||||
[
|
||||
"v5.1",
|
||||
0.42
|
||||
],
|
||||
[
|
||||
"v5.0",
|
||||
0.3
|
||||
],
|
||||
[
|
||||
"v6.1",
|
||||
0.29
|
||||
],
|
||||
[
|
||||
"v7.0",
|
||||
0.26
|
||||
],
|
||||
[
|
||||
"v6.2",
|
||||
0.17
|
||||
]
|
||||
]
|
||||
}, {
|
||||
name: "Opera",
|
||||
id: "Opera",
|
||||
data: [
|
||||
[
|
||||
"v12.x",
|
||||
0.34
|
||||
],
|
||||
[
|
||||
"v28",
|
||||
0.24
|
||||
],
|
||||
[
|
||||
"v27",
|
||||
0.17
|
||||
],
|
||||
[
|
||||
"v29",
|
||||
0.16
|
||||
]
|
||||
]
|
||||
}]
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/data.js"></script>
|
||||
<script src="../../js/modules/drilldown.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
</body>
|
||||
</html>
|
||||
47
lib/highcharts/examples/column-negative/index.htm
Normal file
47
lib/highcharts/examples/column-negative/index.htm
Normal file
@ -0,0 +1,47 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'column'
|
||||
},
|
||||
title: {
|
||||
text: 'Column chart with negative values'
|
||||
},
|
||||
xAxis: {
|
||||
categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas']
|
||||
},
|
||||
credits: {
|
||||
enabled: false
|
||||
},
|
||||
series: [{
|
||||
name: 'John',
|
||||
data: [5, 3, 4, 7, 2]
|
||||
}, {
|
||||
name: 'Jane',
|
||||
data: [2, -2, -3, 2, 1]
|
||||
}, {
|
||||
name: 'Joe',
|
||||
data: [3, 4, 4, -2, 5]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
83
lib/highcharts/examples/column-parsed/index.htm
Normal file
83
lib/highcharts/examples/column-parsed/index.htm
Normal file
@ -0,0 +1,83 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
data: {
|
||||
table: 'datatable'
|
||||
},
|
||||
chart: {
|
||||
type: 'column'
|
||||
},
|
||||
title: {
|
||||
text: 'Data extracted from a HTML table in the page'
|
||||
},
|
||||
yAxis: {
|
||||
allowDecimals: false,
|
||||
title: {
|
||||
text: 'Units'
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
formatter: function () {
|
||||
return '<b>' + this.series.name + '</b><br/>' +
|
||||
this.point.y + ' ' + this.point.name.toLowerCase();
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/data.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
<table id="datatable">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th>Jane</th>
|
||||
<th>John</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>Apples</th>
|
||||
<td>3</td>
|
||||
<td>4</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Pears</th>
|
||||
<td>2</td>
|
||||
<td>0</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Plums</th>
|
||||
<td>5</td>
|
||||
<td>11</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Bananas</th>
|
||||
<td>1</td>
|
||||
<td>1</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Oranges</th>
|
||||
<td>2</td>
|
||||
<td>4</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
97
lib/highcharts/examples/column-placement/index.htm
Normal file
97
lib/highcharts/examples/column-placement/index.htm
Normal file
@ -0,0 +1,97 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'column'
|
||||
},
|
||||
title: {
|
||||
text: 'Efficiency Optimization by Branch'
|
||||
},
|
||||
xAxis: {
|
||||
categories: [
|
||||
'Seattle HQ',
|
||||
'San Francisco',
|
||||
'Tokyo'
|
||||
]
|
||||
},
|
||||
yAxis: [{
|
||||
min: 0,
|
||||
title: {
|
||||
text: 'Employees'
|
||||
}
|
||||
}, {
|
||||
title: {
|
||||
text: 'Profit (millions)'
|
||||
},
|
||||
opposite: true
|
||||
}],
|
||||
legend: {
|
||||
shadow: false
|
||||
},
|
||||
tooltip: {
|
||||
shared: true
|
||||
},
|
||||
plotOptions: {
|
||||
column: {
|
||||
grouping: false,
|
||||
shadow: false,
|
||||
borderWidth: 0
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: 'Employees',
|
||||
color: 'rgba(165,170,217,1)',
|
||||
data: [150, 73, 20],
|
||||
pointPadding: 0.3,
|
||||
pointPlacement: -0.2
|
||||
}, {
|
||||
name: 'Employees Optimized',
|
||||
color: 'rgba(126,86,134,.9)',
|
||||
data: [140, 90, 40],
|
||||
pointPadding: 0.4,
|
||||
pointPlacement: -0.2
|
||||
}, {
|
||||
name: 'Profit',
|
||||
color: 'rgba(248,161,63,1)',
|
||||
data: [183.6, 178.8, 198.5],
|
||||
tooltip: {
|
||||
valuePrefix: '$',
|
||||
valueSuffix: ' M'
|
||||
},
|
||||
pointPadding: 0.3,
|
||||
pointPlacement: 0.2,
|
||||
yAxis: 1
|
||||
}, {
|
||||
name: 'Profit Optimized',
|
||||
color: 'rgba(186,60,61,.9)',
|
||||
data: [203.6, 198.8, 208.5],
|
||||
tooltip: {
|
||||
valuePrefix: '$',
|
||||
valueSuffix: ' M'
|
||||
},
|
||||
pointPadding: 0.4,
|
||||
pointPlacement: 0.2,
|
||||
yAxis: 1
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
93
lib/highcharts/examples/column-rotated-labels/index.htm
Normal file
93
lib/highcharts/examples/column-rotated-labels/index.htm
Normal file
@ -0,0 +1,93 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'column'
|
||||
},
|
||||
title: {
|
||||
text: 'World\'s largest cities per 2014'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Source: <a href="http://en.wikipedia.org/wiki/List_of_cities_proper_by_population">Wikipedia</a>'
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
labels: {
|
||||
rotation: -45,
|
||||
style: {
|
||||
fontSize: '13px',
|
||||
fontFamily: 'Verdana, sans-serif'
|
||||
}
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
min: 0,
|
||||
title: {
|
||||
text: 'Population (millions)'
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
enabled: false
|
||||
},
|
||||
tooltip: {
|
||||
pointFormat: 'Population in 2008: <b>{point.y:.1f} millions</b>'
|
||||
},
|
||||
series: [{
|
||||
name: 'Population',
|
||||
data: [
|
||||
['Shanghai', 23.7],
|
||||
['Lagos', 16.1],
|
||||
['Instanbul', 14.2],
|
||||
['Karachi', 14.0],
|
||||
['Mumbai', 12.5],
|
||||
['Moscow', 12.1],
|
||||
['São Paulo', 11.8],
|
||||
['Beijing', 11.7],
|
||||
['Guangzhou', 11.1],
|
||||
['Delhi', 11.1],
|
||||
['Shenzhen', 10.5],
|
||||
['Seoul', 10.4],
|
||||
['Jakarta', 10.0],
|
||||
['Kinshasa', 9.3],
|
||||
['Tianjin', 9.3],
|
||||
['Tokyo', 9.0],
|
||||
['Cairo', 8.9],
|
||||
['Dhaka', 8.9],
|
||||
['Mexico City', 8.9],
|
||||
['Lima', 8.9]
|
||||
],
|
||||
dataLabels: {
|
||||
enabled: true,
|
||||
rotation: -90,
|
||||
color: '#FFFFFF',
|
||||
align: 'right',
|
||||
format: '{point.y:.1f}', // one decimal
|
||||
y: 10, // 10 pixels down from the top
|
||||
style: {
|
||||
fontSize: '13px',
|
||||
fontFamily: 'Verdana, sans-serif'
|
||||
}
|
||||
}
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 300px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
77
lib/highcharts/examples/column-stacked-and-grouped/index.htm
Normal file
77
lib/highcharts/examples/column-stacked-and-grouped/index.htm
Normal file
@ -0,0 +1,77 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
|
||||
chart: {
|
||||
type: 'column'
|
||||
},
|
||||
|
||||
title: {
|
||||
text: 'Total fruit consumtion, grouped by gender'
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas']
|
||||
},
|
||||
|
||||
yAxis: {
|
||||
allowDecimals: false,
|
||||
min: 0,
|
||||
title: {
|
||||
text: 'Number of fruits'
|
||||
}
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
formatter: function () {
|
||||
return '<b>' + this.x + '</b><br/>' +
|
||||
this.series.name + ': ' + this.y + '<br/>' +
|
||||
'Total: ' + this.point.stackTotal;
|
||||
}
|
||||
},
|
||||
|
||||
plotOptions: {
|
||||
column: {
|
||||
stacking: 'normal'
|
||||
}
|
||||
},
|
||||
|
||||
series: [{
|
||||
name: 'John',
|
||||
data: [5, 3, 4, 7, 2],
|
||||
stack: 'male'
|
||||
}, {
|
||||
name: 'Joe',
|
||||
data: [3, 4, 4, 2, 5],
|
||||
stack: 'male'
|
||||
}, {
|
||||
name: 'Jane',
|
||||
data: [2, 5, 6, 2, 1],
|
||||
stack: 'female'
|
||||
}, {
|
||||
name: 'Janet',
|
||||
data: [3, 0, 4, 4, 3],
|
||||
stack: 'female'
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
59
lib/highcharts/examples/column-stacked-percent/index.htm
Normal file
59
lib/highcharts/examples/column-stacked-percent/index.htm
Normal file
@ -0,0 +1,59 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'column'
|
||||
},
|
||||
title: {
|
||||
text: 'Stacked column chart'
|
||||
},
|
||||
xAxis: {
|
||||
categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas']
|
||||
},
|
||||
yAxis: {
|
||||
min: 0,
|
||||
title: {
|
||||
text: 'Total fruit consumption'
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b> ({point.percentage:.0f}%)<br/>',
|
||||
shared: true
|
||||
},
|
||||
plotOptions: {
|
||||
column: {
|
||||
stacking: 'percent'
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: 'John',
|
||||
data: [5, 3, 4, 7, 2]
|
||||
}, {
|
||||
name: 'Jane',
|
||||
data: [2, 2, 3, 2, 1]
|
||||
}, {
|
||||
name: 'Joe',
|
||||
data: [3, 4, 4, 2, 5]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
84
lib/highcharts/examples/column-stacked/index.htm
Normal file
84
lib/highcharts/examples/column-stacked/index.htm
Normal file
@ -0,0 +1,84 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'column'
|
||||
},
|
||||
title: {
|
||||
text: 'Stacked column chart'
|
||||
},
|
||||
xAxis: {
|
||||
categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas']
|
||||
},
|
||||
yAxis: {
|
||||
min: 0,
|
||||
title: {
|
||||
text: 'Total fruit consumption'
|
||||
},
|
||||
stackLabels: {
|
||||
enabled: true,
|
||||
style: {
|
||||
fontWeight: 'bold',
|
||||
color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
|
||||
}
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
align: 'right',
|
||||
x: -30,
|
||||
verticalAlign: 'top',
|
||||
y: 25,
|
||||
floating: true,
|
||||
backgroundColor: (Highcharts.theme && Highcharts.theme.background2) || 'white',
|
||||
borderColor: '#CCC',
|
||||
borderWidth: 1,
|
||||
shadow: false
|
||||
},
|
||||
tooltip: {
|
||||
headerFormat: '<b>{point.x}</b><br/>',
|
||||
pointFormat: '{series.name}: {point.y}<br/>Total: {point.stackTotal}'
|
||||
},
|
||||
plotOptions: {
|
||||
column: {
|
||||
stacking: 'normal',
|
||||
dataLabels: {
|
||||
enabled: true,
|
||||
color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white',
|
||||
style: {
|
||||
textShadow: '0 0 3px black'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: 'John',
|
||||
data: [5, 3, 4, 7, 2]
|
||||
}, {
|
||||
name: 'Jane',
|
||||
data: [2, 2, 3, 2, 1]
|
||||
}, {
|
||||
name: 'Joe',
|
||||
data: [3, 4, 4, 2, 5]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
89
lib/highcharts/examples/columnrange/index.htm
Normal file
89
lib/highcharts/examples/columnrange/index.htm
Normal file
@ -0,0 +1,89 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
|
||||
$('#container').highcharts({
|
||||
|
||||
chart: {
|
||||
type: 'columnrange',
|
||||
inverted: true
|
||||
},
|
||||
|
||||
title: {
|
||||
text: 'Temperature variation by month'
|
||||
},
|
||||
|
||||
subtitle: {
|
||||
text: 'Observed in Vik i Sogn, Norway'
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
|
||||
},
|
||||
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Temperature ( °C )'
|
||||
}
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
valueSuffix: '°C'
|
||||
},
|
||||
|
||||
plotOptions: {
|
||||
columnrange: {
|
||||
dataLabels: {
|
||||
enabled: true,
|
||||
formatter: function () {
|
||||
return this.y + '°C';
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
legend: {
|
||||
enabled: false
|
||||
},
|
||||
|
||||
series: [{
|
||||
name: 'Temperatures',
|
||||
data: [
|
||||
[-9.7, 9.4],
|
||||
[-8.7, 6.5],
|
||||
[-3.5, 9.4],
|
||||
[-1.4, 19.9],
|
||||
[0.0, 22.6],
|
||||
[2.9, 29.5],
|
||||
[9.2, 30.7],
|
||||
[7.3, 26.5],
|
||||
[4.4, 18.0],
|
||||
[-3.1, 11.4],
|
||||
[-5.2, 10.4],
|
||||
[-13.5, 9.8]
|
||||
]
|
||||
}]
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/highcharts-more.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
96
lib/highcharts/examples/combo-dual-axes/index.htm
Normal file
96
lib/highcharts/examples/combo-dual-axes/index.htm
Normal file
@ -0,0 +1,96 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
zoomType: 'xy'
|
||||
},
|
||||
title: {
|
||||
text: 'Average Monthly Temperature and Rainfall in Tokyo'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Source: WorldClimate.com'
|
||||
},
|
||||
xAxis: [{
|
||||
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
|
||||
'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
|
||||
crosshair: true
|
||||
}],
|
||||
yAxis: [{ // Primary yAxis
|
||||
labels: {
|
||||
format: '{value}°C',
|
||||
style: {
|
||||
color: Highcharts.getOptions().colors[1]
|
||||
}
|
||||
},
|
||||
title: {
|
||||
text: 'Temperature',
|
||||
style: {
|
||||
color: Highcharts.getOptions().colors[1]
|
||||
}
|
||||
}
|
||||
}, { // Secondary yAxis
|
||||
title: {
|
||||
text: 'Rainfall',
|
||||
style: {
|
||||
color: Highcharts.getOptions().colors[0]
|
||||
}
|
||||
},
|
||||
labels: {
|
||||
format: '{value} mm',
|
||||
style: {
|
||||
color: Highcharts.getOptions().colors[0]
|
||||
}
|
||||
},
|
||||
opposite: true
|
||||
}],
|
||||
tooltip: {
|
||||
shared: true
|
||||
},
|
||||
legend: {
|
||||
layout: 'vertical',
|
||||
align: 'left',
|
||||
x: 120,
|
||||
verticalAlign: 'top',
|
||||
y: 100,
|
||||
floating: true,
|
||||
backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'
|
||||
},
|
||||
series: [{
|
||||
name: 'Rainfall',
|
||||
type: 'column',
|
||||
yAxis: 1,
|
||||
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],
|
||||
tooltip: {
|
||||
valueSuffix: ' mm'
|
||||
}
|
||||
|
||||
}, {
|
||||
name: 'Temperature',
|
||||
type: 'spline',
|
||||
data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6],
|
||||
tooltip: {
|
||||
valueSuffix: '°C'
|
||||
}
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
791
lib/highcharts/examples/combo-meteogram/index.htm
Normal file
791
lib/highcharts/examples/combo-meteogram/index.htm
Normal file
@ -0,0 +1,791 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
/**
|
||||
* This is a complex demo of how to set up a Highcharts chart, coupled to a
|
||||
* dynamic source and extended by drawing image sprites, wind arrow paths
|
||||
* and a second grid on top of the chart. The purpose of the demo is to inpire
|
||||
* developers to go beyond the basic chart types and show how the library can
|
||||
* be extended programmatically. This is what the demo does:
|
||||
*
|
||||
* - Loads weather forecast from www.yr.no in form of an XML service. The XML
|
||||
* is translated on the Higcharts website into JSONP for the sake of the demo
|
||||
* being shown on both our website and JSFiddle.
|
||||
* - When the data arrives async, a Meteogram instance is created. We have
|
||||
* created the Meteogram prototype to provide an organized structure of the different
|
||||
* methods and subroutines associated with the demo.
|
||||
* - The parseYrData method parses the data from www.yr.no into several parallel arrays. These
|
||||
* arrays are used directly as the data option for temperature, precipitation
|
||||
* and air pressure. As the temperature data gives only full degrees, we apply
|
||||
* some smoothing on the graph, but keep the original data in the tooltip.
|
||||
* - After this, the options structure is build, and the chart generated with the
|
||||
* parsed data.
|
||||
* - In the callback (on chart load), we weather icons on top of the temperature series.
|
||||
* The icons are sprites from a single PNG image, placed inside a clipped 30x30
|
||||
* SVG <g> element. VML interprets this as HTML images inside a clipped div.
|
||||
* - Lastly, the wind arrows are built and added below the plot area, and a grid is
|
||||
* drawn around them. The wind arrows are basically drawn north-south, then rotated
|
||||
* as per the wind direction.
|
||||
*/
|
||||
|
||||
function Meteogram(xml, container) {
|
||||
// Parallel arrays for the chart data, these are populated as the XML/JSON file
|
||||
// is loaded
|
||||
this.symbols = [];
|
||||
this.symbolNames = [];
|
||||
this.precipitations = [];
|
||||
this.windDirections = [];
|
||||
this.windDirectionNames = [];
|
||||
this.windSpeeds = [];
|
||||
this.windSpeedNames = [];
|
||||
this.temperatures = [];
|
||||
this.pressures = [];
|
||||
|
||||
// Initialize
|
||||
this.xml = xml;
|
||||
this.container = container;
|
||||
|
||||
// Run
|
||||
this.parseYrData();
|
||||
}
|
||||
/**
|
||||
* Return weather symbol sprites as laid out at http://om.yr.no/forklaring/symbol/
|
||||
*/
|
||||
Meteogram.prototype.getSymbolSprites = function (symbolSize) {
|
||||
return {
|
||||
'01d': {
|
||||
x: 0,
|
||||
y: 0
|
||||
},
|
||||
'01n': {
|
||||
x: symbolSize,
|
||||
y: 0
|
||||
},
|
||||
'16': {
|
||||
x: 2 * symbolSize,
|
||||
y: 0
|
||||
},
|
||||
'02d': {
|
||||
x: 0,
|
||||
y: symbolSize
|
||||
},
|
||||
'02n': {
|
||||
x: symbolSize,
|
||||
y: symbolSize
|
||||
},
|
||||
'03d': {
|
||||
x: 0,
|
||||
y: 2 * symbolSize
|
||||
},
|
||||
'03n': {
|
||||
x: symbolSize,
|
||||
y: 2 * symbolSize
|
||||
},
|
||||
'17': {
|
||||
x: 2 * symbolSize,
|
||||
y: 2 * symbolSize
|
||||
},
|
||||
'04': {
|
||||
x: 0,
|
||||
y: 3 * symbolSize
|
||||
},
|
||||
'05d': {
|
||||
x: 0,
|
||||
y: 4 * symbolSize
|
||||
},
|
||||
'05n': {
|
||||
x: symbolSize,
|
||||
y: 4 * symbolSize
|
||||
},
|
||||
'18': {
|
||||
x: 2 * symbolSize,
|
||||
y: 4 * symbolSize
|
||||
},
|
||||
'06d': {
|
||||
x: 0,
|
||||
y: 5 * symbolSize
|
||||
},
|
||||
'06n': {
|
||||
x: symbolSize,
|
||||
y: 5 * symbolSize
|
||||
},
|
||||
'07d': {
|
||||
x: 0,
|
||||
y: 6 * symbolSize
|
||||
},
|
||||
'07n': {
|
||||
x: symbolSize,
|
||||
y: 6 * symbolSize
|
||||
},
|
||||
'08d': {
|
||||
x: 0,
|
||||
y: 7 * symbolSize
|
||||
},
|
||||
'08n': {
|
||||
x: symbolSize,
|
||||
y: 7 * symbolSize
|
||||
},
|
||||
'19': {
|
||||
x: 2 * symbolSize,
|
||||
y: 7 * symbolSize
|
||||
},
|
||||
'09': {
|
||||
x: 0,
|
||||
y: 8 * symbolSize
|
||||
},
|
||||
'10': {
|
||||
x: 0,
|
||||
y: 9 * symbolSize
|
||||
},
|
||||
'11': {
|
||||
x: 0,
|
||||
y: 10 * symbolSize
|
||||
},
|
||||
'12': {
|
||||
x: 0,
|
||||
y: 11 * symbolSize
|
||||
},
|
||||
'13': {
|
||||
x: 0,
|
||||
y: 12 * symbolSize
|
||||
},
|
||||
'14': {
|
||||
x: 0,
|
||||
y: 13 * symbolSize
|
||||
},
|
||||
'15': {
|
||||
x: 0,
|
||||
y: 14 * symbolSize
|
||||
},
|
||||
'20d': {
|
||||
x: 0,
|
||||
y: 15 * symbolSize
|
||||
},
|
||||
'20n': {
|
||||
x: symbolSize,
|
||||
y: 15 * symbolSize
|
||||
},
|
||||
'20m': {
|
||||
x: 2 * symbolSize,
|
||||
y: 15 * symbolSize
|
||||
},
|
||||
'21d': {
|
||||
x: 0,
|
||||
y: 16 * symbolSize
|
||||
},
|
||||
'21n': {
|
||||
x: symbolSize,
|
||||
y: 16 * symbolSize
|
||||
},
|
||||
'21m': {
|
||||
x: 2 * symbolSize,
|
||||
y: 16 * symbolSize
|
||||
},
|
||||
'22': {
|
||||
x: 0,
|
||||
y: 17 * symbolSize
|
||||
},
|
||||
'23': {
|
||||
x: 0,
|
||||
y: 18 * symbolSize
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* Function to smooth the temperature line. The original data provides only whole degrees,
|
||||
* which makes the line graph look jagged. So we apply a running mean on it, but preserve
|
||||
* the unaltered value in the tooltip.
|
||||
*/
|
||||
Meteogram.prototype.smoothLine = function (data) {
|
||||
var i = data.length,
|
||||
sum,
|
||||
value;
|
||||
|
||||
while (i--) {
|
||||
data[i].value = value = data[i].y; // preserve value for tooltip
|
||||
|
||||
// Set the smoothed value to the average of the closest points, but don't allow
|
||||
// it to differ more than 0.5 degrees from the given value
|
||||
sum = (data[i - 1] || data[i]).y + value + (data[i + 1] || data[i]).y;
|
||||
data[i].y = Math.max(value - 0.5, Math.min(sum / 3, value + 0.5));
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Callback function that is called from Highcharts on hovering each point and returns
|
||||
* HTML for the tooltip.
|
||||
*/
|
||||
Meteogram.prototype.tooltipFormatter = function (tooltip) {
|
||||
|
||||
// Create the header with reference to the time interval
|
||||
var index = tooltip.points[0].point.index,
|
||||
ret = '<small>' + Highcharts.dateFormat('%A, %b %e, %H:%M', tooltip.x) + '-' +
|
||||
Highcharts.dateFormat('%H:%M', tooltip.points[0].point.to) + '</small><br>';
|
||||
|
||||
// Symbol text
|
||||
ret += '<b>' + this.symbolNames[index] + '</b>';
|
||||
|
||||
ret += '<table>';
|
||||
|
||||
// Add all series
|
||||
Highcharts.each(tooltip.points, function (point) {
|
||||
var series = point.series;
|
||||
ret += '<tr><td><span style="color:' + series.color + '">\u25CF</span> ' + series.name +
|
||||
': </td><td style="white-space:nowrap">' + Highcharts.pick(point.point.value, point.y) +
|
||||
series.options.tooltip.valueSuffix + '</td></tr>';
|
||||
});
|
||||
|
||||
// Add wind
|
||||
ret += '<tr><td style="vertical-align: top">\u25CF Wind</td><td style="white-space:nowrap">' + this.windDirectionNames[index] +
|
||||
'<br>' + this.windSpeedNames[index] + ' (' +
|
||||
Highcharts.numberFormat(this.windSpeeds[index], 1) + ' m/s)</td></tr>';
|
||||
|
||||
// Close
|
||||
ret += '</table>';
|
||||
|
||||
|
||||
return ret;
|
||||
};
|
||||
|
||||
/**
|
||||
* Draw the weather symbols on top of the temperature series. The symbols are sprites of a single
|
||||
* file, defined in the getSymbolSprites function above.
|
||||
*/
|
||||
Meteogram.prototype.drawWeatherSymbols = function (chart) {
|
||||
var meteogram = this,
|
||||
symbolSprites = this.getSymbolSprites(30);
|
||||
|
||||
$.each(chart.series[0].data, function (i, point) {
|
||||
var sprite,
|
||||
group;
|
||||
|
||||
if (meteogram.resolution > 36e5 || i % 2 === 0) {
|
||||
|
||||
sprite = symbolSprites[meteogram.symbols[i]];
|
||||
if (sprite) {
|
||||
|
||||
// Create a group element that is positioned and clipped at 30 pixels width and height
|
||||
group = chart.renderer.g()
|
||||
.attr({
|
||||
translateX: point.plotX + chart.plotLeft - 15,
|
||||
translateY: point.plotY + chart.plotTop - 30,
|
||||
zIndex: 5
|
||||
})
|
||||
.clip(chart.renderer.clipRect(0, 0, 30, 30))
|
||||
.add();
|
||||
|
||||
// Position the image inside it at the sprite position
|
||||
chart.renderer.image(
|
||||
'http://www.highcharts.com/samples/graphics/meteogram-symbols-30px.png',
|
||||
-sprite.x,
|
||||
-sprite.y,
|
||||
90,
|
||||
570
|
||||
)
|
||||
.add(group);
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* Create wind speed symbols for the Beaufort wind scale. The symbols are rotated
|
||||
* around the zero centerpoint.
|
||||
*/
|
||||
Meteogram.prototype.windArrow = function (name) {
|
||||
var level,
|
||||
path;
|
||||
|
||||
// The stem and the arrow head
|
||||
path = [
|
||||
'M', 0, 7, // base of arrow
|
||||
'L', -1.5, 7,
|
||||
0, 10,
|
||||
1.5, 7,
|
||||
0, 7,
|
||||
0, -10 // top
|
||||
];
|
||||
|
||||
level = $.inArray(name, ['Calm', 'Light air', 'Light breeze', 'Gentle breeze', 'Moderate breeze',
|
||||
'Fresh breeze', 'Strong breeze', 'Near gale', 'Gale', 'Strong gale', 'Storm',
|
||||
'Violent storm', 'Hurricane']);
|
||||
|
||||
if (level === 0) {
|
||||
path = [];
|
||||
}
|
||||
|
||||
if (level === 2) {
|
||||
path.push('M', 0, -8, 'L', 4, -8); // short line
|
||||
} else if (level >= 3) {
|
||||
path.push(0, -10, 7, -10); // long line
|
||||
}
|
||||
|
||||
if (level === 4) {
|
||||
path.push('M', 0, -7, 'L', 4, -7);
|
||||
} else if (level >= 5) {
|
||||
path.push('M', 0, -7, 'L', 7, -7);
|
||||
}
|
||||
|
||||
if (level === 5) {
|
||||
path.push('M', 0, -4, 'L', 4, -4);
|
||||
} else if (level >= 6) {
|
||||
path.push('M', 0, -4, 'L', 7, -4);
|
||||
}
|
||||
|
||||
if (level === 7) {
|
||||
path.push('M', 0, -1, 'L', 4, -1);
|
||||
} else if (level >= 8) {
|
||||
path.push('M', 0, -1, 'L', 7, -1);
|
||||
}
|
||||
|
||||
return path;
|
||||
};
|
||||
|
||||
/**
|
||||
* Draw the wind arrows. Each arrow path is generated by the windArrow function above.
|
||||
*/
|
||||
Meteogram.prototype.drawWindArrows = function (chart) {
|
||||
var meteogram = this;
|
||||
|
||||
$.each(chart.series[0].data, function (i, point) {
|
||||
var sprite, arrow, x, y;
|
||||
|
||||
if (meteogram.resolution > 36e5 || i % 2 === 0) {
|
||||
|
||||
// Draw the wind arrows
|
||||
x = point.plotX + chart.plotLeft + 7;
|
||||
y = 255;
|
||||
if (meteogram.windSpeedNames[i] === 'Calm') {
|
||||
arrow = chart.renderer.circle(x, y, 10).attr({
|
||||
fill: 'none'
|
||||
});
|
||||
} else {
|
||||
arrow = chart.renderer.path(
|
||||
meteogram.windArrow(meteogram.windSpeedNames[i])
|
||||
).attr({
|
||||
rotation: parseInt(meteogram.windDirections[i], 10),
|
||||
translateX: x, // rotation center
|
||||
translateY: y // rotation center
|
||||
});
|
||||
}
|
||||
arrow.attr({
|
||||
stroke: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black',
|
||||
'stroke-width': 1.5,
|
||||
zIndex: 5
|
||||
})
|
||||
.add();
|
||||
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* Draw blocks around wind arrows, below the plot area
|
||||
*/
|
||||
Meteogram.prototype.drawBlocksForWindArrows = function (chart) {
|
||||
var xAxis = chart.xAxis[0],
|
||||
x,
|
||||
pos,
|
||||
max,
|
||||
isLong,
|
||||
isLast,
|
||||
i;
|
||||
|
||||
for (pos = xAxis.min, max = xAxis.max, i = 0; pos <= max + 36e5; pos += 36e5, i += 1) {
|
||||
|
||||
// Get the X position
|
||||
isLast = pos === max + 36e5;
|
||||
x = Math.round(xAxis.toPixels(pos)) + (isLast ? 0.5 : -0.5);
|
||||
|
||||
// Draw the vertical dividers and ticks
|
||||
if (this.resolution > 36e5) {
|
||||
isLong = pos % this.resolution === 0;
|
||||
} else {
|
||||
isLong = i % 2 === 0;
|
||||
}
|
||||
chart.renderer.path(['M', x, chart.plotTop + chart.plotHeight + (isLong ? 0 : 28),
|
||||
'L', x, chart.plotTop + chart.plotHeight + 32, 'Z'])
|
||||
.attr({
|
||||
'stroke': chart.options.chart.plotBorderColor,
|
||||
'stroke-width': 1
|
||||
})
|
||||
.add();
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Get the title based on the XML data
|
||||
*/
|
||||
Meteogram.prototype.getTitle = function () {
|
||||
return 'Meteogram for ' + this.xml.location.name + ', ' + this.xml.location.country;
|
||||
};
|
||||
|
||||
/**
|
||||
* Build and return the Highcharts options structure
|
||||
*/
|
||||
Meteogram.prototype.getChartOptions = function () {
|
||||
var meteogram = this;
|
||||
|
||||
return {
|
||||
chart: {
|
||||
renderTo: this.container,
|
||||
marginBottom: 70,
|
||||
marginRight: 40,
|
||||
marginTop: 50,
|
||||
plotBorderWidth: 1,
|
||||
width: 800,
|
||||
height: 310
|
||||
},
|
||||
|
||||
title: {
|
||||
text: this.getTitle(),
|
||||
align: 'left'
|
||||
},
|
||||
|
||||
credits: {
|
||||
text: 'Forecast from <a href="http://yr.no">yr.no</a>',
|
||||
href: this.xml.credit.link['@attributes'].url,
|
||||
position: {
|
||||
x: -40
|
||||
}
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
shared: true,
|
||||
useHTML: true,
|
||||
formatter: function () {
|
||||
return meteogram.tooltipFormatter(this);
|
||||
}
|
||||
},
|
||||
|
||||
xAxis: [{ // Bottom X axis
|
||||
type: 'datetime',
|
||||
tickInterval: 2 * 36e5, // two hours
|
||||
minorTickInterval: 36e5, // one hour
|
||||
tickLength: 0,
|
||||
gridLineWidth: 1,
|
||||
gridLineColor: (Highcharts.theme && Highcharts.theme.background2) || '#F0F0F0',
|
||||
startOnTick: false,
|
||||
endOnTick: false,
|
||||
minPadding: 0,
|
||||
maxPadding: 0,
|
||||
offset: 30,
|
||||
showLastLabel: true,
|
||||
labels: {
|
||||
format: '{value:%H}'
|
||||
}
|
||||
}, { // Top X axis
|
||||
linkedTo: 0,
|
||||
type: 'datetime',
|
||||
tickInterval: 24 * 3600 * 1000,
|
||||
labels: {
|
||||
format: '{value:<span style="font-size: 12px; font-weight: bold">%a</span> %b %e}',
|
||||
align: 'left',
|
||||
x: 3,
|
||||
y: -5
|
||||
},
|
||||
opposite: true,
|
||||
tickLength: 20,
|
||||
gridLineWidth: 1
|
||||
}],
|
||||
|
||||
yAxis: [{ // temperature axis
|
||||
title: {
|
||||
text: null
|
||||
},
|
||||
labels: {
|
||||
format: '{value}°',
|
||||
style: {
|
||||
fontSize: '10px'
|
||||
},
|
||||
x: -3
|
||||
},
|
||||
plotLines: [{ // zero plane
|
||||
value: 0,
|
||||
color: '#BBBBBB',
|
||||
width: 1,
|
||||
zIndex: 2
|
||||
}],
|
||||
// Custom positioner to provide even temperature ticks from top down
|
||||
tickPositioner: function () {
|
||||
var max = Math.ceil(this.max) + 1,
|
||||
pos = max - 12, // start
|
||||
ret;
|
||||
|
||||
if (pos < this.min) {
|
||||
ret = [];
|
||||
while (pos <= max) {
|
||||
ret.push(pos += 1);
|
||||
}
|
||||
} // else return undefined and go auto
|
||||
|
||||
return ret;
|
||||
|
||||
},
|
||||
maxPadding: 0.3,
|
||||
tickInterval: 1,
|
||||
gridLineColor: (Highcharts.theme && Highcharts.theme.background2) || '#F0F0F0'
|
||||
|
||||
}, { // precipitation axis
|
||||
title: {
|
||||
text: null
|
||||
},
|
||||
labels: {
|
||||
enabled: false
|
||||
},
|
||||
gridLineWidth: 0,
|
||||
tickLength: 0
|
||||
|
||||
}, { // Air pressure
|
||||
allowDecimals: false,
|
||||
title: { // Title on top of axis
|
||||
text: 'hPa',
|
||||
offset: 0,
|
||||
align: 'high',
|
||||
rotation: 0,
|
||||
style: {
|
||||
fontSize: '10px',
|
||||
color: Highcharts.getOptions().colors[2]
|
||||
},
|
||||
textAlign: 'left',
|
||||
x: 3
|
||||
},
|
||||
labels: {
|
||||
style: {
|
||||
fontSize: '8px',
|
||||
color: Highcharts.getOptions().colors[2]
|
||||
},
|
||||
y: 2,
|
||||
x: 3
|
||||
},
|
||||
gridLineWidth: 0,
|
||||
opposite: true,
|
||||
showLastLabel: false
|
||||
}],
|
||||
|
||||
legend: {
|
||||
enabled: false
|
||||
},
|
||||
|
||||
plotOptions: {
|
||||
series: {
|
||||
pointPlacement: 'between'
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
series: [{
|
||||
name: 'Temperature',
|
||||
data: this.temperatures,
|
||||
type: 'spline',
|
||||
marker: {
|
||||
enabled: false,
|
||||
states: {
|
||||
hover: {
|
||||
enabled: true
|
||||
}
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
valueSuffix: '°C'
|
||||
},
|
||||
zIndex: 1,
|
||||
color: '#FF3333',
|
||||
negativeColor: '#48AFE8'
|
||||
}, {
|
||||
name: 'Precipitation',
|
||||
data: this.precipitations,
|
||||
type: 'column',
|
||||
color: '#68CFE8',
|
||||
yAxis: 1,
|
||||
groupPadding: 0,
|
||||
pointPadding: 0,
|
||||
borderWidth: 0,
|
||||
shadow: false,
|
||||
dataLabels: {
|
||||
enabled: true,
|
||||
formatter: function () {
|
||||
if (this.y > 0) {
|
||||
return this.y;
|
||||
}
|
||||
},
|
||||
style: {
|
||||
fontSize: '8px'
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
valueSuffix: 'mm'
|
||||
}
|
||||
}, {
|
||||
name: 'Air pressure',
|
||||
color: Highcharts.getOptions().colors[2],
|
||||
data: this.pressures,
|
||||
marker: {
|
||||
enabled: false
|
||||
},
|
||||
shadow: false,
|
||||
tooltip: {
|
||||
valueSuffix: ' hPa'
|
||||
},
|
||||
dashStyle: 'shortdot',
|
||||
yAxis: 2
|
||||
}]
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Post-process the chart from the callback function, the second argument to Highcharts.Chart.
|
||||
*/
|
||||
Meteogram.prototype.onChartLoad = function (chart) {
|
||||
|
||||
this.drawWeatherSymbols(chart);
|
||||
this.drawWindArrows(chart);
|
||||
this.drawBlocksForWindArrows(chart);
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Create the chart. This function is called async when the data file is loaded and parsed.
|
||||
*/
|
||||
Meteogram.prototype.createChart = function () {
|
||||
var meteogram = this;
|
||||
this.chart = new Highcharts.Chart(this.getChartOptions(), function (chart) {
|
||||
meteogram.onChartLoad(chart);
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* Handle the data. This part of the code is not Highcharts specific, but deals with yr.no's
|
||||
* specific data format
|
||||
*/
|
||||
Meteogram.prototype.parseYrData = function () {
|
||||
|
||||
var meteogram = this,
|
||||
xml = this.xml,
|
||||
pointStart;
|
||||
|
||||
if (!xml || !xml.forecast) {
|
||||
$('#loading').html('<i class="fa fa-frown-o"></i> Failed loading data, please try again later');
|
||||
return;
|
||||
}
|
||||
|
||||
// The returned xml variable is a JavaScript representation of the provided XML,
|
||||
// generated on the server by running PHP simple_load_xml and converting it to
|
||||
// JavaScript by json_encode.
|
||||
$.each(xml.forecast.tabular.time, function (i, time) {
|
||||
// Get the times - only Safari can't parse ISO8601 so we need to do some replacements
|
||||
var from = time['@attributes'].from + ' UTC',
|
||||
to = time['@attributes'].to + ' UTC';
|
||||
|
||||
from = from.replace(/-/g, '/').replace('T', ' ');
|
||||
from = Date.parse(from);
|
||||
to = to.replace(/-/g, '/').replace('T', ' ');
|
||||
to = Date.parse(to);
|
||||
|
||||
if (to > pointStart + 4 * 24 * 36e5) {
|
||||
return;
|
||||
}
|
||||
|
||||
// If it is more than an hour between points, show all symbols
|
||||
if (i === 0) {
|
||||
meteogram.resolution = to - from;
|
||||
}
|
||||
|
||||
// Populate the parallel arrays
|
||||
meteogram.symbols.push(time.symbol['@attributes']['var'].match(/[0-9]{2}[dnm]?/)[0]);
|
||||
meteogram.symbolNames.push(time.symbol['@attributes'].name);
|
||||
|
||||
meteogram.temperatures.push({
|
||||
x: from,
|
||||
y: parseInt(time.temperature['@attributes'].value),
|
||||
// custom options used in the tooltip formatter
|
||||
to: to,
|
||||
index: i
|
||||
});
|
||||
|
||||
meteogram.precipitations.push({
|
||||
x: from,
|
||||
y: parseFloat(time.precipitation['@attributes'].value)
|
||||
});
|
||||
meteogram.windDirections.push(parseFloat(time.windDirection['@attributes'].deg));
|
||||
meteogram.windDirectionNames.push(time.windDirection['@attributes'].name);
|
||||
meteogram.windSpeeds.push(parseFloat(time.windSpeed['@attributes'].mps));
|
||||
meteogram.windSpeedNames.push(time.windSpeed['@attributes'].name);
|
||||
|
||||
meteogram.pressures.push({
|
||||
x: from,
|
||||
y: parseFloat(time.pressure['@attributes'].value)
|
||||
});
|
||||
|
||||
if (i == 0) {
|
||||
pointStart = (from + to) / 2;
|
||||
}
|
||||
});
|
||||
|
||||
// Smooth the line
|
||||
this.smoothLine(this.temperatures);
|
||||
|
||||
// Create the chart when the data is loaded
|
||||
this.createChart();
|
||||
};
|
||||
// End of the Meteogram protype
|
||||
|
||||
|
||||
|
||||
$(function () { // On DOM ready...
|
||||
|
||||
// Set the hash to the yr.no URL we want to parse
|
||||
if (!location.hash) {
|
||||
var place = 'United_Kingdom/England/London';
|
||||
//place = 'France/Rhône-Alpes/Val_d\'Isère~2971074';
|
||||
//place = 'Norway/Sogn_og_Fjordane/Vik/Målset';
|
||||
//place = 'United_States/California/San_Francisco';
|
||||
//place = 'United_States/Minnesota/Minneapolis';
|
||||
location.hash = 'http://www.yr.no/place/' + place + '/forecast_hour_by_hour.xml';
|
||||
|
||||
}
|
||||
|
||||
// Then get the XML file through Highcharts' jsonp provider, see
|
||||
// https://github.com/highslide-software/highcharts.com/blob/master/samples/data/jsonp.php
|
||||
// for source code.
|
||||
$.getJSON(
|
||||
'http://www.highcharts.com/samples/data/jsonp.php?url=' + location.hash.substr(1) + '&callback=?',
|
||||
function (xml) {
|
||||
var meteogram = new Meteogram(xml, 'container');
|
||||
}
|
||||
);
|
||||
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
<link href="http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
|
||||
|
||||
<div id="container" style="width: 800px; height: 310px; margin: 0 auto">
|
||||
<div style="margin-top: 100px; text-align: center" id="loading">
|
||||
<i class="fa fa-spinner fa-spin"></i> Loading data from external source
|
||||
</div>
|
||||
</div>
|
||||
<!--
|
||||
<div style="width: 800px; margin: 0 auto">
|
||||
<a href="#http://www.yr.no/place/United_Kingdom/England/London/forecast_hour_by_hour.xml">London</a>,
|
||||
<a href="#http://www.yr.no/place/France/Rhône-Alpes/Val_d\'Isère~2971074/forecast_hour_by_hour.xml">Val d'Isère</a>,
|
||||
<a href="#http://www.yr.no/place/United_States/California/San_Francisco/forecast_hour_by_hour.xml">San Francisco</a>,
|
||||
<a href="#http://www.yr.no/place/Norway/Vik/Vikafjell/forecast_hour_by_hour.xml">Vikjafjellet</a>
|
||||
</div>
|
||||
-->
|
||||
</body>
|
||||
</html>
|
||||
129
lib/highcharts/examples/combo-multi-axes/index.htm
Normal file
129
lib/highcharts/examples/combo-multi-axes/index.htm
Normal file
@ -0,0 +1,129 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
zoomType: 'xy'
|
||||
},
|
||||
title: {
|
||||
text: 'Average Monthly Weather Data for Tokyo'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Source: WorldClimate.com'
|
||||
},
|
||||
xAxis: [{
|
||||
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
|
||||
'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
|
||||
crosshair: true
|
||||
}],
|
||||
yAxis: [{ // Primary yAxis
|
||||
labels: {
|
||||
format: '{value}°C',
|
||||
style: {
|
||||
color: Highcharts.getOptions().colors[2]
|
||||
}
|
||||
},
|
||||
title: {
|
||||
text: 'Temperature',
|
||||
style: {
|
||||
color: Highcharts.getOptions().colors[2]
|
||||
}
|
||||
},
|
||||
opposite: true
|
||||
|
||||
}, { // Secondary yAxis
|
||||
gridLineWidth: 0,
|
||||
title: {
|
||||
text: 'Rainfall',
|
||||
style: {
|
||||
color: Highcharts.getOptions().colors[0]
|
||||
}
|
||||
},
|
||||
labels: {
|
||||
format: '{value} mm',
|
||||
style: {
|
||||
color: Highcharts.getOptions().colors[0]
|
||||
}
|
||||
}
|
||||
|
||||
}, { // Tertiary yAxis
|
||||
gridLineWidth: 0,
|
||||
title: {
|
||||
text: 'Sea-Level Pressure',
|
||||
style: {
|
||||
color: Highcharts.getOptions().colors[1]
|
||||
}
|
||||
},
|
||||
labels: {
|
||||
format: '{value} mb',
|
||||
style: {
|
||||
color: Highcharts.getOptions().colors[1]
|
||||
}
|
||||
},
|
||||
opposite: true
|
||||
}],
|
||||
tooltip: {
|
||||
shared: true
|
||||
},
|
||||
legend: {
|
||||
layout: 'vertical',
|
||||
align: 'left',
|
||||
x: 80,
|
||||
verticalAlign: 'top',
|
||||
y: 55,
|
||||
floating: true,
|
||||
backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'
|
||||
},
|
||||
series: [{
|
||||
name: 'Rainfall',
|
||||
type: 'column',
|
||||
yAxis: 1,
|
||||
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],
|
||||
tooltip: {
|
||||
valueSuffix: ' mm'
|
||||
}
|
||||
|
||||
}, {
|
||||
name: 'Sea-Level Pressure',
|
||||
type: 'spline',
|
||||
yAxis: 2,
|
||||
data: [1016, 1016, 1015.9, 1015.5, 1012.3, 1009.5, 1009.6, 1010.2, 1013.1, 1016.9, 1018.2, 1016.7],
|
||||
marker: {
|
||||
enabled: false
|
||||
},
|
||||
dashStyle: 'shortdot',
|
||||
tooltip: {
|
||||
valueSuffix: ' mb'
|
||||
}
|
||||
|
||||
}, {
|
||||
name: 'Temperature',
|
||||
type: 'spline',
|
||||
data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6],
|
||||
tooltip: {
|
||||
valueSuffix: ' °C'
|
||||
}
|
||||
}]
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
56
lib/highcharts/examples/combo-regression/index.htm
Normal file
56
lib/highcharts/examples/combo-regression/index.htm
Normal file
@ -0,0 +1,56 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
xAxis: {
|
||||
min: -0.5,
|
||||
max: 5.5
|
||||
},
|
||||
yAxis: {
|
||||
min: 0
|
||||
},
|
||||
title: {
|
||||
text: 'Scatter plot with regression line'
|
||||
},
|
||||
series: [{
|
||||
type: 'line',
|
||||
name: 'Regression Line',
|
||||
data: [[0, 1.11], [5, 4.51]],
|
||||
marker: {
|
||||
enabled: false
|
||||
},
|
||||
states: {
|
||||
hover: {
|
||||
lineWidth: 0
|
||||
}
|
||||
},
|
||||
enableMouseTracking: false
|
||||
}, {
|
||||
type: 'scatter',
|
||||
name: 'Observations',
|
||||
data: [1, 1.5, 2.8, 3.5, 3.9, 4.2],
|
||||
marker: {
|
||||
radius: 4
|
||||
}
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
422
lib/highcharts/examples/combo-timeline/index.htm
Normal file
422
lib/highcharts/examples/combo-timeline/index.htm
Normal file
@ -0,0 +1,422 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
#container {
|
||||
min-width: 300px;
|
||||
max-width: 1000px;
|
||||
height: 420px;
|
||||
margin: 1em auto;
|
||||
}
|
||||
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
/**
|
||||
* This is an advanced demo of setting up Highcharts with the flags feature borrowed from Highstock.
|
||||
* It also shows custom graphics drawn in the chart area on chart load.
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Fires on chart load, called from the chart.events.load option.
|
||||
*/
|
||||
function onChartLoad() {
|
||||
|
||||
var centerX = 140,
|
||||
centerY = 110,
|
||||
path = [],
|
||||
angle,
|
||||
radius,
|
||||
badgeColor = Highcharts.Color(Highcharts.getOptions().colors[0]).brighten(-0.2).get(),
|
||||
spike,
|
||||
empImage,
|
||||
big5,
|
||||
label,
|
||||
left,
|
||||
right,
|
||||
years,
|
||||
renderer;
|
||||
|
||||
if (this.chartWidth < 530) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Draw the spiked disc
|
||||
for (angle = 0; angle < 2 * Math.PI; angle += Math.PI / 24) {
|
||||
radius = spike ? 80 : 70;
|
||||
path.push(
|
||||
'L',
|
||||
centerX + radius * Math.cos(angle),
|
||||
centerY + radius * Math.sin(angle)
|
||||
);
|
||||
spike = !spike;
|
||||
}
|
||||
path[0] = 'M';
|
||||
path.push('z');
|
||||
this.renderer.path(path)
|
||||
.attr({
|
||||
fill: badgeColor,
|
||||
zIndex: 6
|
||||
})
|
||||
.add();
|
||||
|
||||
// Employee image overlay
|
||||
empImage = this.renderer.path(path)
|
||||
.attr({
|
||||
zIndex: 7,
|
||||
opacity: 0,
|
||||
stroke: badgeColor,
|
||||
'stroke-width': 1
|
||||
})
|
||||
.add();
|
||||
|
||||
// Big 5
|
||||
big5 = this.renderer.text('5')
|
||||
.attr({
|
||||
zIndex: 6
|
||||
})
|
||||
.css({
|
||||
color: 'white',
|
||||
fontSize: '100px',
|
||||
fontStyle: 'italic',
|
||||
fontFamily: "'Brush Script MT', sans-serif"
|
||||
})
|
||||
.add();
|
||||
big5.attr({
|
||||
x: centerX - big5.getBBox().width / 2,
|
||||
y: centerY + 14
|
||||
});
|
||||
|
||||
// Draw the label
|
||||
label = this.renderer.text('Highcharts Anniversary')
|
||||
.attr({
|
||||
zIndex: 6
|
||||
})
|
||||
.css({
|
||||
color: '#FFFFFF'
|
||||
})
|
||||
.add();
|
||||
|
||||
left = centerX - label.getBBox().width / 2;
|
||||
right = centerX + label.getBBox().width / 2;
|
||||
|
||||
label.attr({
|
||||
x: left,
|
||||
y: centerY + 44
|
||||
});
|
||||
|
||||
// The band
|
||||
left = centerX - 90;
|
||||
right = centerX + 90;
|
||||
this.renderer
|
||||
.path([
|
||||
'M', left, centerY + 30,
|
||||
'L', right, centerY + 30,
|
||||
right, centerY + 50,
|
||||
left, centerY + 50,
|
||||
'z',
|
||||
'M', left, centerY + 40,
|
||||
'L', left - 20, centerY + 40,
|
||||
left - 10, centerY + 50,
|
||||
left - 20, centerY + 60,
|
||||
left + 10, centerY + 60,
|
||||
left, centerY + 50,
|
||||
left + 10, centerY + 60,
|
||||
left + 10, centerY + 50,
|
||||
left, centerY + 50,
|
||||
'z',
|
||||
'M', right, centerY + 40,
|
||||
'L', right + 20, centerY + 40,
|
||||
right + 10, centerY + 50,
|
||||
right + 20, centerY + 60,
|
||||
right - 10, centerY + 60,
|
||||
right, centerY + 50,
|
||||
right - 10, centerY + 60,
|
||||
right - 10, centerY + 50,
|
||||
right, centerY + 50,
|
||||
'z'
|
||||
])
|
||||
.attr({
|
||||
fill: badgeColor,
|
||||
stroke: '#FFFFFF',
|
||||
'stroke-width': 1,
|
||||
zIndex: 5
|
||||
})
|
||||
.add();
|
||||
|
||||
// 2009-2014
|
||||
years = this.renderer.text('2009-2014')
|
||||
.attr({
|
||||
zIndex: 6
|
||||
})
|
||||
.css({
|
||||
color: '#FFFFFF',
|
||||
fontStyle: 'italic',
|
||||
fontSize: '10px'
|
||||
})
|
||||
.add();
|
||||
years.attr({
|
||||
x: centerX - years.getBBox().width / 2,
|
||||
y: centerY + 62
|
||||
});
|
||||
|
||||
|
||||
// Prepare mouseover
|
||||
renderer = this.renderer;
|
||||
if (renderer.defs) { // is SVG
|
||||
$.each(this.get('employees').points, function () {
|
||||
var point = this,
|
||||
pattern;
|
||||
if (point.image) {
|
||||
pattern = renderer.createElement('pattern').attr({
|
||||
id: 'pattern-' + point.image,
|
||||
patternUnits: 'userSpaceOnUse',
|
||||
width: 400,
|
||||
height: 400
|
||||
}).add(renderer.defs);
|
||||
renderer.image(
|
||||
'http://www.highcharts.com/images/employees2014/' + point.image + '.jpg',
|
||||
centerX - 80,
|
||||
centerY - 80,
|
||||
160,
|
||||
213
|
||||
).add(pattern);
|
||||
|
||||
Highcharts.addEvent(point, 'mouseOver', function () {
|
||||
empImage
|
||||
.attr({
|
||||
fill: 'url(#pattern-' + point.image + ')'
|
||||
})
|
||||
.animate({ opacity: 1 }, { duration : 500 });
|
||||
});
|
||||
Highcharts.addEvent(point, 'mouseOut', function () {
|
||||
empImage.animate({ opacity: 0 }, { duration : 500 });
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
$(function () {
|
||||
var options = {
|
||||
|
||||
chart: {
|
||||
events: {
|
||||
load: onChartLoad
|
||||
}
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
type: 'datetime',
|
||||
minTickInterval: 365 * 24 * 36e5,
|
||||
labels: {
|
||||
align: 'left'
|
||||
},
|
||||
plotBands: [{
|
||||
from: Date.UTC(2009, 10, 27),
|
||||
to: Date.UTC(2010, 11, 1),
|
||||
color: '#EFFFFF',
|
||||
label: {
|
||||
text: '<em>Offices:</em><br> Torstein\'s basement',
|
||||
style: {
|
||||
color: '#999999'
|
||||
},
|
||||
y: 180
|
||||
}
|
||||
}, {
|
||||
from: Date.UTC(2010, 11, 1),
|
||||
to: Date.UTC(2013, 9, 1),
|
||||
color: '#FFFFEF',
|
||||
label: {
|
||||
text: '<em>Offices:</em><br> Tomtebu',
|
||||
style: {
|
||||
color: '#999999'
|
||||
},
|
||||
y: 30
|
||||
}
|
||||
}, {
|
||||
from: Date.UTC(2013, 9, 1),
|
||||
to: Date.UTC(2014, 10, 27),
|
||||
color: '#FFEFFF',
|
||||
label: {
|
||||
text: '<em>Offices:</em><br> VikØrsta',
|
||||
style: {
|
||||
color: '#999999'
|
||||
},
|
||||
y: 30
|
||||
}
|
||||
}]
|
||||
|
||||
},
|
||||
|
||||
title: {
|
||||
text: 'Highcharts and Highsoft timeline'
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
style: {
|
||||
width: '250px'
|
||||
}
|
||||
},
|
||||
|
||||
yAxis: [{
|
||||
max: 100,
|
||||
labels: {
|
||||
enabled: false
|
||||
},
|
||||
title: {
|
||||
text: ''
|
||||
},
|
||||
gridLineColor: 'rgba(0, 0, 0, 0.07)'
|
||||
}, {
|
||||
allowDecimals: false,
|
||||
max: 15,
|
||||
labels: {
|
||||
style: {
|
||||
color: Highcharts.getOptions().colors[2]
|
||||
}
|
||||
},
|
||||
title: {
|
||||
text: 'Employees',
|
||||
style: {
|
||||
color: Highcharts.getOptions().colors[2]
|
||||
}
|
||||
},
|
||||
opposite: true,
|
||||
gridLineWidth: 0
|
||||
}],
|
||||
|
||||
plotOptions: {
|
||||
series: {
|
||||
marker: {
|
||||
enabled: false,
|
||||
symbol: 'circle',
|
||||
radius: 2
|
||||
},
|
||||
fillOpacity: 0.5
|
||||
},
|
||||
flags: {
|
||||
tooltip: {
|
||||
xDateFormat: '%B %e, %Y'
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
series: [{
|
||||
type: 'spline',
|
||||
id: 'google-trends',
|
||||
dashStyle: 'dash',
|
||||
name: 'Google search for <em>highcharts</em>',
|
||||
data: [{ x: 1258322400000, /* November 2009 */ y: 0}, { x: 1260961200000, y: 5}, { x: 1263639600000, y: 7}, { x: 1266188400000, y: 5}, { x: 1268740800000, y: 6}, { x: 1271368800000, y: 8}, { x: 1274004000000, y: 11}, { x: 1276639200000, y: 9}, { x: 1279274400000, y: 12}, { x: 1281952800000, y: 13}, { x: 1284588000000, y: 17}, { x: 1287223200000, y: 17}, { x: 1289858400000, y: 18}, { x: 1292497200000, y: 20}, { x: 1295175600000, y: 20}, { x: 1297724400000, y: 27}, { x: 1300276800000, y: 32}, { x: 1302904800000, y: 29}, { x: 1305540000000, y: 34}, { x: 1308175200000, y: 34}, { x: 1310810400000, y: 36}, { x: 1313488800000, y: 43}, { x: 1316124000000, y: 44}, { x: 1318759200000, y: 42}, { x: 1321394400000, y: 47}, { x: 1324033200000, y: 46}, { x: 1326711600000, y: 50}, { x: 1329303600000, y: 57}, { x: 1331899200000, y: 54}, { x: 1334527200000, y: 59}, { x: 1337162400000, y: 62}, { x: 1339797600000, y: 66}, { x: 1342432800000, y: 61}, { x: 1345111200000, y: 68}, { x: 1347746400000, y: 67}, { x: 1350381600000, y: 73}, { x: 1353016800000, y: 63}, { x: 1355655600000, y: 54}, { x: 1358334000000, y: 67}, { x: 1360882800000, y: 74}, { x: 1363435200000, y: 81}, { x: 1366063200000, y: 89}, { x: 1368698400000, y: 83}, { x: 1371333600000, y: 88}, { x: 1373968800000, y: 86}, { x: 1376647200000, y: 81}, { x: 1379282400000, y: 83}, { x: 1381917600000, y: 95}, { x: 1384552800000, y: 86}, { x: 1387191600000, y: 83}, { x: 1389870000000, y: 89}, { x: 1392418800000, y: 90}, { x: 1394971200000, y: 94}, { x: 1397599200000, y: 100}, { x: 1400234400000, y: 100}, { x: 1402869600000, y: 99}, { x: 1405504800000, y: 99}, { x: 1408183200000, y: 93}, { x: 1410818400000, y: 97}, { x: 1413453600000, y: 98}],
|
||||
tooltip: {
|
||||
xDateFormat: '%B %Y',
|
||||
valueSuffix: ' % of best month'
|
||||
}
|
||||
}, {
|
||||
name: 'Revenue',
|
||||
id: 'revenue',
|
||||
type: 'area',
|
||||
data: [[1257033600000, 2], [1259625600000, 3], [1262304000000, 2], [1264982400000, 3], [1267401600000, 4], [1270080000000, 4], [1272672000000, 4], [1275350400000, 4], [1277942400000, 5], [1280620800000, 7], [1283299200000, 6], [1285891200000, 9], [1288569600000, 10], [1291161600000, 8], [1293840000000, 10], [1296518400000, 13], [1298937600000, 15], [1301616000000, 14], [1304208000000, 15], [1306886400000, 16], [1309478400000, 22], [1312156800000, 19], [1314835200000, 20], [1317427200000, 32], [1320105600000, 34], [1322697600000, 36], [1325376000000, 34], [1328054400000, 40], [1330560000000, 37], [1333238400000, 35], [1335830400000, 40], [1338508800000, 38], [1341100800000, 39], [1343779200000, 43], [1346457600000, 49], [1349049600000, 43], [1351728000000, 54], [1354320000000, 44], [1356998400000, 43], [1359676800000, 43], [1362096000000, 52], [1364774400000, 52], [1367366400000, 56], [1370044800000, 62], [1372636800000, 66], [1375315200000, 62], [1377993600000, 63], [1380585600000, 60], [1383264000000, 60], [1385856000000, 58], [1388534400000, 65], [1391212800000, 52], [1393632000000, 72], [1396310400000, 57], [1398902400000, 70], [1401580800000, 63], [1404172800000, 65], [1406851200000, 65], [1409529600000, 89], [1412121600000, 100]],
|
||||
tooltip: {
|
||||
xDateFormat: '%B %Y',
|
||||
valueSuffix: ' % of best month'
|
||||
}
|
||||
|
||||
}, {
|
||||
yAxis: 1,
|
||||
name: 'Highsoft employees',
|
||||
id: 'employees',
|
||||
type: 'area',
|
||||
step: 'left',
|
||||
tooltip: {
|
||||
headerFormat: '<span style="font-size: 11px;color:#666">{point.x:%B %e, %Y}</span><br>',
|
||||
pointFormat: '{point.name}<br><b>{point.y}</b>',
|
||||
valueSuffix: ' employees'
|
||||
},
|
||||
data: [
|
||||
{ x: Date.UTC(2009, 10, 1), y: 1, name: 'Torstein worked alone', image: 'Torstein' },
|
||||
{ x: Date.UTC(2010, 10, 20), y: 2, name: 'Grethe joined', image: 'Grethe' },
|
||||
{ x: Date.UTC(2011, 3, 1), y: 3, name: 'Erik joined', image: null },
|
||||
{ x: Date.UTC(2011, 7, 1), y: 4, name: 'Gert joined', image: 'Gert' },
|
||||
{ x: Date.UTC(2011, 7, 15), y: 5, name: 'Hilde joined', image: 'Hilde' },
|
||||
{ x: Date.UTC(2012, 5, 1), y: 6, name: 'Guro joined', image: 'Guro' },
|
||||
{ x: Date.UTC(2012, 8, 1), y: 5, name: 'Erik left', image: null },
|
||||
{ x: Date.UTC(2012, 8, 15), y: 6, name: 'Anne Jorunn joined', image: 'AnneJorunn' },
|
||||
{ x: Date.UTC(2013, 0, 1), y: 7, name: 'Hilde T. joined', image: null },
|
||||
{ x: Date.UTC(2013, 7, 1), y: 8, name: 'Jon Arild joined', image: 'JonArild' },
|
||||
{ x: Date.UTC(2013, 7, 20), y: 9, name: 'Øystein joined', image: 'Oystein' },
|
||||
{ x: Date.UTC(2013, 9, 1), y: 10, name: 'Stephane joined', image: 'Stephane' },
|
||||
{ x: Date.UTC(2014, 9, 1), y: 11, name: 'Anita joined', image: 'Anita' },
|
||||
{ x: Date.UTC(2014, 10, 27), y: 11, name: ' ', image: null }
|
||||
]
|
||||
|
||||
}]
|
||||
};
|
||||
|
||||
// Add flags for important milestones. This requires Highstock.
|
||||
if (Highcharts.seriesTypes.flags) {
|
||||
options.series.push({
|
||||
type: 'flags',
|
||||
name: 'Cloud',
|
||||
color: '#333333',
|
||||
shape: 'squarepin',
|
||||
y: -80,
|
||||
data: [
|
||||
{ x: Date.UTC(2014, 4, 1), text: 'Highcharts Cloud Beta', title: 'Cloud', shape: 'squarepin' }
|
||||
],
|
||||
showInLegend: false
|
||||
}, {
|
||||
type: 'flags',
|
||||
name: 'Highmaps',
|
||||
color: '#333333',
|
||||
shape: 'squarepin',
|
||||
y: -55,
|
||||
data: [
|
||||
{ x: Date.UTC(2014, 5, 13), text: 'Highmaps version 1.0 released', title: 'Maps' }
|
||||
],
|
||||
showInLegend: false
|
||||
}, {
|
||||
type: 'flags',
|
||||
name: 'Highcharts',
|
||||
color: '#333333',
|
||||
shape: 'circlepin',
|
||||
data: [
|
||||
{ x: Date.UTC(2009, 10, 27), text: 'Highcharts version 1.0 released', title: '1.0' },
|
||||
{ x: Date.UTC(2010, 6, 13), text: 'Ported from canvas to SVG rendering', title: '2.0' },
|
||||
{ x: Date.UTC(2010, 10, 23), text: 'Dynamically resize and scale to text labels', title: '2.1' },
|
||||
{ x: Date.UTC(2011, 9, 18), text: 'Highstock version 1.0 released', title: 'Stock', shape: 'squarepin' },
|
||||
{ x: Date.UTC(2012, 7, 24), text: 'Gauges, polar charts and range series', title: '2.3' },
|
||||
{ x: Date.UTC(2013, 2, 22), text: 'Multitouch support, more series types', title: '3.0' },
|
||||
{ x: Date.UTC(2014, 3, 22), text: '3D charts, heatmaps', title: '4.0' }
|
||||
],
|
||||
showInLegend: false
|
||||
}, {
|
||||
type: 'flags',
|
||||
name: 'Events',
|
||||
color: '#333333',
|
||||
fillColor: 'rgba(255,255,255,0.8)',
|
||||
data: [
|
||||
{ x: Date.UTC(2012, 10, 1), text: 'Highsoft won "Entrepeneur of the Year" in Sogn og Fjordane, Norway', title: 'Award' },
|
||||
{ x: Date.UTC(2012, 11, 25), text: 'Packt Publishing published <em>Learning Highcharts by Example</em>. Since then, many other books are written about Highcharts.', title: 'First book' },
|
||||
{ x: Date.UTC(2013, 4, 25), text: 'Highsoft nominated Norway\'s Startup of the Year', title: 'Award' },
|
||||
{ x: Date.UTC(2014, 4, 25), text: 'Highsoft nominated Best Startup in Nordic Startup Awards', title: 'Award' }
|
||||
],
|
||||
onSeries: 'revenue',
|
||||
showInLegend: false
|
||||
});
|
||||
}
|
||||
|
||||
$('#container').highcharts(options);
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highstock.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
<div id="container"></div>
|
||||
</body>
|
||||
</html>
|
||||
87
lib/highcharts/examples/combo/index.htm
Normal file
87
lib/highcharts/examples/combo/index.htm
Normal file
@ -0,0 +1,87 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
title: {
|
||||
text: 'Combination chart'
|
||||
},
|
||||
xAxis: {
|
||||
categories: ['Apples', 'Oranges', 'Pears', 'Bananas', 'Plums']
|
||||
},
|
||||
labels: {
|
||||
items: [{
|
||||
html: 'Total fruit consumption',
|
||||
style: {
|
||||
left: '50px',
|
||||
top: '18px',
|
||||
color: (Highcharts.theme && Highcharts.theme.textColor) || 'black'
|
||||
}
|
||||
}]
|
||||
},
|
||||
series: [{
|
||||
type: 'column',
|
||||
name: 'Jane',
|
||||
data: [3, 2, 1, 3, 4]
|
||||
}, {
|
||||
type: 'column',
|
||||
name: 'John',
|
||||
data: [2, 3, 5, 7, 6]
|
||||
}, {
|
||||
type: 'column',
|
||||
name: 'Joe',
|
||||
data: [4, 3, 3, 9, 0]
|
||||
}, {
|
||||
type: 'spline',
|
||||
name: 'Average',
|
||||
data: [3, 2.67, 3, 6.33, 3.33],
|
||||
marker: {
|
||||
lineWidth: 2,
|
||||
lineColor: Highcharts.getOptions().colors[3],
|
||||
fillColor: 'white'
|
||||
}
|
||||
}, {
|
||||
type: 'pie',
|
||||
name: 'Total consumption',
|
||||
data: [{
|
||||
name: 'Jane',
|
||||
y: 13,
|
||||
color: Highcharts.getOptions().colors[0] // Jane's color
|
||||
}, {
|
||||
name: 'John',
|
||||
y: 23,
|
||||
color: Highcharts.getOptions().colors[1] // John's color
|
||||
}, {
|
||||
name: 'Joe',
|
||||
y: 19,
|
||||
color: Highcharts.getOptions().colors[2] // Joe's color
|
||||
}],
|
||||
center: [100, 80],
|
||||
size: 100,
|
||||
showInLegend: false,
|
||||
dataLabels: {
|
||||
enabled: false
|
||||
}
|
||||
}]
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
89
lib/highcharts/examples/dynamic-click-to-add/index.htm
Normal file
89
lib/highcharts/examples/dynamic-click-to-add/index.htm
Normal file
@ -0,0 +1,89 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'scatter',
|
||||
margin: [70, 50, 60, 80],
|
||||
events: {
|
||||
click: function (e) {
|
||||
// find the clicked values and the series
|
||||
var x = e.xAxis[0].value,
|
||||
y = e.yAxis[0].value,
|
||||
series = this.series[0];
|
||||
|
||||
// Add it
|
||||
series.addPoint([x, y]);
|
||||
|
||||
}
|
||||
}
|
||||
},
|
||||
title: {
|
||||
text: 'User supplied data'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Click the plot area to add a point. Click a point to remove it.'
|
||||
},
|
||||
xAxis: {
|
||||
gridLineWidth: 1,
|
||||
minPadding: 0.2,
|
||||
maxPadding: 0.2,
|
||||
maxZoom: 60
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Value'
|
||||
},
|
||||
minPadding: 0.2,
|
||||
maxPadding: 0.2,
|
||||
maxZoom: 60,
|
||||
plotLines: [{
|
||||
value: 0,
|
||||
width: 1,
|
||||
color: '#808080'
|
||||
}]
|
||||
},
|
||||
legend: {
|
||||
enabled: false
|
||||
},
|
||||
exporting: {
|
||||
enabled: false
|
||||
},
|
||||
plotOptions: {
|
||||
series: {
|
||||
lineWidth: 1,
|
||||
point: {
|
||||
events: {
|
||||
'click': function () {
|
||||
if (this.series.data.length > 1) {
|
||||
this.remove();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
data: [[20, 20], [80, 80]]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; max-width: 700px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
260
lib/highcharts/examples/dynamic-master-detail/index.htm
Normal file
260
lib/highcharts/examples/dynamic-master-detail/index.htm
Normal file
@ -0,0 +1,260 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=usdeur.json&callback=?', function (data) {
|
||||
var detailChart;
|
||||
|
||||
$(document).ready(function () {
|
||||
|
||||
// create the detail chart
|
||||
function createDetail(masterChart) {
|
||||
|
||||
// prepare the detail chart
|
||||
var detailData = [],
|
||||
detailStart = data[0][0];
|
||||
|
||||
$.each(masterChart.series[0].data, function () {
|
||||
if (this.x >= detailStart) {
|
||||
detailData.push(this.y);
|
||||
}
|
||||
});
|
||||
|
||||
// create a detail chart referenced by a global variable
|
||||
detailChart = $('#detail-container').highcharts({
|
||||
chart: {
|
||||
marginBottom: 120,
|
||||
reflow: false,
|
||||
marginLeft: 50,
|
||||
marginRight: 20,
|
||||
style: {
|
||||
position: 'absolute'
|
||||
}
|
||||
},
|
||||
credits: {
|
||||
enabled: false
|
||||
},
|
||||
title: {
|
||||
text: 'Historical USD to EUR Exchange Rate'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Select an area by dragging across the lower chart'
|
||||
},
|
||||
xAxis: {
|
||||
type: 'datetime'
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: null
|
||||
},
|
||||
maxZoom: 0.1
|
||||
},
|
||||
tooltip: {
|
||||
formatter: function () {
|
||||
var point = this.points[0];
|
||||
return '<b>' + point.series.name + '</b><br/>' + Highcharts.dateFormat('%A %B %e %Y', this.x) + ':<br/>' +
|
||||
'1 USD = ' + Highcharts.numberFormat(point.y, 2) + ' EUR';
|
||||
},
|
||||
shared: true
|
||||
},
|
||||
legend: {
|
||||
enabled: false
|
||||
},
|
||||
plotOptions: {
|
||||
series: {
|
||||
marker: {
|
||||
enabled: false,
|
||||
states: {
|
||||
hover: {
|
||||
enabled: true,
|
||||
radius: 3
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: 'USD to EUR',
|
||||
pointStart: detailStart,
|
||||
pointInterval: 24 * 3600 * 1000,
|
||||
data: detailData
|
||||
}],
|
||||
|
||||
exporting: {
|
||||
enabled: false
|
||||
}
|
||||
|
||||
}).highcharts(); // return chart
|
||||
}
|
||||
|
||||
// create the master chart
|
||||
function createMaster() {
|
||||
$('#master-container').highcharts({
|
||||
chart: {
|
||||
reflow: false,
|
||||
borderWidth: 0,
|
||||
backgroundColor: null,
|
||||
marginLeft: 50,
|
||||
marginRight: 20,
|
||||
zoomType: 'x',
|
||||
events: {
|
||||
|
||||
// listen to the selection event on the master chart to update the
|
||||
// extremes of the detail chart
|
||||
selection: function (event) {
|
||||
var extremesObject = event.xAxis[0],
|
||||
min = extremesObject.min,
|
||||
max = extremesObject.max,
|
||||
detailData = [],
|
||||
xAxis = this.xAxis[0];
|
||||
|
||||
// reverse engineer the last part of the data
|
||||
$.each(this.series[0].data, function () {
|
||||
if (this.x > min && this.x < max) {
|
||||
detailData.push([this.x, this.y]);
|
||||
}
|
||||
});
|
||||
|
||||
// move the plot bands to reflect the new detail span
|
||||
xAxis.removePlotBand('mask-before');
|
||||
xAxis.addPlotBand({
|
||||
id: 'mask-before',
|
||||
from: data[0][0],
|
||||
to: min,
|
||||
color: 'rgba(0, 0, 0, 0.2)'
|
||||
});
|
||||
|
||||
xAxis.removePlotBand('mask-after');
|
||||
xAxis.addPlotBand({
|
||||
id: 'mask-after',
|
||||
from: max,
|
||||
to: data[data.length - 1][0],
|
||||
color: 'rgba(0, 0, 0, 0.2)'
|
||||
});
|
||||
|
||||
|
||||
detailChart.series[0].setData(detailData);
|
||||
|
||||
return false;
|
||||
}
|
||||
}
|
||||
},
|
||||
title: {
|
||||
text: null
|
||||
},
|
||||
xAxis: {
|
||||
type: 'datetime',
|
||||
showLastTickLabel: true,
|
||||
maxZoom: 14 * 24 * 3600000, // fourteen days
|
||||
plotBands: [{
|
||||
id: 'mask-before',
|
||||
from: data[0][0],
|
||||
to: data[data.length - 1][0],
|
||||
color: 'rgba(0, 0, 0, 0.2)'
|
||||
}],
|
||||
title: {
|
||||
text: null
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
gridLineWidth: 0,
|
||||
labels: {
|
||||
enabled: false
|
||||
},
|
||||
title: {
|
||||
text: null
|
||||
},
|
||||
min: 0.6,
|
||||
showFirstLabel: false
|
||||
},
|
||||
tooltip: {
|
||||
formatter: function () {
|
||||
return false;
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
enabled: false
|
||||
},
|
||||
credits: {
|
||||
enabled: false
|
||||
},
|
||||
plotOptions: {
|
||||
series: {
|
||||
fillColor: {
|
||||
linearGradient: [0, 0, 0, 70],
|
||||
stops: [
|
||||
[0, Highcharts.getOptions().colors[0]],
|
||||
[1, 'rgba(255,255,255,0)']
|
||||
]
|
||||
},
|
||||
lineWidth: 1,
|
||||
marker: {
|
||||
enabled: false
|
||||
},
|
||||
shadow: false,
|
||||
states: {
|
||||
hover: {
|
||||
lineWidth: 1
|
||||
}
|
||||
},
|
||||
enableMouseTracking: false
|
||||
}
|
||||
},
|
||||
|
||||
series: [{
|
||||
type: 'area',
|
||||
name: 'USD to EUR',
|
||||
pointInterval: 24 * 3600 * 1000,
|
||||
pointStart: data[0][0],
|
||||
data: data
|
||||
}],
|
||||
|
||||
exporting: {
|
||||
enabled: false
|
||||
}
|
||||
|
||||
}, function (masterChart) {
|
||||
createDetail(masterChart);
|
||||
})
|
||||
.highcharts(); // return chart instance
|
||||
}
|
||||
|
||||
// make the container smaller and add a second container for the master chart
|
||||
var $container = $('#container')
|
||||
.css('position', 'relative');
|
||||
|
||||
$('<div id="detail-container">')
|
||||
.appendTo($container);
|
||||
|
||||
$('<div id="master-container">')
|
||||
.css({
|
||||
position: 'absolute',
|
||||
top: 300,
|
||||
height: 100,
|
||||
width: '100%'
|
||||
})
|
||||
.appendTo($container);
|
||||
|
||||
// create master and in its callback, create the detail chart
|
||||
createMaster();
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
97
lib/highcharts/examples/dynamic-update/index.htm
Normal file
97
lib/highcharts/examples/dynamic-update/index.htm
Normal file
@ -0,0 +1,97 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$(document).ready(function () {
|
||||
Highcharts.setOptions({
|
||||
global: {
|
||||
useUTC: false
|
||||
}
|
||||
});
|
||||
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'spline',
|
||||
animation: Highcharts.svg, // don't animate in old IE
|
||||
marginRight: 10,
|
||||
events: {
|
||||
load: function () {
|
||||
|
||||
// set up the updating of the chart each second
|
||||
var series = this.series[0];
|
||||
setInterval(function () {
|
||||
var x = (new Date()).getTime(), // current time
|
||||
y = Math.random();
|
||||
series.addPoint([x, y], true, true);
|
||||
}, 1000);
|
||||
}
|
||||
}
|
||||
},
|
||||
title: {
|
||||
text: 'Live random data'
|
||||
},
|
||||
xAxis: {
|
||||
type: 'datetime',
|
||||
tickPixelInterval: 150
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Value'
|
||||
},
|
||||
plotLines: [{
|
||||
value: 0,
|
||||
width: 1,
|
||||
color: '#808080'
|
||||
}]
|
||||
},
|
||||
tooltip: {
|
||||
formatter: function () {
|
||||
return '<b>' + this.series.name + '</b><br/>' +
|
||||
Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) + '<br/>' +
|
||||
Highcharts.numberFormat(this.y, 2);
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
enabled: false
|
||||
},
|
||||
exporting: {
|
||||
enabled: false
|
||||
},
|
||||
series: [{
|
||||
name: 'Random data',
|
||||
data: (function () {
|
||||
// generate an array of random data
|
||||
var data = [],
|
||||
time = (new Date()).getTime(),
|
||||
i;
|
||||
|
||||
for (i = -19; i <= 0; i += 1) {
|
||||
data.push({
|
||||
x: time + i * 1000,
|
||||
y: Math.random()
|
||||
});
|
||||
}
|
||||
return data;
|
||||
}())
|
||||
}]
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
99
lib/highcharts/examples/error-bar/index.htm
Normal file
99
lib/highcharts/examples/error-bar/index.htm
Normal file
@ -0,0 +1,99 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
var chart;
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
zoomType: 'xy'
|
||||
},
|
||||
title: {
|
||||
text: 'Temperature vs Rainfall'
|
||||
},
|
||||
xAxis: [{
|
||||
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
|
||||
}],
|
||||
yAxis: [{ // Primary yAxis
|
||||
labels: {
|
||||
format: '{value} °C',
|
||||
style: {
|
||||
color: Highcharts.getOptions().colors[1]
|
||||
}
|
||||
},
|
||||
title: {
|
||||
text: 'Temperature',
|
||||
style: {
|
||||
color: Highcharts.getOptions().colors[1]
|
||||
}
|
||||
}
|
||||
}, { // Secondary yAxis
|
||||
title: {
|
||||
text: 'Rainfall',
|
||||
style: {
|
||||
color: Highcharts.getOptions().colors[0]
|
||||
}
|
||||
},
|
||||
labels: {
|
||||
format: '{value} mm',
|
||||
style: {
|
||||
color: Highcharts.getOptions().colors[0]
|
||||
}
|
||||
},
|
||||
opposite: true
|
||||
}],
|
||||
|
||||
tooltip: {
|
||||
shared: true
|
||||
},
|
||||
|
||||
series: [{
|
||||
name: 'Rainfall',
|
||||
type: 'column',
|
||||
yAxis: 1,
|
||||
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],
|
||||
tooltip: {
|
||||
pointFormat: '<span style="font-weight: bold; color: {series.color}">{series.name}</span>: <b>{point.y:.1f} mm</b> '
|
||||
}
|
||||
}, {
|
||||
name: 'Rainfall error',
|
||||
type: 'errorbar',
|
||||
yAxis: 1,
|
||||
data: [[48, 51], [68, 73], [92, 110], [128, 136], [140, 150], [171, 179], [135, 143], [142, 149], [204, 220], [189, 199], [95, 110], [52, 56]],
|
||||
tooltip: {
|
||||
pointFormat: '(error range: {point.low}-{point.high} mm)<br/>'
|
||||
}
|
||||
}, {
|
||||
name: 'Temperature',
|
||||
type: 'spline',
|
||||
data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6],
|
||||
tooltip: {
|
||||
pointFormat: '<span style="font-weight: bold; color: {series.color}">{series.name}</span>: <b>{point.y:.1f}°C</b> '
|
||||
}
|
||||
}, {
|
||||
name: 'Temperature error',
|
||||
type: 'errorbar',
|
||||
data: [[6, 8], [5.9, 7.6], [9.4, 10.4], [14.1, 15.9], [18.0, 20.1], [21.0, 24.0], [23.2, 25.3], [26.1, 27.8], [23.2, 23.9], [18.0, 21.1], [12.9, 14.0], [7.6, 10.0]],
|
||||
tooltip: {
|
||||
pointFormat: '(error range: {point.low}-{point.high}°C)<br/>'
|
||||
}
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/highcharts-more.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="height: 400px; margin: auto; min-width: 310px; max-width: 600px"></div>
|
||||
</body>
|
||||
</html>
|
||||
64
lib/highcharts/examples/funnel/index.htm
Normal file
64
lib/highcharts/examples/funnel/index.htm
Normal file
@ -0,0 +1,64 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'funnel',
|
||||
marginRight: 100
|
||||
},
|
||||
title: {
|
||||
text: 'Sales funnel',
|
||||
x: -50
|
||||
},
|
||||
plotOptions: {
|
||||
series: {
|
||||
dataLabels: {
|
||||
enabled: true,
|
||||
format: '<b>{point.name}</b> ({point.y:,.0f})',
|
||||
color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black',
|
||||
softConnector: true
|
||||
},
|
||||
neckWidth: '30%',
|
||||
neckHeight: '25%'
|
||||
|
||||
//-- Other available options
|
||||
// height: pixels or percent
|
||||
// width: pixels or percent
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
enabled: false
|
||||
},
|
||||
series: [{
|
||||
name: 'Unique users',
|
||||
data: [
|
||||
['Website visits', 15654],
|
||||
['Downloads', 4064],
|
||||
['Requested price list', 1987],
|
||||
['Invoice sent', 976],
|
||||
['Finalized', 846]
|
||||
]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/funnel.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 410px; max-width: 600px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
198
lib/highcharts/examples/gauge-clock/index.htm
Normal file
198
lib/highcharts/examples/gauge-clock/index.htm
Normal file
@ -0,0 +1,198 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
|
||||
/**
|
||||
* Get the current time
|
||||
*/
|
||||
function getNow() {
|
||||
var now = new Date();
|
||||
|
||||
return {
|
||||
hours: now.getHours() + now.getMinutes() / 60,
|
||||
minutes: now.getMinutes() * 12 / 60 + now.getSeconds() * 12 / 3600,
|
||||
seconds: now.getSeconds() * 12 / 60
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Pad numbers
|
||||
*/
|
||||
function pad(number, length) {
|
||||
// Create an array of the remaining length + 1 and join it with 0's
|
||||
return new Array((length || 2) + 1 - String(number).length).join(0) + number;
|
||||
}
|
||||
|
||||
var now = getNow();
|
||||
|
||||
// Create the chart
|
||||
$('#container').highcharts({
|
||||
|
||||
chart: {
|
||||
type: 'gauge',
|
||||
plotBackgroundColor: null,
|
||||
plotBackgroundImage: null,
|
||||
plotBorderWidth: 0,
|
||||
plotShadow: false,
|
||||
height: 200
|
||||
},
|
||||
|
||||
credits: {
|
||||
enabled: false
|
||||
},
|
||||
|
||||
title: {
|
||||
text: 'The Highcharts clock'
|
||||
},
|
||||
|
||||
pane: {
|
||||
background: [{
|
||||
// default background
|
||||
}, {
|
||||
// reflex for supported browsers
|
||||
backgroundColor: Highcharts.svg ? {
|
||||
radialGradient: {
|
||||
cx: 0.5,
|
||||
cy: -0.4,
|
||||
r: 1.9
|
||||
},
|
||||
stops: [
|
||||
[0.5, 'rgba(255, 255, 255, 0.2)'],
|
||||
[0.5, 'rgba(200, 200, 200, 0.2)']
|
||||
]
|
||||
} : null
|
||||
}]
|
||||
},
|
||||
|
||||
yAxis: {
|
||||
labels: {
|
||||
distance: -20
|
||||
},
|
||||
min: 0,
|
||||
max: 12,
|
||||
lineWidth: 0,
|
||||
showFirstLabel: false,
|
||||
|
||||
minorTickInterval: 'auto',
|
||||
minorTickWidth: 1,
|
||||
minorTickLength: 5,
|
||||
minorTickPosition: 'inside',
|
||||
minorGridLineWidth: 0,
|
||||
minorTickColor: '#666',
|
||||
|
||||
tickInterval: 1,
|
||||
tickWidth: 2,
|
||||
tickPosition: 'inside',
|
||||
tickLength: 10,
|
||||
tickColor: '#666',
|
||||
title: {
|
||||
text: 'Powered by<br/>Highcharts',
|
||||
style: {
|
||||
color: '#BBB',
|
||||
fontWeight: 'normal',
|
||||
fontSize: '8px',
|
||||
lineHeight: '10px'
|
||||
},
|
||||
y: 10
|
||||
}
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
formatter: function () {
|
||||
return this.series.chart.tooltipText;
|
||||
}
|
||||
},
|
||||
|
||||
series: [{
|
||||
data: [{
|
||||
id: 'hour',
|
||||
y: now.hours,
|
||||
dial: {
|
||||
radius: '60%',
|
||||
baseWidth: 4,
|
||||
baseLength: '95%',
|
||||
rearLength: 0
|
||||
}
|
||||
}, {
|
||||
id: 'minute',
|
||||
y: now.minutes,
|
||||
dial: {
|
||||
baseLength: '95%',
|
||||
rearLength: 0
|
||||
}
|
||||
}, {
|
||||
id: 'second',
|
||||
y: now.seconds,
|
||||
dial: {
|
||||
radius: '100%',
|
||||
baseWidth: 1,
|
||||
rearLength: '20%'
|
||||
}
|
||||
}],
|
||||
animation: false,
|
||||
dataLabels: {
|
||||
enabled: false
|
||||
}
|
||||
}]
|
||||
},
|
||||
|
||||
// Move
|
||||
function (chart) {
|
||||
setInterval(function () {
|
||||
|
||||
now = getNow();
|
||||
|
||||
var hour = chart.get('hour'),
|
||||
minute = chart.get('minute'),
|
||||
second = chart.get('second'),
|
||||
// run animation unless we're wrapping around from 59 to 0
|
||||
animation = now.seconds === 0 ?
|
||||
false :
|
||||
{
|
||||
easing: 'easeOutElastic'
|
||||
};
|
||||
|
||||
// Cache the tooltip text
|
||||
chart.tooltipText =
|
||||
pad(Math.floor(now.hours), 2) + ':' +
|
||||
pad(Math.floor(now.minutes * 5), 2) + ':' +
|
||||
pad(now.seconds * 5, 2);
|
||||
|
||||
hour.update(now.hours, true, animation);
|
||||
minute.update(now.minutes, true, animation);
|
||||
second.update(now.seconds, true, animation);
|
||||
|
||||
}, 1000);
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
// Extend jQuery with some easing (copied from jQuery UI)
|
||||
$.extend($.easing, {
|
||||
easeOutElastic: function (x, t, b, c, d) {
|
||||
var s=1.70158;var p=0;var a=c;
|
||||
if (t==0) return b; if ((t/=d)==1) return b+c; if (!p) p=d*.3;
|
||||
if (a < Math.abs(c)) { a=c; var s=p/4; }
|
||||
else var s = p/(2*Math.PI) * Math.asin (c/a);
|
||||
return a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b;
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/highcharts-more.js"></script>
|
||||
|
||||
<div id="container" style="width: 300px; height: 300px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
125
lib/highcharts/examples/gauge-dual/index.htm
Normal file
125
lib/highcharts/examples/gauge-dual/index.htm
Normal file
@ -0,0 +1,125 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
|
||||
chart: {
|
||||
type: 'gauge',
|
||||
alignTicks: false,
|
||||
plotBackgroundColor: null,
|
||||
plotBackgroundImage: null,
|
||||
plotBorderWidth: 0,
|
||||
plotShadow: false
|
||||
},
|
||||
|
||||
title: {
|
||||
text: 'Speedometer with dual axes'
|
||||
},
|
||||
|
||||
pane: {
|
||||
startAngle: -150,
|
||||
endAngle: 150
|
||||
},
|
||||
|
||||
yAxis: [{
|
||||
min: 0,
|
||||
max: 200,
|
||||
lineColor: '#339',
|
||||
tickColor: '#339',
|
||||
minorTickColor: '#339',
|
||||
offset: -25,
|
||||
lineWidth: 2,
|
||||
labels: {
|
||||
distance: -20,
|
||||
rotation: 'auto'
|
||||
},
|
||||
tickLength: 5,
|
||||
minorTickLength: 5,
|
||||
endOnTick: false
|
||||
}, {
|
||||
min: 0,
|
||||
max: 124,
|
||||
tickPosition: 'outside',
|
||||
lineColor: '#933',
|
||||
lineWidth: 2,
|
||||
minorTickPosition: 'outside',
|
||||
tickColor: '#933',
|
||||
minorTickColor: '#933',
|
||||
tickLength: 5,
|
||||
minorTickLength: 5,
|
||||
labels: {
|
||||
distance: 12,
|
||||
rotation: 'auto'
|
||||
},
|
||||
offset: -20,
|
||||
endOnTick: false
|
||||
}],
|
||||
|
||||
series: [{
|
||||
name: 'Speed',
|
||||
data: [80],
|
||||
dataLabels: {
|
||||
formatter: function () {
|
||||
var kmh = this.y,
|
||||
mph = Math.round(kmh * 0.621);
|
||||
return '<span style="color:#339">' + kmh + ' km/h</span><br/>' +
|
||||
'<span style="color:#933">' + mph + ' mph</span>';
|
||||
},
|
||||
backgroundColor: {
|
||||
linearGradient: {
|
||||
x1: 0,
|
||||
y1: 0,
|
||||
x2: 0,
|
||||
y2: 1
|
||||
},
|
||||
stops: [
|
||||
[0, '#DDD'],
|
||||
[1, '#FFF']
|
||||
]
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
valueSuffix: ' km/h'
|
||||
}
|
||||
}]
|
||||
|
||||
},
|
||||
// Add some life
|
||||
function (chart) {
|
||||
setInterval(function () {
|
||||
var point = chart.series[0].points[0],
|
||||
newVal,
|
||||
inc = Math.round((Math.random() - 0.5) * 20);
|
||||
|
||||
newVal = point.y + inc;
|
||||
if (newVal < 0 || newVal > 200) {
|
||||
newVal = point.y - inc;
|
||||
}
|
||||
|
||||
point.update(newVal);
|
||||
|
||||
}, 3000);
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/highcharts-more.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; max-width: 400px; height: 300px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
175
lib/highcharts/examples/gauge-solid/index.htm
Normal file
175
lib/highcharts/examples/gauge-solid/index.htm
Normal file
@ -0,0 +1,175 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
|
||||
var gaugeOptions = {
|
||||
|
||||
chart: {
|
||||
type: 'solidgauge'
|
||||
},
|
||||
|
||||
title: null,
|
||||
|
||||
pane: {
|
||||
center: ['50%', '85%'],
|
||||
size: '140%',
|
||||
startAngle: -90,
|
||||
endAngle: 90,
|
||||
background: {
|
||||
backgroundColor: (Highcharts.theme && Highcharts.theme.background2) || '#EEE',
|
||||
innerRadius: '60%',
|
||||
outerRadius: '100%',
|
||||
shape: 'arc'
|
||||
}
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
enabled: false
|
||||
},
|
||||
|
||||
// the value axis
|
||||
yAxis: {
|
||||
stops: [
|
||||
[0.1, '#55BF3B'], // green
|
||||
[0.5, '#DDDF0D'], // yellow
|
||||
[0.9, '#DF5353'] // red
|
||||
],
|
||||
lineWidth: 0,
|
||||
minorTickInterval: null,
|
||||
tickPixelInterval: 400,
|
||||
tickWidth: 0,
|
||||
title: {
|
||||
y: -70
|
||||
},
|
||||
labels: {
|
||||
y: 16
|
||||
}
|
||||
},
|
||||
|
||||
plotOptions: {
|
||||
solidgauge: {
|
||||
dataLabels: {
|
||||
y: 5,
|
||||
borderWidth: 0,
|
||||
useHTML: true
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// The speed gauge
|
||||
$('#container-speed').highcharts(Highcharts.merge(gaugeOptions, {
|
||||
yAxis: {
|
||||
min: 0,
|
||||
max: 200,
|
||||
title: {
|
||||
text: 'Speed'
|
||||
}
|
||||
},
|
||||
|
||||
credits: {
|
||||
enabled: false
|
||||
},
|
||||
|
||||
series: [{
|
||||
name: 'Speed',
|
||||
data: [80],
|
||||
dataLabels: {
|
||||
format: '<div style="text-align:center"><span style="font-size:25px;color:' +
|
||||
((Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black') + '">{y}</span><br/>' +
|
||||
'<span style="font-size:12px;color:silver">km/h</span></div>'
|
||||
},
|
||||
tooltip: {
|
||||
valueSuffix: ' km/h'
|
||||
}
|
||||
}]
|
||||
|
||||
}));
|
||||
|
||||
// The RPM gauge
|
||||
$('#container-rpm').highcharts(Highcharts.merge(gaugeOptions, {
|
||||
yAxis: {
|
||||
min: 0,
|
||||
max: 5,
|
||||
title: {
|
||||
text: 'RPM'
|
||||
}
|
||||
},
|
||||
|
||||
series: [{
|
||||
name: 'RPM',
|
||||
data: [1],
|
||||
dataLabels: {
|
||||
format: '<div style="text-align:center"><span style="font-size:25px;color:' +
|
||||
((Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black') + '">{y:.1f}</span><br/>' +
|
||||
'<span style="font-size:12px;color:silver">* 1000 / min</span></div>'
|
||||
},
|
||||
tooltip: {
|
||||
valueSuffix: ' revolutions/min'
|
||||
}
|
||||
}]
|
||||
|
||||
}));
|
||||
|
||||
// Bring life to the dials
|
||||
setInterval(function () {
|
||||
// Speed
|
||||
var chart = $('#container-speed').highcharts(),
|
||||
point,
|
||||
newVal,
|
||||
inc;
|
||||
|
||||
if (chart) {
|
||||
point = chart.series[0].points[0];
|
||||
inc = Math.round((Math.random() - 0.5) * 100);
|
||||
newVal = point.y + inc;
|
||||
|
||||
if (newVal < 0 || newVal > 200) {
|
||||
newVal = point.y - inc;
|
||||
}
|
||||
|
||||
point.update(newVal);
|
||||
}
|
||||
|
||||
// RPM
|
||||
chart = $('#container-rpm').highcharts();
|
||||
if (chart) {
|
||||
point = chart.series[0].points[0];
|
||||
inc = Math.random() - 0.5;
|
||||
newVal = point.y + inc;
|
||||
|
||||
if (newVal < 0 || newVal > 5) {
|
||||
newVal = point.y - inc;
|
||||
}
|
||||
|
||||
point.update(newVal);
|
||||
}
|
||||
}, 2000);
|
||||
|
||||
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/highcharts-more.js"></script>
|
||||
|
||||
<script src="../../js/modules/solid-gauge.js"></script>
|
||||
|
||||
<div style="width: 600px; height: 400px; margin: 0 auto">
|
||||
<div id="container-speed" style="width: 300px; height: 200px; float: left"></div>
|
||||
<div id="container-rpm" style="width: 300px; height: 200px; float: left"></div>
|
||||
</div>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
137
lib/highcharts/examples/gauge-speedometer/index.htm
Normal file
137
lib/highcharts/examples/gauge-speedometer/index.htm
Normal file
@ -0,0 +1,137 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
|
||||
$('#container').highcharts({
|
||||
|
||||
chart: {
|
||||
type: 'gauge',
|
||||
plotBackgroundColor: null,
|
||||
plotBackgroundImage: null,
|
||||
plotBorderWidth: 0,
|
||||
plotShadow: false
|
||||
},
|
||||
|
||||
title: {
|
||||
text: 'Speedometer'
|
||||
},
|
||||
|
||||
pane: {
|
||||
startAngle: -150,
|
||||
endAngle: 150,
|
||||
background: [{
|
||||
backgroundColor: {
|
||||
linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
|
||||
stops: [
|
||||
[0, '#FFF'],
|
||||
[1, '#333']
|
||||
]
|
||||
},
|
||||
borderWidth: 0,
|
||||
outerRadius: '109%'
|
||||
}, {
|
||||
backgroundColor: {
|
||||
linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
|
||||
stops: [
|
||||
[0, '#333'],
|
||||
[1, '#FFF']
|
||||
]
|
||||
},
|
||||
borderWidth: 1,
|
||||
outerRadius: '107%'
|
||||
}, {
|
||||
// default background
|
||||
}, {
|
||||
backgroundColor: '#DDD',
|
||||
borderWidth: 0,
|
||||
outerRadius: '105%',
|
||||
innerRadius: '103%'
|
||||
}]
|
||||
},
|
||||
|
||||
// the value axis
|
||||
yAxis: {
|
||||
min: 0,
|
||||
max: 200,
|
||||
|
||||
minorTickInterval: 'auto',
|
||||
minorTickWidth: 1,
|
||||
minorTickLength: 10,
|
||||
minorTickPosition: 'inside',
|
||||
minorTickColor: '#666',
|
||||
|
||||
tickPixelInterval: 30,
|
||||
tickWidth: 2,
|
||||
tickPosition: 'inside',
|
||||
tickLength: 10,
|
||||
tickColor: '#666',
|
||||
labels: {
|
||||
step: 2,
|
||||
rotation: 'auto'
|
||||
},
|
||||
title: {
|
||||
text: 'km/h'
|
||||
},
|
||||
plotBands: [{
|
||||
from: 0,
|
||||
to: 120,
|
||||
color: '#55BF3B' // green
|
||||
}, {
|
||||
from: 120,
|
||||
to: 160,
|
||||
color: '#DDDF0D' // yellow
|
||||
}, {
|
||||
from: 160,
|
||||
to: 200,
|
||||
color: '#DF5353' // red
|
||||
}]
|
||||
},
|
||||
|
||||
series: [{
|
||||
name: 'Speed',
|
||||
data: [80],
|
||||
tooltip: {
|
||||
valueSuffix: ' km/h'
|
||||
}
|
||||
}]
|
||||
|
||||
},
|
||||
// Add some life
|
||||
function (chart) {
|
||||
if (!chart.renderer.forExport) {
|
||||
setInterval(function () {
|
||||
var point = chart.series[0].points[0],
|
||||
newVal,
|
||||
inc = Math.round((Math.random() - 0.5) * 20);
|
||||
|
||||
newVal = point.y + inc;
|
||||
if (newVal < 0 || newVal > 200) {
|
||||
newVal = point.y - inc;
|
||||
}
|
||||
|
||||
point.update(newVal);
|
||||
|
||||
}, 3000);
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/highcharts-more.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; max-width: 400px; height: 300px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
157
lib/highcharts/examples/gauge-vu-meter/index.htm
Normal file
157
lib/highcharts/examples/gauge-vu-meter/index.htm
Normal file
@ -0,0 +1,157 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
|
||||
chart: {
|
||||
type: 'gauge',
|
||||
plotBorderWidth: 1,
|
||||
plotBackgroundColor: {
|
||||
linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
|
||||
stops: [
|
||||
[0, '#FFF4C6'],
|
||||
[0.3, '#FFFFFF'],
|
||||
[1, '#FFF4C6']
|
||||
]
|
||||
},
|
||||
plotBackgroundImage: null,
|
||||
height: 200
|
||||
},
|
||||
|
||||
title: {
|
||||
text: 'VU meter'
|
||||
},
|
||||
|
||||
pane: [{
|
||||
startAngle: -45,
|
||||
endAngle: 45,
|
||||
background: null,
|
||||
center: ['25%', '145%'],
|
||||
size: 300
|
||||
}, {
|
||||
startAngle: -45,
|
||||
endAngle: 45,
|
||||
background: null,
|
||||
center: ['75%', '145%'],
|
||||
size: 300
|
||||
}],
|
||||
|
||||
tooltip: {
|
||||
enabled: false
|
||||
},
|
||||
|
||||
yAxis: [{
|
||||
min: -20,
|
||||
max: 6,
|
||||
minorTickPosition: 'outside',
|
||||
tickPosition: 'outside',
|
||||
labels: {
|
||||
rotation: 'auto',
|
||||
distance: 20
|
||||
},
|
||||
plotBands: [{
|
||||
from: 0,
|
||||
to: 6,
|
||||
color: '#C02316',
|
||||
innerRadius: '100%',
|
||||
outerRadius: '105%'
|
||||
}],
|
||||
pane: 0,
|
||||
title: {
|
||||
text: 'VU<br/><span style="font-size:8px">Channel A</span>',
|
||||
y: -40
|
||||
}
|
||||
}, {
|
||||
min: -20,
|
||||
max: 6,
|
||||
minorTickPosition: 'outside',
|
||||
tickPosition: 'outside',
|
||||
labels: {
|
||||
rotation: 'auto',
|
||||
distance: 20
|
||||
},
|
||||
plotBands: [{
|
||||
from: 0,
|
||||
to: 6,
|
||||
color: '#C02316',
|
||||
innerRadius: '100%',
|
||||
outerRadius: '105%'
|
||||
}],
|
||||
pane: 1,
|
||||
title: {
|
||||
text: 'VU<br/><span style="font-size:8px">Channel B</span>',
|
||||
y: -40
|
||||
}
|
||||
}],
|
||||
|
||||
plotOptions: {
|
||||
gauge: {
|
||||
dataLabels: {
|
||||
enabled: false
|
||||
},
|
||||
dial: {
|
||||
radius: '100%'
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
series: [{
|
||||
name: 'Channel A',
|
||||
data: [-20],
|
||||
yAxis: 0
|
||||
}, {
|
||||
name: 'Channel B',
|
||||
data: [-20],
|
||||
yAxis: 1
|
||||
}]
|
||||
|
||||
},
|
||||
|
||||
// Let the music play
|
||||
function (chart) {
|
||||
setInterval(function () {
|
||||
if (chart.series) { // the chart may be destroyed
|
||||
var left = chart.series[0].points[0],
|
||||
right = chart.series[1].points[0],
|
||||
leftVal,
|
||||
rightVal,
|
||||
inc = (Math.random() - 0.5) * 3;
|
||||
|
||||
leftVal = left.y + inc;
|
||||
rightVal = leftVal + inc / 3;
|
||||
if (leftVal < -20 || leftVal > 6) {
|
||||
leftVal = left.y - inc;
|
||||
}
|
||||
if (rightVal < -20 || rightVal > 6) {
|
||||
rightVal = leftVal;
|
||||
}
|
||||
|
||||
left.update(leftVal, false);
|
||||
right.update(rightVal, false);
|
||||
chart.redraw();
|
||||
}
|
||||
}, 500);
|
||||
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/highcharts-more.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="width: 600px; height: 300px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
8950
lib/highcharts/examples/heatmap-canvas/index.htm
Normal file
8950
lib/highcharts/examples/heatmap-canvas/index.htm
Normal file
File diff suppressed because it is too large
Load Diff
81
lib/highcharts/examples/heatmap/index.htm
Normal file
81
lib/highcharts/examples/heatmap/index.htm
Normal file
@ -0,0 +1,81 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
|
||||
$('#container').highcharts({
|
||||
|
||||
chart: {
|
||||
type: 'heatmap',
|
||||
marginTop: 40,
|
||||
marginBottom: 80,
|
||||
plotBorderWidth: 1
|
||||
},
|
||||
|
||||
|
||||
title: {
|
||||
text: 'Sales per employee per weekday'
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
categories: ['Alexander', 'Marie', 'Maximilian', 'Sophia', 'Lukas', 'Maria', 'Leon', 'Anna', 'Tim', 'Laura']
|
||||
},
|
||||
|
||||
yAxis: {
|
||||
categories: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday'],
|
||||
title: null
|
||||
},
|
||||
|
||||
colorAxis: {
|
||||
min: 0,
|
||||
minColor: '#FFFFFF',
|
||||
maxColor: Highcharts.getOptions().colors[0]
|
||||
},
|
||||
|
||||
legend: {
|
||||
align: 'right',
|
||||
layout: 'vertical',
|
||||
margin: 0,
|
||||
verticalAlign: 'top',
|
||||
y: 25,
|
||||
symbolHeight: 280
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
formatter: function () {
|
||||
return '<b>' + this.series.xAxis.categories[this.point.x] + '</b> sold <br><b>' +
|
||||
this.point.value + '</b> items on <br><b>' + this.series.yAxis.categories[this.point.y] + '</b>';
|
||||
}
|
||||
},
|
||||
|
||||
series: [{
|
||||
name: 'Sales per employee',
|
||||
borderWidth: 1,
|
||||
data: [[0, 0, 10], [0, 1, 19], [0, 2, 8], [0, 3, 24], [0, 4, 67], [1, 0, 92], [1, 1, 58], [1, 2, 78], [1, 3, 117], [1, 4, 48], [2, 0, 35], [2, 1, 15], [2, 2, 123], [2, 3, 64], [2, 4, 52], [3, 0, 72], [3, 1, 132], [3, 2, 114], [3, 3, 19], [3, 4, 16], [4, 0, 38], [4, 1, 5], [4, 2, 8], [4, 3, 117], [4, 4, 115], [5, 0, 88], [5, 1, 32], [5, 2, 12], [5, 3, 6], [5, 4, 120], [6, 0, 13], [6, 1, 44], [6, 2, 88], [6, 3, 98], [6, 4, 96], [7, 0, 31], [7, 1, 1], [7, 2, 82], [7, 3, 32], [7, 4, 30], [8, 0, 85], [8, 1, 97], [8, 2, 123], [8, 3, 64], [8, 4, 84], [9, 0, 47], [9, 1, 114], [9, 2, 31], [9, 3, 48], [9, 4, 91]],
|
||||
dataLabels: {
|
||||
enabled: true,
|
||||
color: '#000000'
|
||||
}
|
||||
}]
|
||||
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/heatmap.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
|
||||
<div id="container" style="height: 400px; min-width: 310px; max-width: 800px; margin: 0 auto"></div>
|
||||
</body>
|
||||
</html>
|
||||
135
lib/highcharts/examples/line-ajax/index.htm
Normal file
135
lib/highcharts/examples/line-ajax/index.htm
Normal file
@ -0,0 +1,135 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
|
||||
// Get the CSV and create the chart
|
||||
$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=analytics.csv&callback=?', function (csv) {
|
||||
|
||||
$('#container').highcharts({
|
||||
|
||||
data: {
|
||||
csv: csv
|
||||
},
|
||||
|
||||
title: {
|
||||
text: 'Daily visits at www.highcharts.com'
|
||||
},
|
||||
|
||||
subtitle: {
|
||||
text: 'Source: Google Analytics'
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
tickInterval: 7 * 24 * 3600 * 1000, // one week
|
||||
tickWidth: 0,
|
||||
gridLineWidth: 1,
|
||||
labels: {
|
||||
align: 'left',
|
||||
x: 3,
|
||||
y: -3
|
||||
}
|
||||
},
|
||||
|
||||
yAxis: [{ // left y axis
|
||||
title: {
|
||||
text: null
|
||||
},
|
||||
labels: {
|
||||
align: 'left',
|
||||
x: 3,
|
||||
y: 16,
|
||||
format: '{value:.,0f}'
|
||||
},
|
||||
showFirstLabel: false
|
||||
}, { // right y axis
|
||||
linkedTo: 0,
|
||||
gridLineWidth: 0,
|
||||
opposite: true,
|
||||
title: {
|
||||
text: null
|
||||
},
|
||||
labels: {
|
||||
align: 'right',
|
||||
x: -3,
|
||||
y: 16,
|
||||
format: '{value:.,0f}'
|
||||
},
|
||||
showFirstLabel: false
|
||||
}],
|
||||
|
||||
legend: {
|
||||
align: 'left',
|
||||
verticalAlign: 'top',
|
||||
y: 20,
|
||||
floating: true,
|
||||
borderWidth: 0
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
shared: true,
|
||||
crosshairs: true
|
||||
},
|
||||
|
||||
plotOptions: {
|
||||
series: {
|
||||
cursor: 'pointer',
|
||||
point: {
|
||||
events: {
|
||||
click: function (e) {
|
||||
hs.htmlExpand(null, {
|
||||
pageOrigin: {
|
||||
x: e.pageX || e.clientX,
|
||||
y: e.pageY || e.clientY
|
||||
},
|
||||
headingText: this.series.name,
|
||||
maincontentText: Highcharts.dateFormat('%A, %b %e, %Y', this.x) + ':<br/> ' +
|
||||
this.y + ' visits',
|
||||
width: 200
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
marker: {
|
||||
lineWidth: 1
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
series: [{
|
||||
name: 'All visits',
|
||||
lineWidth: 4,
|
||||
marker: {
|
||||
radius: 4
|
||||
}
|
||||
}, {
|
||||
name: 'New visitors'
|
||||
}]
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/data.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<!-- Additional files for the Highslide popup effect -->
|
||||
<script src="http://www.highcharts.com/joomla/media/com_demo/js/highslide-full.min.js"></script>
|
||||
<script src="http://www.highcharts.com/joomla/media/com_demo/js/highslide.config.js" charset="utf-8"></script>
|
||||
<link rel="stylesheet" type="text/css" href="http://www.highcharts.com/joomla/media/com_demo/highslide.css" />
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
69
lib/highcharts/examples/line-basic/index.htm
Normal file
69
lib/highcharts/examples/line-basic/index.htm
Normal file
@ -0,0 +1,69 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
title: {
|
||||
text: 'Monthly Average Temperature',
|
||||
x: -20 //center
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Source: WorldClimate.com',
|
||||
x: -20
|
||||
},
|
||||
xAxis: {
|
||||
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
|
||||
'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Temperature (°C)'
|
||||
},
|
||||
plotLines: [{
|
||||
value: 0,
|
||||
width: 1,
|
||||
color: '#808080'
|
||||
}]
|
||||
},
|
||||
tooltip: {
|
||||
valueSuffix: '°C'
|
||||
},
|
||||
legend: {
|
||||
layout: 'vertical',
|
||||
align: 'right',
|
||||
verticalAlign: 'middle',
|
||||
borderWidth: 0
|
||||
},
|
||||
series: [{
|
||||
name: 'Tokyo',
|
||||
data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
|
||||
}, {
|
||||
name: 'New York',
|
||||
data: [-0.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 24.1, 20.1, 14.1, 8.6, 2.5]
|
||||
}, {
|
||||
name: 'Berlin',
|
||||
data: [-0.9, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0]
|
||||
}, {
|
||||
name: 'London',
|
||||
data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
57
lib/highcharts/examples/line-labels/index.htm
Normal file
57
lib/highcharts/examples/line-labels/index.htm
Normal file
@ -0,0 +1,57 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'line'
|
||||
},
|
||||
title: {
|
||||
text: 'Monthly Average Temperature'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Source: WorldClimate.com'
|
||||
},
|
||||
xAxis: {
|
||||
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Temperature (°C)'
|
||||
}
|
||||
},
|
||||
plotOptions: {
|
||||
line: {
|
||||
dataLabels: {
|
||||
enabled: true
|
||||
},
|
||||
enableMouseTracking: false
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: 'Tokyo',
|
||||
data: [7.0, 6.9, 9.5, 14.5, 18.4, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
|
||||
}, {
|
||||
name: 'London',
|
||||
data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
48
lib/highcharts/examples/line-log-axis/index.htm
Normal file
48
lib/highcharts/examples/line-log-axis/index.htm
Normal file
@ -0,0 +1,48 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
|
||||
title: {
|
||||
text: 'Logarithmic axis demo'
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
tickInterval: 1
|
||||
},
|
||||
|
||||
yAxis: {
|
||||
type: 'logarithmic',
|
||||
minorTickInterval: 0.1
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
headerFormat: '<b>{series.name}</b><br />',
|
||||
pointFormat: 'x = {point.x}, y = {point.y}'
|
||||
},
|
||||
|
||||
series: [{
|
||||
data: [1, 2, 4, 8, 16, 32, 64, 128, 256, 512],
|
||||
pointStart: 1
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
81
lib/highcharts/examples/line-time-series/index.htm
Normal file
81
lib/highcharts/examples/line-time-series/index.htm
Normal file
@ -0,0 +1,81 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=usdeur.json&callback=?', function (data) {
|
||||
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
zoomType: 'x'
|
||||
},
|
||||
title: {
|
||||
text: 'USD to EUR exchange rate over time'
|
||||
},
|
||||
subtitle: {
|
||||
text: document.ontouchstart === undefined ?
|
||||
'Click and drag in the plot area to zoom in' : 'Pinch the chart to zoom in'
|
||||
},
|
||||
xAxis: {
|
||||
type: 'datetime'
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Exchange rate'
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
enabled: false
|
||||
},
|
||||
plotOptions: {
|
||||
area: {
|
||||
fillColor: {
|
||||
linearGradient: {
|
||||
x1: 0,
|
||||
y1: 0,
|
||||
x2: 0,
|
||||
y2: 1
|
||||
},
|
||||
stops: [
|
||||
[0, Highcharts.getOptions().colors[0]],
|
||||
[1, Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]
|
||||
]
|
||||
},
|
||||
marker: {
|
||||
radius: 2
|
||||
},
|
||||
lineWidth: 1,
|
||||
states: {
|
||||
hover: {
|
||||
lineWidth: 1
|
||||
}
|
||||
},
|
||||
threshold: null
|
||||
}
|
||||
},
|
||||
|
||||
series: [{
|
||||
type: 'area',
|
||||
name: 'USD to EUR',
|
||||
data: data
|
||||
}]
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
75
lib/highcharts/examples/pie-basic/index.htm
Normal file
75
lib/highcharts/examples/pie-basic/index.htm
Normal file
@ -0,0 +1,75 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
plotBackgroundColor: null,
|
||||
plotBorderWidth: null,
|
||||
plotShadow: false,
|
||||
type: 'pie'
|
||||
},
|
||||
title: {
|
||||
text: 'Browser market shares January, 2015 to May, 2015'
|
||||
},
|
||||
tooltip: {
|
||||
pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
|
||||
},
|
||||
plotOptions: {
|
||||
pie: {
|
||||
allowPointSelect: true,
|
||||
cursor: 'pointer',
|
||||
dataLabels: {
|
||||
enabled: true,
|
||||
format: '<b>{point.name}</b>: {point.percentage:.1f} %',
|
||||
style: {
|
||||
color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: "Brands",
|
||||
colorByPoint: true,
|
||||
data: [{
|
||||
name: "Microsoft Internet Explorer",
|
||||
y: 56.33
|
||||
}, {
|
||||
name: "Chrome",
|
||||
y: 24.03,
|
||||
sliced: true,
|
||||
selected: true
|
||||
}, {
|
||||
name: "Firefox",
|
||||
y: 10.38
|
||||
}, {
|
||||
name: "Safari",
|
||||
y: 4.77
|
||||
}, {
|
||||
name: "Opera",
|
||||
y: 0.91
|
||||
}, {
|
||||
name: "Proprietary or Undetectable",
|
||||
y: 0.2
|
||||
}]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
163
lib/highcharts/examples/pie-donut/index.htm
Normal file
163
lib/highcharts/examples/pie-donut/index.htm
Normal file
@ -0,0 +1,163 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
|
||||
var colors = Highcharts.getOptions().colors,
|
||||
categories = ['MSIE', 'Firefox', 'Chrome', 'Safari', 'Opera'],
|
||||
data = [{
|
||||
y: 56.33,
|
||||
color: colors[0],
|
||||
drilldown: {
|
||||
name: 'MSIE versions',
|
||||
categories: ['MSIE 6.0', 'MSIE 7.0', 'MSIE 8.0', 'MSIE 9.0', 'MSIE 10.0', 'MSIE 11.0'],
|
||||
data: [1.06, 0.5, 17.2, 8.11, 5.33, 24.13],
|
||||
color: colors[0]
|
||||
}
|
||||
}, {
|
||||
y: 10.38,
|
||||
color: colors[1],
|
||||
drilldown: {
|
||||
name: 'Firefox versions',
|
||||
categories: ['Firefox v31', 'Firefox v32', 'Firefox v33', 'Firefox v35', 'Firefox v36', 'Firefox v37', 'Firefox v38'],
|
||||
data: [0.33, 0.15, 0.22, 1.27, 2.76, 2.32, 2.31, 1.02],
|
||||
color: colors[1]
|
||||
}
|
||||
}, {
|
||||
y: 24.03,
|
||||
color: colors[2],
|
||||
drilldown: {
|
||||
name: 'Chrome versions',
|
||||
categories: ['Chrome v30.0', 'Chrome v31.0', 'Chrome v32.0', 'Chrome v33.0', 'Chrome v34.0',
|
||||
'Chrome v35.0', 'Chrome v36.0', 'Chrome v37.0', 'Chrome v38.0', 'Chrome v39.0', 'Chrome v40.0', 'Chrome v41.0', 'Chrome v42.0', 'Chrome v43.0'
|
||||
],
|
||||
data: [0.14, 1.24, 0.55, 0.19, 0.14, 0.85, 2.53, 0.38, 0.6, 2.96, 5, 4.32, 3.68, 1.45],
|
||||
color: colors[2]
|
||||
}
|
||||
}, {
|
||||
y: 4.77,
|
||||
color: colors[3],
|
||||
drilldown: {
|
||||
name: 'Safari versions',
|
||||
categories: ['Safari v5.0', 'Safari v5.1', 'Safari v6.1', 'Safari v6.2', 'Safari v7.0', 'Safari v7.1', 'Safari v8.0'],
|
||||
data: [0.3, 0.42, 0.29, 0.17, 0.26, 0.77, 2.56],
|
||||
color: colors[3]
|
||||
}
|
||||
}, {
|
||||
y: 0.91,
|
||||
color: colors[4],
|
||||
drilldown: {
|
||||
name: 'Opera versions',
|
||||
categories: ['Opera v12.x', 'Opera v27', 'Opera v28', 'Opera v29'],
|
||||
data: [0.34, 0.17, 0.24, 0.16],
|
||||
color: colors[4]
|
||||
}
|
||||
}, {
|
||||
y: 0.2,
|
||||
color: colors[5],
|
||||
drilldown: {
|
||||
name: 'Proprietary or Undetectable',
|
||||
categories: [],
|
||||
data: [],
|
||||
color: colors[5]
|
||||
}
|
||||
}],
|
||||
browserData = [],
|
||||
versionsData = [],
|
||||
i,
|
||||
j,
|
||||
dataLen = data.length,
|
||||
drillDataLen,
|
||||
brightness;
|
||||
|
||||
|
||||
// Build the data arrays
|
||||
for (i = 0; i < dataLen; i += 1) {
|
||||
|
||||
// add browser data
|
||||
browserData.push({
|
||||
name: categories[i],
|
||||
y: data[i].y,
|
||||
color: data[i].color
|
||||
});
|
||||
|
||||
// add version data
|
||||
drillDataLen = data[i].drilldown.data.length;
|
||||
for (j = 0; j < drillDataLen; j += 1) {
|
||||
brightness = 0.2 - (j / drillDataLen) / 5;
|
||||
versionsData.push({
|
||||
name: data[i].drilldown.categories[j],
|
||||
y: data[i].drilldown.data[j],
|
||||
color: Highcharts.Color(data[i].color).brighten(brightness).get()
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// Create the chart
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'pie'
|
||||
},
|
||||
title: {
|
||||
text: 'Browser market share, January, 2015 to May, 2015'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Source: <a href="http://netmarketshare.com/">netmarketshare.com</a>'
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Total percent market share'
|
||||
}
|
||||
},
|
||||
plotOptions: {
|
||||
pie: {
|
||||
shadow: false,
|
||||
center: ['50%', '50%']
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
valueSuffix: '%'
|
||||
},
|
||||
series: [{
|
||||
name: 'Browsers',
|
||||
data: browserData,
|
||||
size: '60%',
|
||||
dataLabels: {
|
||||
formatter: function () {
|
||||
return this.y > 5 ? this.point.name : null;
|
||||
},
|
||||
color: '#ffffff',
|
||||
distance: -30
|
||||
}
|
||||
}, {
|
||||
name: 'Versions',
|
||||
data: versionsData,
|
||||
size: '80%',
|
||||
innerSize: '60%',
|
||||
dataLabels: {
|
||||
formatter: function () {
|
||||
// display only if larger than 1
|
||||
return this.y > 1 ? '<b>' + this.point.name + ':</b> ' + this.y + '%' : null;
|
||||
}
|
||||
}
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="width: 600px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
188
lib/highcharts/examples/pie-drilldown/index.htm
Normal file
188
lib/highcharts/examples/pie-drilldown/index.htm
Normal file
@ -0,0 +1,188 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
// Create the chart
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'pie'
|
||||
},
|
||||
title: {
|
||||
text: 'Browser market shares. January, 2015 to May, 2015'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Click the slices to view versions. Source: netmarketshare.com.'
|
||||
},
|
||||
plotOptions: {
|
||||
series: {
|
||||
dataLabels: {
|
||||
enabled: true,
|
||||
format: '{point.name}: {point.y:.1f}%'
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
|
||||
pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.2f}%</b> of total<br/>'
|
||||
},
|
||||
series: [{
|
||||
name: "Brands",
|
||||
colorByPoint: true,
|
||||
data: [{
|
||||
name: "Microsoft Internet Explorer",
|
||||
y: 56.33,
|
||||
drilldown: "Microsoft Internet Explorer"
|
||||
}, {
|
||||
name: "Chrome",
|
||||
y: 24.03,
|
||||
drilldown: "Chrome"
|
||||
}, {
|
||||
name: "Firefox",
|
||||
y: 10.38,
|
||||
drilldown: "Firefox"
|
||||
}, {
|
||||
name: "Safari",
|
||||
y: 4.77,
|
||||
drilldown: "Safari"
|
||||
}, {
|
||||
name: "Opera",
|
||||
y: 0.91,
|
||||
drilldown: "Opera"
|
||||
}, {
|
||||
name: "Proprietary or Undetectable",
|
||||
y: 0.2,
|
||||
drilldown: null
|
||||
}]
|
||||
}],
|
||||
drilldown: {
|
||||
series: [{
|
||||
name: "Microsoft Internet Explorer",
|
||||
id: "Microsoft Internet Explorer",
|
||||
data: [
|
||||
["v11.0", 24.13],
|
||||
["v8.0", 17.2],
|
||||
["v9.0", 8.11],
|
||||
["v10.0", 5.33],
|
||||
["v6.0", 1.06],
|
||||
["v7.0", 0.5]
|
||||
]
|
||||
}, {
|
||||
name: "Chrome",
|
||||
id: "Chrome",
|
||||
data: [
|
||||
["v40.0", 5],
|
||||
["v41.0", 4.32],
|
||||
["v42.0", 3.68],
|
||||
["v39.0", 2.96],
|
||||
["v36.0", 2.53],
|
||||
["v43.0", 1.45],
|
||||
["v31.0", 1.24],
|
||||
["v35.0", 0.85],
|
||||
["v38.0", 0.6],
|
||||
["v32.0", 0.55],
|
||||
["v37.0", 0.38],
|
||||
["v33.0", 0.19],
|
||||
["v34.0", 0.14],
|
||||
["v30.0", 0.14]
|
||||
]
|
||||
}, {
|
||||
name: "Firefox",
|
||||
id: "Firefox",
|
||||
data: [
|
||||
["v35", 2.76],
|
||||
["v36", 2.32],
|
||||
["v37", 2.31],
|
||||
["v34", 1.27],
|
||||
["v38", 1.02],
|
||||
["v31", 0.33],
|
||||
["v33", 0.22],
|
||||
["v32", 0.15]
|
||||
]
|
||||
}, {
|
||||
name: "Safari",
|
||||
id: "Safari",
|
||||
data: [
|
||||
["v8.0", 2.56],
|
||||
["v7.1", 0.77],
|
||||
["v5.1", 0.42],
|
||||
["v5.0", 0.3],
|
||||
["v6.1", 0.29],
|
||||
["v7.0", 0.26],
|
||||
["v6.2", 0.17]
|
||||
]
|
||||
}, {
|
||||
name: "Opera",
|
||||
id: "Opera",
|
||||
data: [
|
||||
["v12.x", 0.34],
|
||||
["v28", 0.24],
|
||||
["v27", 0.17],
|
||||
["v29", 0.16]
|
||||
]
|
||||
}]
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/data.js"></script>
|
||||
<script src="../../js/modules/drilldown.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; max-width: 600px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
<!-- Data from www.netmarketshare.com. Select Browsers => Desktop share by version. Download as tsv. -->
|
||||
<pre id="tsv" style="display:none">Browser Version Total Market Share
|
||||
Microsoft Internet Explorer 8.0 26.61%
|
||||
Microsoft Internet Explorer 9.0 16.96%
|
||||
Chrome 18.0 8.01%
|
||||
Chrome 19.0 7.73%
|
||||
Firefox 12 6.72%
|
||||
Microsoft Internet Explorer 6.0 6.40%
|
||||
Firefox 11 4.72%
|
||||
Microsoft Internet Explorer 7.0 3.55%
|
||||
Safari 5.1 3.53%
|
||||
Firefox 13 2.16%
|
||||
Firefox 3.6 1.87%
|
||||
Opera 11.x 1.30%
|
||||
Chrome 17.0 1.13%
|
||||
Firefox 10 0.90%
|
||||
Safari 5.0 0.85%
|
||||
Firefox 9.0 0.65%
|
||||
Firefox 8.0 0.55%
|
||||
Firefox 4.0 0.50%
|
||||
Chrome 16.0 0.45%
|
||||
Firefox 3.0 0.36%
|
||||
Firefox 3.5 0.36%
|
||||
Firefox 6.0 0.32%
|
||||
Firefox 5.0 0.31%
|
||||
Firefox 7.0 0.29%
|
||||
Proprietary or Undetectable 0.29%
|
||||
Chrome 18.0 - Maxthon Edition 0.26%
|
||||
Chrome 14.0 0.25%
|
||||
Chrome 20.0 0.24%
|
||||
Chrome 15.0 0.18%
|
||||
Chrome 12.0 0.16%
|
||||
Opera 12.x 0.15%
|
||||
Safari 4.0 0.14%
|
||||
Chrome 13.0 0.13%
|
||||
Safari 4.1 0.12%
|
||||
Chrome 11.0 0.10%
|
||||
Firefox 14 0.10%
|
||||
Firefox 2.0 0.09%
|
||||
Chrome 10.0 0.09%
|
||||
Opera 10.x 0.09%
|
||||
Microsoft Internet Explorer 8.0 - Tencent Traveler Edition 0.09%</pre>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
83
lib/highcharts/examples/pie-gradient/index.htm
Normal file
83
lib/highcharts/examples/pie-gradient/index.htm
Normal file
@ -0,0 +1,83 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
|
||||
// Radialize the colors
|
||||
Highcharts.getOptions().colors = Highcharts.map(Highcharts.getOptions().colors, function (color) {
|
||||
return {
|
||||
radialGradient: {
|
||||
cx: 0.5,
|
||||
cy: 0.3,
|
||||
r: 0.7
|
||||
},
|
||||
stops: [
|
||||
[0, color],
|
||||
[1, Highcharts.Color(color).brighten(-0.3).get('rgb')] // darken
|
||||
]
|
||||
};
|
||||
});
|
||||
|
||||
// Build the chart
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
plotBackgroundColor: null,
|
||||
plotBorderWidth: null,
|
||||
plotShadow: false,
|
||||
type: 'pie'
|
||||
},
|
||||
title: {
|
||||
text: 'Browser market shares. January, 2015 to May, 2015'
|
||||
},
|
||||
tooltip: {
|
||||
pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
|
||||
},
|
||||
plotOptions: {
|
||||
pie: {
|
||||
allowPointSelect: true,
|
||||
cursor: 'pointer',
|
||||
dataLabels: {
|
||||
enabled: true,
|
||||
format: '<b>{point.name}</b>: {point.percentage:.1f} %',
|
||||
style: {
|
||||
color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
|
||||
},
|
||||
connectorColor: 'silver'
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: "Brands",
|
||||
data: [
|
||||
{name: "Microsoft Internet Explorer", y: 56.33},
|
||||
{
|
||||
name: "Chrome",
|
||||
y: 24.03,
|
||||
sliced: true,
|
||||
selected: true
|
||||
},
|
||||
{name: "Firefox", y: 10.38},
|
||||
{name: "Safari", y: 4.77}, {name: "Opera", y: 0.91},
|
||||
{name: "Proprietary or Undetectable", y: 0.2}
|
||||
]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
77
lib/highcharts/examples/pie-legend/index.htm
Normal file
77
lib/highcharts/examples/pie-legend/index.htm
Normal file
@ -0,0 +1,77 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
|
||||
$(document).ready(function () {
|
||||
|
||||
// Build the chart
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
plotBackgroundColor: null,
|
||||
plotBorderWidth: null,
|
||||
plotShadow: false,
|
||||
type: 'pie'
|
||||
},
|
||||
title: {
|
||||
text: 'Browser market shares January, 2015 to May, 2015'
|
||||
},
|
||||
tooltip: {
|
||||
pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
|
||||
},
|
||||
plotOptions: {
|
||||
pie: {
|
||||
allowPointSelect: true,
|
||||
cursor: 'pointer',
|
||||
dataLabels: {
|
||||
enabled: false
|
||||
},
|
||||
showInLegend: true
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: "Brands",
|
||||
colorByPoint: true,
|
||||
data: [{
|
||||
name: "Microsoft Internet Explorer",
|
||||
y: 56.33
|
||||
}, {
|
||||
name: "Chrome",
|
||||
y: 24.03,
|
||||
sliced: true,
|
||||
selected: true
|
||||
}, {
|
||||
name: "Firefox",
|
||||
y: 10.38
|
||||
}, {
|
||||
name: "Safari",
|
||||
y: 4.77
|
||||
}, {
|
||||
name: "Opera",
|
||||
y: 0.91
|
||||
}, {
|
||||
name: "Proprietary or Undetectable",
|
||||
y: 0.2
|
||||
}]
|
||||
}]
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
77
lib/highcharts/examples/pie-monochrome/index.htm
Normal file
77
lib/highcharts/examples/pie-monochrome/index.htm
Normal file
@ -0,0 +1,77 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
|
||||
// Make monochrome colors and set them as default for all pies
|
||||
Highcharts.getOptions().plotOptions.pie.colors = (function () {
|
||||
var colors = [],
|
||||
base = Highcharts.getOptions().colors[0],
|
||||
i;
|
||||
|
||||
for (i = 0; i < 10; i += 1) {
|
||||
// Start out with a darkened base color (negative brighten), and end
|
||||
// up with a much brighter color
|
||||
colors.push(Highcharts.Color(base).brighten((i - 3) / 7).get());
|
||||
}
|
||||
return colors;
|
||||
}());
|
||||
|
||||
// Build the chart
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
plotBackgroundColor: null,
|
||||
plotBorderWidth: null,
|
||||
plotShadow: false,
|
||||
type: 'pie'
|
||||
},
|
||||
title: {
|
||||
text: 'Browser market shares at a specific website, 2014'
|
||||
},
|
||||
tooltip: {
|
||||
pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
|
||||
},
|
||||
plotOptions: {
|
||||
pie: {
|
||||
allowPointSelect: true,
|
||||
cursor: 'pointer',
|
||||
dataLabels: {
|
||||
enabled: true,
|
||||
format: '<b>{point.name}</b>: {point.percentage:.1f} %',
|
||||
style: {
|
||||
color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: "Brands",
|
||||
data: [
|
||||
{name: "Microsoft Internet Explorer", y: 56.33},
|
||||
{name: "Chrome", y: 24.03},
|
||||
{name: "Firefox", y: 10.38},
|
||||
{name: "Safari", y: 4.77},
|
||||
{name: "Opera", y: 0.91},
|
||||
{name: "Proprietary or Undetectable", y: 0.2}
|
||||
]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
76
lib/highcharts/examples/pie-semi-circle/index.htm
Normal file
76
lib/highcharts/examples/pie-semi-circle/index.htm
Normal file
@ -0,0 +1,76 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
plotBackgroundColor: null,
|
||||
plotBorderWidth: 0,
|
||||
plotShadow: false
|
||||
},
|
||||
title: {
|
||||
text: 'Browser<br>shares<br>2015',
|
||||
align: 'center',
|
||||
verticalAlign: 'middle',
|
||||
y: 40
|
||||
},
|
||||
tooltip: {
|
||||
pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
|
||||
},
|
||||
plotOptions: {
|
||||
pie: {
|
||||
dataLabels: {
|
||||
enabled: true,
|
||||
distance: -50,
|
||||
style: {
|
||||
fontWeight: 'bold',
|
||||
color: 'white',
|
||||
textShadow: '0px 1px 2px black'
|
||||
}
|
||||
},
|
||||
startAngle: -90,
|
||||
endAngle: 90,
|
||||
center: ['50%', '75%']
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
type: 'pie',
|
||||
name: 'Browser share',
|
||||
innerSize: '50%',
|
||||
data: [
|
||||
['Firefox', 10.38],
|
||||
['IE', 56.33],
|
||||
['Chrome', 24.03],
|
||||
['Safari', 4.77],
|
||||
['Opera', 0.91],
|
||||
{
|
||||
name: 'Proprietary or Undetectable',
|
||||
y: 0.2,
|
||||
dataLabels: {
|
||||
enabled: false
|
||||
}
|
||||
}
|
||||
]
|
||||
}]
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
77
lib/highcharts/examples/polar-spider/index.htm
Normal file
77
lib/highcharts/examples/polar-spider/index.htm
Normal file
@ -0,0 +1,77 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
|
||||
$('#container').highcharts({
|
||||
|
||||
chart: {
|
||||
polar: true,
|
||||
type: 'line'
|
||||
},
|
||||
|
||||
title: {
|
||||
text: 'Budget vs spending',
|
||||
x: -80
|
||||
},
|
||||
|
||||
pane: {
|
||||
size: '80%'
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
categories: ['Sales', 'Marketing', 'Development', 'Customer Support',
|
||||
'Information Technology', 'Administration'],
|
||||
tickmarkPlacement: 'on',
|
||||
lineWidth: 0
|
||||
},
|
||||
|
||||
yAxis: {
|
||||
gridLineInterpolation: 'polygon',
|
||||
lineWidth: 0,
|
||||
min: 0
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
shared: true,
|
||||
pointFormat: '<span style="color:{series.color}">{series.name}: <b>${point.y:,.0f}</b><br/>'
|
||||
},
|
||||
|
||||
legend: {
|
||||
align: 'right',
|
||||
verticalAlign: 'top',
|
||||
y: 70,
|
||||
layout: 'vertical'
|
||||
},
|
||||
|
||||
series: [{
|
||||
name: 'Allocated Budget',
|
||||
data: [43000, 19000, 60000, 35000, 17000, 10000],
|
||||
pointPlacement: 'on'
|
||||
}, {
|
||||
name: 'Actual Spending',
|
||||
data: [50000, 39000, 42000, 31000, 26000, 14000],
|
||||
pointPlacement: 'on'
|
||||
}]
|
||||
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/highcharts-more.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 400px; max-width: 600px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
299
lib/highcharts/examples/polar-wind-rose/index.htm
Normal file
299
lib/highcharts/examples/polar-wind-rose/index.htm
Normal file
@ -0,0 +1,299 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
|
||||
// Parse the data from an inline table using the Highcharts Data plugin
|
||||
$('#container').highcharts({
|
||||
data: {
|
||||
table: 'freq',
|
||||
startRow: 1,
|
||||
endRow: 17,
|
||||
endColumn: 7
|
||||
},
|
||||
|
||||
chart: {
|
||||
polar: true,
|
||||
type: 'column'
|
||||
},
|
||||
|
||||
title: {
|
||||
text: 'Wind rose for South Shore Met Station, Oregon'
|
||||
},
|
||||
|
||||
subtitle: {
|
||||
text: 'Source: or.water.usgs.gov'
|
||||
},
|
||||
|
||||
pane: {
|
||||
size: '85%'
|
||||
},
|
||||
|
||||
legend: {
|
||||
align: 'right',
|
||||
verticalAlign: 'top',
|
||||
y: 100,
|
||||
layout: 'vertical'
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
tickmarkPlacement: 'on'
|
||||
},
|
||||
|
||||
yAxis: {
|
||||
min: 0,
|
||||
endOnTick: false,
|
||||
showLastLabel: true,
|
||||
title: {
|
||||
text: 'Frequency (%)'
|
||||
},
|
||||
labels: {
|
||||
formatter: function () {
|
||||
return this.value + '%';
|
||||
}
|
||||
},
|
||||
reversedStacks: false
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
valueSuffix: '%'
|
||||
},
|
||||
|
||||
plotOptions: {
|
||||
series: {
|
||||
stacking: 'normal',
|
||||
shadow: false,
|
||||
groupPadding: 0,
|
||||
pointPlacement: 'on'
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/highcharts-more.js"></script>
|
||||
<script src="../../js/modules/data.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 420px; max-width: 600px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
<div style="display:none">
|
||||
<!-- Source: http://or.water.usgs.gov/cgi-bin/grapher/graph_windrose.pl -->
|
||||
<table id="freq" border="0" cellspacing="0" cellpadding="0">
|
||||
<tr nowrap bgcolor="#CCCCFF">
|
||||
<th colspan="9" class="hdr">Table of Frequencies (percent)</th>
|
||||
</tr>
|
||||
<tr nowrap bgcolor="#CCCCFF">
|
||||
<th class="freq">Direction</th>
|
||||
<th class="freq">< 0.5 m/s</th>
|
||||
<th class="freq">0.5-2 m/s</th>
|
||||
<th class="freq">2-4 m/s</th>
|
||||
<th class="freq">4-6 m/s</th>
|
||||
<th class="freq">6-8 m/s</th>
|
||||
<th class="freq">8-10 m/s</th>
|
||||
<th class="freq">> 10 m/s</th>
|
||||
<th class="freq">Total</th>
|
||||
</tr>
|
||||
<tr nowrap>
|
||||
<td class="dir">N</td>
|
||||
<td class="data">1.81</td>
|
||||
<td class="data">1.78</td>
|
||||
<td class="data">0.16</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">3.75</td>
|
||||
</tr>
|
||||
<tr nowrap bgcolor="#DDDDDD">
|
||||
<td class="dir">NNE</td>
|
||||
<td class="data">0.62</td>
|
||||
<td class="data">1.09</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">1.71</td>
|
||||
</tr>
|
||||
<tr nowrap>
|
||||
<td class="dir">NE</td>
|
||||
<td class="data">0.82</td>
|
||||
<td class="data">0.82</td>
|
||||
<td class="data">0.07</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">1.71</td>
|
||||
</tr>
|
||||
<tr nowrap bgcolor="#DDDDDD">
|
||||
<td class="dir">ENE</td>
|
||||
<td class="data">0.59</td>
|
||||
<td class="data">1.22</td>
|
||||
<td class="data">0.07</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">1.88</td>
|
||||
</tr>
|
||||
<tr nowrap>
|
||||
<td class="dir">E</td>
|
||||
<td class="data">0.62</td>
|
||||
<td class="data">2.20</td>
|
||||
<td class="data">0.49</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">3.32</td>
|
||||
</tr>
|
||||
<tr nowrap bgcolor="#DDDDDD">
|
||||
<td class="dir">ESE</td>
|
||||
<td class="data">1.22</td>
|
||||
<td class="data">2.01</td>
|
||||
<td class="data">1.55</td>
|
||||
<td class="data">0.30</td>
|
||||
<td class="data">0.13</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">5.20</td>
|
||||
</tr>
|
||||
<tr nowrap>
|
||||
<td class="dir">SE</td>
|
||||
<td class="data">1.61</td>
|
||||
<td class="data">3.06</td>
|
||||
<td class="data">2.37</td>
|
||||
<td class="data">2.14</td>
|
||||
<td class="data">1.74</td>
|
||||
<td class="data">0.39</td>
|
||||
<td class="data">0.13</td>
|
||||
<td class="data">11.45</td>
|
||||
</tr>
|
||||
<tr nowrap bgcolor="#DDDDDD">
|
||||
<td class="dir">SSE</td>
|
||||
<td class="data">2.04</td>
|
||||
<td class="data">3.42</td>
|
||||
<td class="data">1.97</td>
|
||||
<td class="data">0.86</td>
|
||||
<td class="data">0.53</td>
|
||||
<td class="data">0.49</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">9.31</td>
|
||||
</tr>
|
||||
<tr nowrap>
|
||||
<td class="dir">S</td>
|
||||
<td class="data">2.66</td>
|
||||
<td class="data">4.74</td>
|
||||
<td class="data">0.43</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">7.83</td>
|
||||
</tr>
|
||||
<tr nowrap bgcolor="#DDDDDD">
|
||||
<td class="dir">SSW</td>
|
||||
<td class="data">2.96</td>
|
||||
<td class="data">4.14</td>
|
||||
<td class="data">0.26</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">7.37</td>
|
||||
</tr>
|
||||
<tr nowrap>
|
||||
<td class="dir">SW</td>
|
||||
<td class="data">2.53</td>
|
||||
<td class="data">4.01</td>
|
||||
<td class="data">1.22</td>
|
||||
<td class="data">0.49</td>
|
||||
<td class="data">0.13</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">8.39</td>
|
||||
</tr>
|
||||
<tr nowrap bgcolor="#DDDDDD">
|
||||
<td class="dir">WSW</td>
|
||||
<td class="data">1.97</td>
|
||||
<td class="data">2.66</td>
|
||||
<td class="data">1.97</td>
|
||||
<td class="data">0.79</td>
|
||||
<td class="data">0.30</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">7.70</td>
|
||||
</tr>
|
||||
<tr nowrap>
|
||||
<td class="dir">W</td>
|
||||
<td class="data">1.64</td>
|
||||
<td class="data">1.71</td>
|
||||
<td class="data">0.92</td>
|
||||
<td class="data">1.45</td>
|
||||
<td class="data">0.26</td>
|
||||
<td class="data">0.10</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">6.09</td>
|
||||
</tr>
|
||||
<tr nowrap bgcolor="#DDDDDD">
|
||||
<td class="dir">WNW</td>
|
||||
<td class="data">1.32</td>
|
||||
<td class="data">2.40</td>
|
||||
<td class="data">0.99</td>
|
||||
<td class="data">1.61</td>
|
||||
<td class="data">0.33</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">0.00</td>
|
||||
<td class="data">6.64</td>
|
||||
</tr>
|
||||
<tr nowrap>
|
||||
<td class="dir">NW</td>
|
||||
<td class="data">1.58</td>
|
||||
<td class="data">4.28</td>
|
||||
<td class="data">1.28</td>
|
||||
<td class="data">0.76</td>
|
||||
<td class="data">0.66</td>
|
||||
<td class="data">0.69</td>
|
||||
<td class="data">0.03</td>
|
||||
<td class="data">9.28</td>
|
||||
</tr>
|
||||
<tr nowrap bgcolor="#DDDDDD">
|
||||
<td class="dir">NNW</td>
|
||||
<td class="data">1.51</td>
|
||||
<td class="data">5.00</td>
|
||||
<td class="data">1.32</td>
|
||||
<td class="data">0.13</td>
|
||||
<td class="data">0.23</td>
|
||||
<td class="data">0.13</td>
|
||||
<td class="data">0.07</td>
|
||||
<td class="data">8.39</td>
|
||||
</tr>
|
||||
<tr nowrap>
|
||||
<td class="totals">Total</td>
|
||||
<td class="totals">25.53</td>
|
||||
<td class="totals">44.54</td>
|
||||
<td class="totals">15.07</td>
|
||||
<td class="totals">8.52</td>
|
||||
<td class="totals">4.31</td>
|
||||
<td class="totals">1.81</td>
|
||||
<td class="totals">0.23</td>
|
||||
<td class="totals"> </td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
81
lib/highcharts/examples/polar/index.htm
Normal file
81
lib/highcharts/examples/polar/index.htm
Normal file
@ -0,0 +1,81 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
|
||||
$('#container').highcharts({
|
||||
|
||||
chart: {
|
||||
polar: true
|
||||
},
|
||||
|
||||
title: {
|
||||
text: 'Highcharts Polar Chart'
|
||||
},
|
||||
|
||||
pane: {
|
||||
startAngle: 0,
|
||||
endAngle: 360
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
tickInterval: 45,
|
||||
min: 0,
|
||||
max: 360,
|
||||
labels: {
|
||||
formatter: function () {
|
||||
return this.value + '°';
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
yAxis: {
|
||||
min: 0
|
||||
},
|
||||
|
||||
plotOptions: {
|
||||
series: {
|
||||
pointStart: 0,
|
||||
pointInterval: 45
|
||||
},
|
||||
column: {
|
||||
pointPadding: 0,
|
||||
groupPadding: 0
|
||||
}
|
||||
},
|
||||
|
||||
series: [{
|
||||
type: 'column',
|
||||
name: 'Column',
|
||||
data: [8, 7, 6, 5, 4, 3, 2, 1],
|
||||
pointPlacement: 'between'
|
||||
}, {
|
||||
type: 'line',
|
||||
name: 'Line',
|
||||
data: [1, 2, 3, 4, 5, 6, 7, 8]
|
||||
}, {
|
||||
type: 'area',
|
||||
name: 'Area',
|
||||
data: [1, 8, 2, 7, 3, 6, 4, 5]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/highcharts-more.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; max-width: 400px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
125
lib/highcharts/examples/polygon/index.htm
Normal file
125
lib/highcharts/examples/polygon/index.htm
Normal file
@ -0,0 +1,125 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
|
||||
$('#container').highcharts({
|
||||
title: {
|
||||
text: 'Height vs Weight'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Polygon series in Highcharts'
|
||||
},
|
||||
xAxis: {
|
||||
gridLineWidth: 1,
|
||||
title: {
|
||||
enabled: true,
|
||||
text: 'Height (cm)'
|
||||
},
|
||||
startOnTick: true,
|
||||
endOnTick: true,
|
||||
showLastLabel: true
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Weight (kg)'
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
layout: 'vertical',
|
||||
align: 'right',
|
||||
verticalAlign: 'middle'
|
||||
},
|
||||
series: [{
|
||||
name: 'Target',
|
||||
type: 'polygon',
|
||||
data: [[153, 42], [149, 46], [149, 55], [152, 60], [159, 70], [170, 77], [180, 70],
|
||||
[180, 60], [173, 52], [166, 45]],
|
||||
color: Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0.5).get(),
|
||||
enableMouseTracking: false
|
||||
|
||||
}, {
|
||||
name: 'Observations',
|
||||
type: 'scatter',
|
||||
color: Highcharts.getOptions().colors[1],
|
||||
data: [[161.2, 51.6], [167.5, 59.0], [159.5, 49.2], [157.0, 63.0], [155.8, 53.6],
|
||||
[170.0, 59.0], [159.1, 47.6], [166.0, 69.8], [176.2, 66.8], [160.2, 75.2],
|
||||
[172.5, 55.2], [170.9, 54.2], [172.9, 62.5], [153.4, 42.0], [160.0, 50.0],
|
||||
[147.2, 49.8], [168.2, 49.2], [175.0, 73.2], [157.0, 47.8], [167.6, 68.8],
|
||||
[159.5, 50.6], [175.0, 82.5], [166.8, 57.2], [176.5, 87.8], [170.2, 72.8],
|
||||
[174.0, 54.5], [173.0, 59.8], [179.9, 67.3], [170.5, 67.8], [160.0, 47.0],
|
||||
[154.4, 46.2], [162.0, 55.0], [176.5, 83.0], [160.0, 54.4], [152.0, 45.8],
|
||||
[162.1, 53.6], [170.0, 73.2], [160.2, 52.1], [161.3, 67.9], [166.4, 56.6],
|
||||
[168.9, 62.3], [163.8, 58.5], [167.6, 54.5], [160.0, 50.2], [161.3, 60.3],
|
||||
[167.6, 58.3], [165.1, 56.2], [160.0, 50.2], [170.0, 72.9], [157.5, 59.8],
|
||||
[167.6, 61.0], [160.7, 69.1], [163.2, 55.9], [152.4, 46.5], [157.5, 54.3],
|
||||
[168.3, 54.8], [180.3, 60.7], [165.5, 60.0], [165.0, 62.0], [164.5, 60.3],
|
||||
[156.0, 52.7], [160.0, 74.3], [163.0, 62.0], [165.7, 73.1], [161.0, 80.0],
|
||||
[162.0, 54.7], [166.0, 53.2], [174.0, 75.7], [172.7, 61.1], [167.6, 55.7],
|
||||
[151.1, 48.7], [164.5, 52.3], [163.5, 50.0], [152.0, 59.3], [169.0, 62.5],
|
||||
[164.0, 55.7], [161.2, 54.8], [155.0, 45.9], [170.0, 70.6], [176.2, 67.2],
|
||||
[170.0, 69.4], [162.5, 58.2], [170.3, 64.8], [164.1, 71.6], [169.5, 52.8],
|
||||
[163.2, 59.8], [154.5, 49.0], [159.8, 50.0], [173.2, 69.2], [170.0, 55.9],
|
||||
[161.4, 63.4], [169.0, 58.2], [166.2, 58.6], [159.4, 45.7], [162.5, 52.2],
|
||||
[159.0, 48.6], [162.8, 57.8], [159.0, 55.6], [179.8, 66.8], [162.9, 59.4],
|
||||
[161.0, 53.6], [151.1, 73.2], [168.2, 53.4], [168.9, 69.0], [173.2, 58.4],
|
||||
[171.8, 56.2], [178.0, 70.6], [164.3, 59.8], [163.0, 72.0], [168.5, 65.2],
|
||||
[166.8, 56.6], [172.7, 105.2], [163.5, 51.8], [169.4, 63.4], [167.8, 59.0],
|
||||
[159.5, 47.6], [167.6, 63.0], [161.2, 55.2], [160.0, 45.0], [163.2, 54.0],
|
||||
[162.2, 50.2], [161.3, 60.2], [149.5, 44.8], [157.5, 58.8], [163.2, 56.4],
|
||||
[172.7, 62.0], [155.0, 49.2], [156.5, 67.2], [164.0, 53.8], [160.9, 54.4],
|
||||
[162.8, 58.0], [167.0, 59.8], [160.0, 54.8], [160.0, 43.2], [168.9, 60.5],
|
||||
[158.2, 46.4], [156.0, 64.4], [160.0, 48.8], [167.1, 62.2], [158.0, 55.5],
|
||||
[167.6, 57.8], [156.0, 54.6], [162.1, 59.2], [173.4, 52.7], [159.8, 53.2],
|
||||
[170.5, 64.5], [159.2, 51.8], [157.5, 56.0], [161.3, 63.6], [162.6, 63.2],
|
||||
[160.0, 59.5], [168.9, 56.8], [165.1, 64.1], [162.6, 50.0], [165.1, 72.3],
|
||||
[166.4, 55.0], [160.0, 55.9], [152.4, 60.4], [170.2, 69.1], [162.6, 84.5],
|
||||
[170.2, 55.9], [158.8, 55.5], [172.7, 69.5], [167.6, 76.4], [162.6, 61.4],
|
||||
[167.6, 65.9], [156.2, 58.6], [175.2, 66.8], [172.1, 56.6], [162.6, 58.6],
|
||||
[160.0, 55.9], [165.1, 59.1], [182.9, 81.8], [166.4, 70.7], [165.1, 56.8],
|
||||
[177.8, 60.0], [165.1, 58.2], [175.3, 72.7], [154.9, 54.1], [158.8, 49.1],
|
||||
[172.7, 75.9], [168.9, 55.0], [161.3, 57.3], [167.6, 55.0], [165.1, 65.5],
|
||||
[175.3, 65.5], [157.5, 48.6], [163.8, 58.6], [167.6, 63.6], [165.1, 55.2],
|
||||
[165.1, 62.7], [168.9, 56.6], [162.6, 53.9], [164.5, 63.2], [176.5, 73.6],
|
||||
[168.9, 62.0], [175.3, 63.6], [159.4, 53.2], [160.0, 53.4], [170.2, 55.0],
|
||||
[162.6, 70.5], [167.6, 54.5], [162.6, 54.5], [160.7, 55.9], [160.0, 59.0],
|
||||
[157.5, 63.6], [162.6, 54.5], [152.4, 47.3], [170.2, 67.7], [165.1, 80.9],
|
||||
[172.7, 70.5], [165.1, 60.9], [170.2, 63.6], [170.2, 54.5], [170.2, 59.1],
|
||||
[161.3, 70.5], [167.6, 52.7], [167.6, 62.7], [165.1, 86.3], [162.6, 66.4],
|
||||
[152.4, 67.3], [168.9, 63.0], [170.2, 73.6], [175.2, 62.3], [175.2, 57.7],
|
||||
[160.0, 55.4], [165.1, 104.1], [174.0, 55.5], [170.2, 77.3], [160.0, 80.5],
|
||||
[167.6, 64.5], [167.6, 72.3], [167.6, 61.4], [154.9, 58.2], [162.6, 81.8],
|
||||
[175.3, 63.6], [171.4, 53.4], [157.5, 54.5], [165.1, 53.6], [160.0, 60.0],
|
||||
[174.0, 73.6], [162.6, 61.4], [174.0, 55.5], [162.6, 63.6], [161.3, 60.9],
|
||||
[156.2, 60.0], [149.9, 46.8], [169.5, 57.3], [160.0, 64.1], [175.3, 63.6],
|
||||
[169.5, 67.3], [160.0, 75.5], [172.7, 68.2], [162.6, 61.4], [157.5, 76.8],
|
||||
[176.5, 71.8], [164.4, 55.5], [160.7, 48.6], [174.0, 66.4], [163.8, 67.3]]
|
||||
|
||||
}],
|
||||
tooltip: {
|
||||
headerFormat: '<b>{series.name}</b><br>',
|
||||
pointFormat: '{point.x} cm, {point.y} kg'
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/highcharts-more.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
58
lib/highcharts/examples/pyramid/index.htm
Normal file
58
lib/highcharts/examples/pyramid/index.htm
Normal file
@ -0,0 +1,58 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'pyramid',
|
||||
marginRight: 100
|
||||
},
|
||||
title: {
|
||||
text: 'Sales pyramid',
|
||||
x: -50
|
||||
},
|
||||
plotOptions: {
|
||||
series: {
|
||||
dataLabels: {
|
||||
enabled: true,
|
||||
format: '<b>{point.name}</b> ({point.y:,.0f})',
|
||||
color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black',
|
||||
softConnector: true
|
||||
}
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
enabled: false
|
||||
},
|
||||
series: [{
|
||||
name: 'Unique users',
|
||||
data: [
|
||||
['Website visits', 15654],
|
||||
['Downloads', 4064],
|
||||
['Requested price list', 1987],
|
||||
['Invoice sent', 976],
|
||||
['Finalized', 846]
|
||||
]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/funnel.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 410px; max-width: 600px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
268
lib/highcharts/examples/renderer/index.htm
Normal file
268
lib/highcharts/examples/renderer/index.htm
Normal file
@ -0,0 +1,268 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
backgroundColor: 'white',
|
||||
events: {
|
||||
load: function () {
|
||||
|
||||
// Draw the flow chart
|
||||
var ren = this.renderer,
|
||||
colors = Highcharts.getOptions().colors,
|
||||
rightArrow = ['M', 0, 0, 'L', 100, 0, 'L', 95, 5, 'M', 100, 0, 'L', 95, -5],
|
||||
leftArrow = ['M', 100, 0, 'L', 0, 0, 'L', 5, 5, 'M', 0, 0, 'L', 5, -5];
|
||||
|
||||
|
||||
|
||||
// Separator, client from service
|
||||
ren.path(['M', 120, 40, 'L', 120, 330])
|
||||
.attr({
|
||||
'stroke-width': 2,
|
||||
stroke: 'silver',
|
||||
dashstyle: 'dash'
|
||||
})
|
||||
.add();
|
||||
|
||||
// Separator, CLI from service
|
||||
ren.path(['M', 420, 40, 'L', 420, 330])
|
||||
.attr({
|
||||
'stroke-width': 2,
|
||||
stroke: 'silver',
|
||||
dashstyle: 'dash'
|
||||
})
|
||||
.add();
|
||||
|
||||
// Headers
|
||||
ren.label('Web client', 20, 40)
|
||||
.css({
|
||||
fontWeight: 'bold'
|
||||
})
|
||||
.add();
|
||||
ren.label('Web service / CLI', 220, 40)
|
||||
.css({
|
||||
fontWeight: 'bold'
|
||||
})
|
||||
.add();
|
||||
ren.label('Command line client', 440, 40)
|
||||
.css({
|
||||
fontWeight: 'bold'
|
||||
})
|
||||
.add();
|
||||
|
||||
// SaaS client label
|
||||
ren.label('SaaS client<br/>(browser or<br/>script)', 10, 82)
|
||||
.attr({
|
||||
fill: colors[0],
|
||||
stroke: 'white',
|
||||
'stroke-width': 2,
|
||||
padding: 5,
|
||||
r: 5
|
||||
})
|
||||
.css({
|
||||
color: 'white'
|
||||
})
|
||||
.add()
|
||||
.shadow(true);
|
||||
|
||||
// Arrow from SaaS client to Phantom JS
|
||||
ren.path(rightArrow)
|
||||
.attr({
|
||||
'stroke-width': 2,
|
||||
stroke: colors[3]
|
||||
})
|
||||
.translate(95, 95)
|
||||
.add();
|
||||
|
||||
ren.label('POST options in JSON', 90, 75)
|
||||
.css({
|
||||
fontSize: '10px',
|
||||
color: colors[3]
|
||||
})
|
||||
.add();
|
||||
|
||||
ren.label('PhantomJS', 210, 82)
|
||||
.attr({
|
||||
r: 5,
|
||||
width: 100,
|
||||
fill: colors[1]
|
||||
})
|
||||
.css({
|
||||
color: 'white',
|
||||
fontWeight: 'bold'
|
||||
})
|
||||
.add();
|
||||
|
||||
// Arrow from Phantom JS to Batik
|
||||
ren.path(['M', 250, 110, 'L', 250, 185, 'L', 245, 180, 'M', 250, 185, 'L', 255, 180])
|
||||
.attr({
|
||||
'stroke-width': 2,
|
||||
stroke: colors[3]
|
||||
})
|
||||
.add();
|
||||
|
||||
ren.label('SVG', 255, 120)
|
||||
.css({
|
||||
color: colors[3],
|
||||
fontSize: '10px'
|
||||
})
|
||||
.add();
|
||||
|
||||
ren.label('Batik', 210, 200)
|
||||
.attr({
|
||||
r: 5,
|
||||
width: 100,
|
||||
fill: colors[1]
|
||||
})
|
||||
.css({
|
||||
color: 'white',
|
||||
fontWeight: 'bold'
|
||||
})
|
||||
.add();
|
||||
|
||||
// Arrow from Batik to SaaS client
|
||||
ren.path(['M', 235, 185, 'L', 235, 155, 'C', 235, 130, 235, 130, 215, 130,
|
||||
'L', 95, 130, 'L', 100, 125, 'M', 95, 130, 'L', 100, 135])
|
||||
.attr({
|
||||
'stroke-width': 2,
|
||||
stroke: colors[3]
|
||||
})
|
||||
.add();
|
||||
|
||||
ren.label('Rasterized image', 100, 110)
|
||||
.css({
|
||||
color: colors[3],
|
||||
fontSize: '10px'
|
||||
})
|
||||
.add();
|
||||
|
||||
// Browser label
|
||||
ren.label('Browser<br/>running<br/>Highcharts', 10, 180)
|
||||
.attr({
|
||||
fill: colors[0],
|
||||
stroke: 'white',
|
||||
'stroke-width': 2,
|
||||
padding: 5,
|
||||
r: 5
|
||||
})
|
||||
.css({
|
||||
color: 'white',
|
||||
width: '100px'
|
||||
})
|
||||
.add()
|
||||
.shadow(true);
|
||||
|
||||
|
||||
|
||||
// Arrow from Browser to Batik
|
||||
ren.path(rightArrow)
|
||||
.attr({
|
||||
'stroke-width': 2,
|
||||
stroke: colors[1]
|
||||
})
|
||||
.translate(95, 205)
|
||||
.add();
|
||||
|
||||
ren.label('POST SVG', 110, 185)
|
||||
.css({
|
||||
color: colors[1],
|
||||
fontSize: '10px'
|
||||
})
|
||||
.add();
|
||||
|
||||
// Arrow from Batik to Browser
|
||||
ren.path(leftArrow)
|
||||
.attr({
|
||||
'stroke-width': 2,
|
||||
stroke: colors[1]
|
||||
})
|
||||
.translate(95, 215)
|
||||
.add();
|
||||
|
||||
ren.label('Rasterized image', 100, 215)
|
||||
.css({
|
||||
color: colors[1],
|
||||
fontSize: '10px'
|
||||
})
|
||||
.add();
|
||||
|
||||
// Script label
|
||||
ren.label('Script', 450, 82)
|
||||
.attr({
|
||||
fill: colors[2],
|
||||
stroke: 'white',
|
||||
'stroke-width': 2,
|
||||
padding: 5,
|
||||
r: 5
|
||||
})
|
||||
.css({
|
||||
color: 'white',
|
||||
width: '100px'
|
||||
})
|
||||
.add()
|
||||
.shadow(true);
|
||||
|
||||
// Arrow from Script to PhantomJS
|
||||
ren.path(leftArrow)
|
||||
.attr({
|
||||
'stroke-width': 2,
|
||||
stroke: colors[2]
|
||||
})
|
||||
.translate(330, 90)
|
||||
.add();
|
||||
|
||||
ren.label('Command', 340, 70)
|
||||
.css({
|
||||
color: colors[2],
|
||||
fontSize: '10px'
|
||||
})
|
||||
.add();
|
||||
|
||||
// Arrow from PhantomJS to Script
|
||||
ren.path(rightArrow)
|
||||
.attr({
|
||||
'stroke-width': 2,
|
||||
stroke: colors[2]
|
||||
})
|
||||
.translate(330, 100)
|
||||
.add();
|
||||
|
||||
ren.label('Rasterized image', 330, 100)
|
||||
.css({
|
||||
color: colors[2],
|
||||
fontSize: '10px'
|
||||
})
|
||||
.add();
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
},
|
||||
title: {
|
||||
text: 'Highcharts export server overview',
|
||||
style: {
|
||||
color: 'black'
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="width: 600px; height: 250px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
195
lib/highcharts/examples/scatter/index.htm
Normal file
195
lib/highcharts/examples/scatter/index.htm
Normal file
@ -0,0 +1,195 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'scatter',
|
||||
zoomType: 'xy'
|
||||
},
|
||||
title: {
|
||||
text: 'Height Versus Weight of 507 Individuals by Gender'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Source: Heinz 2003'
|
||||
},
|
||||
xAxis: {
|
||||
title: {
|
||||
enabled: true,
|
||||
text: 'Height (cm)'
|
||||
},
|
||||
startOnTick: true,
|
||||
endOnTick: true,
|
||||
showLastLabel: true
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Weight (kg)'
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
layout: 'vertical',
|
||||
align: 'left',
|
||||
verticalAlign: 'top',
|
||||
x: 100,
|
||||
y: 70,
|
||||
floating: true,
|
||||
backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF',
|
||||
borderWidth: 1
|
||||
},
|
||||
plotOptions: {
|
||||
scatter: {
|
||||
marker: {
|
||||
radius: 5,
|
||||
states: {
|
||||
hover: {
|
||||
enabled: true,
|
||||
lineColor: 'rgb(100,100,100)'
|
||||
}
|
||||
}
|
||||
},
|
||||
states: {
|
||||
hover: {
|
||||
marker: {
|
||||
enabled: false
|
||||
}
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
headerFormat: '<b>{series.name}</b><br>',
|
||||
pointFormat: '{point.x} cm, {point.y} kg'
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: 'Female',
|
||||
color: 'rgba(223, 83, 83, .5)',
|
||||
data: [[161.2, 51.6], [167.5, 59.0], [159.5, 49.2], [157.0, 63.0], [155.8, 53.6],
|
||||
[170.0, 59.0], [159.1, 47.6], [166.0, 69.8], [176.2, 66.8], [160.2, 75.2],
|
||||
[172.5, 55.2], [170.9, 54.2], [172.9, 62.5], [153.4, 42.0], [160.0, 50.0],
|
||||
[147.2, 49.8], [168.2, 49.2], [175.0, 73.2], [157.0, 47.8], [167.6, 68.8],
|
||||
[159.5, 50.6], [175.0, 82.5], [166.8, 57.2], [176.5, 87.8], [170.2, 72.8],
|
||||
[174.0, 54.5], [173.0, 59.8], [179.9, 67.3], [170.5, 67.8], [160.0, 47.0],
|
||||
[154.4, 46.2], [162.0, 55.0], [176.5, 83.0], [160.0, 54.4], [152.0, 45.8],
|
||||
[162.1, 53.6], [170.0, 73.2], [160.2, 52.1], [161.3, 67.9], [166.4, 56.6],
|
||||
[168.9, 62.3], [163.8, 58.5], [167.6, 54.5], [160.0, 50.2], [161.3, 60.3],
|
||||
[167.6, 58.3], [165.1, 56.2], [160.0, 50.2], [170.0, 72.9], [157.5, 59.8],
|
||||
[167.6, 61.0], [160.7, 69.1], [163.2, 55.9], [152.4, 46.5], [157.5, 54.3],
|
||||
[168.3, 54.8], [180.3, 60.7], [165.5, 60.0], [165.0, 62.0], [164.5, 60.3],
|
||||
[156.0, 52.7], [160.0, 74.3], [163.0, 62.0], [165.7, 73.1], [161.0, 80.0],
|
||||
[162.0, 54.7], [166.0, 53.2], [174.0, 75.7], [172.7, 61.1], [167.6, 55.7],
|
||||
[151.1, 48.7], [164.5, 52.3], [163.5, 50.0], [152.0, 59.3], [169.0, 62.5],
|
||||
[164.0, 55.7], [161.2, 54.8], [155.0, 45.9], [170.0, 70.6], [176.2, 67.2],
|
||||
[170.0, 69.4], [162.5, 58.2], [170.3, 64.8], [164.1, 71.6], [169.5, 52.8],
|
||||
[163.2, 59.8], [154.5, 49.0], [159.8, 50.0], [173.2, 69.2], [170.0, 55.9],
|
||||
[161.4, 63.4], [169.0, 58.2], [166.2, 58.6], [159.4, 45.7], [162.5, 52.2],
|
||||
[159.0, 48.6], [162.8, 57.8], [159.0, 55.6], [179.8, 66.8], [162.9, 59.4],
|
||||
[161.0, 53.6], [151.1, 73.2], [168.2, 53.4], [168.9, 69.0], [173.2, 58.4],
|
||||
[171.8, 56.2], [178.0, 70.6], [164.3, 59.8], [163.0, 72.0], [168.5, 65.2],
|
||||
[166.8, 56.6], [172.7, 105.2], [163.5, 51.8], [169.4, 63.4], [167.8, 59.0],
|
||||
[159.5, 47.6], [167.6, 63.0], [161.2, 55.2], [160.0, 45.0], [163.2, 54.0],
|
||||
[162.2, 50.2], [161.3, 60.2], [149.5, 44.8], [157.5, 58.8], [163.2, 56.4],
|
||||
[172.7, 62.0], [155.0, 49.2], [156.5, 67.2], [164.0, 53.8], [160.9, 54.4],
|
||||
[162.8, 58.0], [167.0, 59.8], [160.0, 54.8], [160.0, 43.2], [168.9, 60.5],
|
||||
[158.2, 46.4], [156.0, 64.4], [160.0, 48.8], [167.1, 62.2], [158.0, 55.5],
|
||||
[167.6, 57.8], [156.0, 54.6], [162.1, 59.2], [173.4, 52.7], [159.8, 53.2],
|
||||
[170.5, 64.5], [159.2, 51.8], [157.5, 56.0], [161.3, 63.6], [162.6, 63.2],
|
||||
[160.0, 59.5], [168.9, 56.8], [165.1, 64.1], [162.6, 50.0], [165.1, 72.3],
|
||||
[166.4, 55.0], [160.0, 55.9], [152.4, 60.4], [170.2, 69.1], [162.6, 84.5],
|
||||
[170.2, 55.9], [158.8, 55.5], [172.7, 69.5], [167.6, 76.4], [162.6, 61.4],
|
||||
[167.6, 65.9], [156.2, 58.6], [175.2, 66.8], [172.1, 56.6], [162.6, 58.6],
|
||||
[160.0, 55.9], [165.1, 59.1], [182.9, 81.8], [166.4, 70.7], [165.1, 56.8],
|
||||
[177.8, 60.0], [165.1, 58.2], [175.3, 72.7], [154.9, 54.1], [158.8, 49.1],
|
||||
[172.7, 75.9], [168.9, 55.0], [161.3, 57.3], [167.6, 55.0], [165.1, 65.5],
|
||||
[175.3, 65.5], [157.5, 48.6], [163.8, 58.6], [167.6, 63.6], [165.1, 55.2],
|
||||
[165.1, 62.7], [168.9, 56.6], [162.6, 53.9], [164.5, 63.2], [176.5, 73.6],
|
||||
[168.9, 62.0], [175.3, 63.6], [159.4, 53.2], [160.0, 53.4], [170.2, 55.0],
|
||||
[162.6, 70.5], [167.6, 54.5], [162.6, 54.5], [160.7, 55.9], [160.0, 59.0],
|
||||
[157.5, 63.6], [162.6, 54.5], [152.4, 47.3], [170.2, 67.7], [165.1, 80.9],
|
||||
[172.7, 70.5], [165.1, 60.9], [170.2, 63.6], [170.2, 54.5], [170.2, 59.1],
|
||||
[161.3, 70.5], [167.6, 52.7], [167.6, 62.7], [165.1, 86.3], [162.6, 66.4],
|
||||
[152.4, 67.3], [168.9, 63.0], [170.2, 73.6], [175.2, 62.3], [175.2, 57.7],
|
||||
[160.0, 55.4], [165.1, 104.1], [174.0, 55.5], [170.2, 77.3], [160.0, 80.5],
|
||||
[167.6, 64.5], [167.6, 72.3], [167.6, 61.4], [154.9, 58.2], [162.6, 81.8],
|
||||
[175.3, 63.6], [171.4, 53.4], [157.5, 54.5], [165.1, 53.6], [160.0, 60.0],
|
||||
[174.0, 73.6], [162.6, 61.4], [174.0, 55.5], [162.6, 63.6], [161.3, 60.9],
|
||||
[156.2, 60.0], [149.9, 46.8], [169.5, 57.3], [160.0, 64.1], [175.3, 63.6],
|
||||
[169.5, 67.3], [160.0, 75.5], [172.7, 68.2], [162.6, 61.4], [157.5, 76.8],
|
||||
[176.5, 71.8], [164.4, 55.5], [160.7, 48.6], [174.0, 66.4], [163.8, 67.3]]
|
||||
|
||||
}, {
|
||||
name: 'Male',
|
||||
color: 'rgba(119, 152, 191, .5)',
|
||||
data: [[174.0, 65.6], [175.3, 71.8], [193.5, 80.7], [186.5, 72.6], [187.2, 78.8],
|
||||
[181.5, 74.8], [184.0, 86.4], [184.5, 78.4], [175.0, 62.0], [184.0, 81.6],
|
||||
[180.0, 76.6], [177.8, 83.6], [192.0, 90.0], [176.0, 74.6], [174.0, 71.0],
|
||||
[184.0, 79.6], [192.7, 93.8], [171.5, 70.0], [173.0, 72.4], [176.0, 85.9],
|
||||
[176.0, 78.8], [180.5, 77.8], [172.7, 66.2], [176.0, 86.4], [173.5, 81.8],
|
||||
[178.0, 89.6], [180.3, 82.8], [180.3, 76.4], [164.5, 63.2], [173.0, 60.9],
|
||||
[183.5, 74.8], [175.5, 70.0], [188.0, 72.4], [189.2, 84.1], [172.8, 69.1],
|
||||
[170.0, 59.5], [182.0, 67.2], [170.0, 61.3], [177.8, 68.6], [184.2, 80.1],
|
||||
[186.7, 87.8], [171.4, 84.7], [172.7, 73.4], [175.3, 72.1], [180.3, 82.6],
|
||||
[182.9, 88.7], [188.0, 84.1], [177.2, 94.1], [172.1, 74.9], [167.0, 59.1],
|
||||
[169.5, 75.6], [174.0, 86.2], [172.7, 75.3], [182.2, 87.1], [164.1, 55.2],
|
||||
[163.0, 57.0], [171.5, 61.4], [184.2, 76.8], [174.0, 86.8], [174.0, 72.2],
|
||||
[177.0, 71.6], [186.0, 84.8], [167.0, 68.2], [171.8, 66.1], [182.0, 72.0],
|
||||
[167.0, 64.6], [177.8, 74.8], [164.5, 70.0], [192.0, 101.6], [175.5, 63.2],
|
||||
[171.2, 79.1], [181.6, 78.9], [167.4, 67.7], [181.1, 66.0], [177.0, 68.2],
|
||||
[174.5, 63.9], [177.5, 72.0], [170.5, 56.8], [182.4, 74.5], [197.1, 90.9],
|
||||
[180.1, 93.0], [175.5, 80.9], [180.6, 72.7], [184.4, 68.0], [175.5, 70.9],
|
||||
[180.6, 72.5], [177.0, 72.5], [177.1, 83.4], [181.6, 75.5], [176.5, 73.0],
|
||||
[175.0, 70.2], [174.0, 73.4], [165.1, 70.5], [177.0, 68.9], [192.0, 102.3],
|
||||
[176.5, 68.4], [169.4, 65.9], [182.1, 75.7], [179.8, 84.5], [175.3, 87.7],
|
||||
[184.9, 86.4], [177.3, 73.2], [167.4, 53.9], [178.1, 72.0], [168.9, 55.5],
|
||||
[157.2, 58.4], [180.3, 83.2], [170.2, 72.7], [177.8, 64.1], [172.7, 72.3],
|
||||
[165.1, 65.0], [186.7, 86.4], [165.1, 65.0], [174.0, 88.6], [175.3, 84.1],
|
||||
[185.4, 66.8], [177.8, 75.5], [180.3, 93.2], [180.3, 82.7], [177.8, 58.0],
|
||||
[177.8, 79.5], [177.8, 78.6], [177.8, 71.8], [177.8, 116.4], [163.8, 72.2],
|
||||
[188.0, 83.6], [198.1, 85.5], [175.3, 90.9], [166.4, 85.9], [190.5, 89.1],
|
||||
[166.4, 75.0], [177.8, 77.7], [179.7, 86.4], [172.7, 90.9], [190.5, 73.6],
|
||||
[185.4, 76.4], [168.9, 69.1], [167.6, 84.5], [175.3, 64.5], [170.2, 69.1],
|
||||
[190.5, 108.6], [177.8, 86.4], [190.5, 80.9], [177.8, 87.7], [184.2, 94.5],
|
||||
[176.5, 80.2], [177.8, 72.0], [180.3, 71.4], [171.4, 72.7], [172.7, 84.1],
|
||||
[172.7, 76.8], [177.8, 63.6], [177.8, 80.9], [182.9, 80.9], [170.2, 85.5],
|
||||
[167.6, 68.6], [175.3, 67.7], [165.1, 66.4], [185.4, 102.3], [181.6, 70.5],
|
||||
[172.7, 95.9], [190.5, 84.1], [179.1, 87.3], [175.3, 71.8], [170.2, 65.9],
|
||||
[193.0, 95.9], [171.4, 91.4], [177.8, 81.8], [177.8, 96.8], [167.6, 69.1],
|
||||
[167.6, 82.7], [180.3, 75.5], [182.9, 79.5], [176.5, 73.6], [186.7, 91.8],
|
||||
[188.0, 84.1], [188.0, 85.9], [177.8, 81.8], [174.0, 82.5], [177.8, 80.5],
|
||||
[171.4, 70.0], [185.4, 81.8], [185.4, 84.1], [188.0, 90.5], [188.0, 91.4],
|
||||
[182.9, 89.1], [176.5, 85.0], [175.3, 69.1], [175.3, 73.6], [188.0, 80.5],
|
||||
[188.0, 82.7], [175.3, 86.4], [170.5, 67.7], [179.1, 92.7], [177.8, 93.6],
|
||||
[175.3, 70.9], [182.9, 75.0], [170.8, 93.2], [188.0, 93.2], [180.3, 77.7],
|
||||
[177.8, 61.4], [185.4, 94.1], [168.9, 75.0], [185.4, 83.6], [180.3, 85.5],
|
||||
[174.0, 73.9], [167.6, 66.8], [182.9, 87.3], [160.0, 72.3], [180.3, 88.6],
|
||||
[167.6, 75.5], [186.7, 101.4], [175.3, 91.1], [175.3, 67.3], [175.9, 77.7],
|
||||
[175.3, 81.8], [179.1, 75.5], [181.6, 84.5], [177.8, 76.6], [182.9, 85.0],
|
||||
[177.8, 102.5], [184.2, 77.3], [179.1, 71.8], [176.5, 87.9], [188.0, 94.3],
|
||||
[174.0, 70.9], [167.6, 64.5], [170.2, 77.3], [167.6, 72.3], [188.0, 87.3],
|
||||
[174.0, 80.0], [176.5, 82.3], [180.3, 73.6], [167.6, 74.1], [188.0, 85.9],
|
||||
[180.3, 73.2], [167.6, 76.3], [183.0, 65.9], [183.0, 90.9], [179.1, 89.1],
|
||||
[170.2, 62.3], [177.8, 82.7], [179.1, 79.1], [190.5, 98.2], [177.8, 84.1],
|
||||
[180.3, 83.2], [180.3, 83.2]]
|
||||
}]
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; max-width: 800px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
675
lib/highcharts/examples/sparkline/index.htm
Normal file
675
lib/highcharts/examples/sparkline/index.htm
Normal file
@ -0,0 +1,675 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
#result {
|
||||
text-align: right;
|
||||
color: gray;
|
||||
min-height: 2em;
|
||||
}
|
||||
#table-sparkline {
|
||||
margin: 0 auto;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
th {
|
||||
font-weight: bold;
|
||||
text-align: left;
|
||||
}
|
||||
td, th {
|
||||
padding: 5px;
|
||||
border-bottom: 1px solid silver;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
thead th {
|
||||
border-top: 2px solid gray;
|
||||
border-bottom: 2px solid gray;
|
||||
}
|
||||
.highcharts-tooltip>span {
|
||||
background: white;
|
||||
border: 1px solid silver;
|
||||
border-radius: 3px;
|
||||
box-shadow: 1px 1px 2px #888;
|
||||
padding: 8px;
|
||||
}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
|
||||
$(function () {
|
||||
/**
|
||||
* Create a constructor for sparklines that takes some sensible defaults and merges in the individual
|
||||
* chart options. This function is also available from the jQuery plugin as $(element).highcharts('SparkLine').
|
||||
*/
|
||||
Highcharts.SparkLine = function (options, callback) {
|
||||
var defaultOptions = {
|
||||
chart: {
|
||||
renderTo: (options.chart && options.chart.renderTo) || this,
|
||||
backgroundColor: null,
|
||||
borderWidth: 0,
|
||||
type: 'area',
|
||||
margin: [2, 0, 2, 0],
|
||||
width: 120,
|
||||
height: 20,
|
||||
style: {
|
||||
overflow: 'visible'
|
||||
},
|
||||
skipClone: true
|
||||
},
|
||||
title: {
|
||||
text: ''
|
||||
},
|
||||
credits: {
|
||||
enabled: false
|
||||
},
|
||||
xAxis: {
|
||||
labels: {
|
||||
enabled: false
|
||||
},
|
||||
title: {
|
||||
text: null
|
||||
},
|
||||
startOnTick: false,
|
||||
endOnTick: false,
|
||||
tickPositions: []
|
||||
},
|
||||
yAxis: {
|
||||
endOnTick: false,
|
||||
startOnTick: false,
|
||||
labels: {
|
||||
enabled: false
|
||||
},
|
||||
title: {
|
||||
text: null
|
||||
},
|
||||
tickPositions: [0]
|
||||
},
|
||||
legend: {
|
||||
enabled: false
|
||||
},
|
||||
tooltip: {
|
||||
backgroundColor: null,
|
||||
borderWidth: 0,
|
||||
shadow: false,
|
||||
useHTML: true,
|
||||
hideDelay: 0,
|
||||
shared: true,
|
||||
padding: 0,
|
||||
positioner: function (w, h, point) {
|
||||
return { x: point.plotX - w / 2, y: point.plotY - h};
|
||||
}
|
||||
},
|
||||
plotOptions: {
|
||||
series: {
|
||||
animation: false,
|
||||
lineWidth: 1,
|
||||
shadow: false,
|
||||
states: {
|
||||
hover: {
|
||||
lineWidth: 1
|
||||
}
|
||||
},
|
||||
marker: {
|
||||
radius: 1,
|
||||
states: {
|
||||
hover: {
|
||||
radius: 2
|
||||
}
|
||||
}
|
||||
},
|
||||
fillOpacity: 0.25
|
||||
},
|
||||
column: {
|
||||
negativeColor: '#910000',
|
||||
borderColor: 'silver'
|
||||
}
|
||||
}
|
||||
};
|
||||
options = Highcharts.merge(defaultOptions, options);
|
||||
|
||||
return new Highcharts.Chart(options, callback);
|
||||
};
|
||||
|
||||
var start = +new Date(),
|
||||
$tds = $("td[data-sparkline]"),
|
||||
fullLen = $tds.length,
|
||||
n = 0;
|
||||
|
||||
// Creating 153 sparkline charts is quite fast in modern browsers, but IE8 and mobile
|
||||
// can take some seconds, so we split the input into chunks and apply them in timeouts
|
||||
// in order avoid locking up the browser process and allow interaction.
|
||||
function doChunk() {
|
||||
var time = +new Date(),
|
||||
i,
|
||||
len = $tds.length,
|
||||
$td,
|
||||
stringdata,
|
||||
arr,
|
||||
data,
|
||||
chart;
|
||||
|
||||
for (i = 0; i < len; i += 1) {
|
||||
$td = $($tds[i]);
|
||||
stringdata = $td.data('sparkline');
|
||||
arr = stringdata.split('; ');
|
||||
data = $.map(arr[0].split(', '), parseFloat);
|
||||
chart = {};
|
||||
|
||||
if (arr[1]) {
|
||||
chart.type = arr[1];
|
||||
}
|
||||
$td.highcharts('SparkLine', {
|
||||
series: [{
|
||||
data: data,
|
||||
pointStart: 1
|
||||
}],
|
||||
tooltip: {
|
||||
headerFormat: '<span style="font-size: 10px">' + $td.parent().find('th').html() + ', Q{point.x}:</span><br/>',
|
||||
pointFormat: '<b>{point.y}.000</b> USD'
|
||||
},
|
||||
chart: chart
|
||||
});
|
||||
|
||||
n += 1;
|
||||
|
||||
// If the process takes too much time, run a timeout to allow interaction with the browser
|
||||
if (new Date() - time > 500) {
|
||||
$tds.splice(0, i + 1);
|
||||
setTimeout(doChunk, 0);
|
||||
break;
|
||||
}
|
||||
|
||||
// Print a feedback on the performance
|
||||
if (n === fullLen) {
|
||||
$('#result').html('Generated ' + fullLen + ' sparklines in ' + (new Date() - start) + ' ms');
|
||||
}
|
||||
}
|
||||
}
|
||||
doChunk();
|
||||
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
|
||||
<div id="result"></div>
|
||||
<table id="table-sparkline">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>State</th>
|
||||
<th>Income</th>
|
||||
<th>Income per quarter</th>
|
||||
<th>Costs</th>
|
||||
<th>Costs per quarter</th>
|
||||
<th>Result</th>
|
||||
<th>Result per quarter</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="tbody-sparkline">
|
||||
<tr>
|
||||
<th>Alabama</th>
|
||||
<td>254</td>
|
||||
<td data-sparkline="71, 78, 39, 66 "/>
|
||||
<td>296</td>
|
||||
<td data-sparkline="68, 52, 80, 96 "/>
|
||||
<td>-42</td>
|
||||
<td data-sparkline="3, 26, -41, -30 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Alaska</th>
|
||||
<td>246</td>
|
||||
<td data-sparkline="87, 44, 74, 41 "/>
|
||||
<td>181</td>
|
||||
<td data-sparkline="29, 54, 73, 25 "/>
|
||||
<td>65</td>
|
||||
<td data-sparkline="58, -10, 1, 16 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Arizona</th>
|
||||
<td>101</td>
|
||||
<td data-sparkline="56, 12, 8, 25 "/>
|
||||
<td>191</td>
|
||||
<td data-sparkline="69, 14, 53, 55 "/>
|
||||
<td>-90</td>
|
||||
<td data-sparkline="-13, -2, -45, -30 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Arkansas</th>
|
||||
<td>303</td>
|
||||
<td data-sparkline="81, 50, 78, 94 "/>
|
||||
<td>76</td>
|
||||
<td data-sparkline="36, 15, 14, 11 "/>
|
||||
<td>227</td>
|
||||
<td data-sparkline="45, 35, 64, 83 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>California</th>
|
||||
<td>200</td>
|
||||
<td data-sparkline="61, 80, 10, 49 "/>
|
||||
<td>217</td>
|
||||
<td data-sparkline="100, 8, 52, 57 "/>
|
||||
<td>-17</td>
|
||||
<td data-sparkline="-39, 72, -42, -8 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Colorado</th>
|
||||
<td>118</td>
|
||||
<td data-sparkline="13, 48, 21, 36 "/>
|
||||
<td>273</td>
|
||||
<td data-sparkline="98, 86, 8, 81 "/>
|
||||
<td>-155</td>
|
||||
<td data-sparkline="-85, -38, 13, -45 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Connecticut</th>
|
||||
<td>201</td>
|
||||
<td data-sparkline="6, 64, 44, 87 "/>
|
||||
<td>148</td>
|
||||
<td data-sparkline="60, 13, 73, 2 "/>
|
||||
<td>53</td>
|
||||
<td data-sparkline="-54, 51, -29, 85 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Delaware</th>
|
||||
<td>161</td>
|
||||
<td data-sparkline="7, 27, 49, 78 "/>
|
||||
<td>298</td>
|
||||
<td data-sparkline="19, 90, 100, 89 "/>
|
||||
<td>-137</td>
|
||||
<td data-sparkline="-12, -63, -51, -11 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>District of Columbia</th>
|
||||
<td>106</td>
|
||||
<td data-sparkline="18, 39, 27, 22 "/>
|
||||
<td>185</td>
|
||||
<td data-sparkline="62, 97, 24, 2 "/>
|
||||
<td>-79</td>
|
||||
<td data-sparkline="-44, -58, 3, 20 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Florida</th>
|
||||
<td>249</td>
|
||||
<td data-sparkline="51, 24, 90, 84 "/>
|
||||
<td>244</td>
|
||||
<td data-sparkline="47, 40, 74, 83 "/>
|
||||
<td>5</td>
|
||||
<td data-sparkline="4, -16, 16, 1 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Georgia</th>
|
||||
<td>183</td>
|
||||
<td data-sparkline="36, 80, 39, 28 "/>
|
||||
<td>212</td>
|
||||
<td data-sparkline="43, 25, 52, 92 "/>
|
||||
<td>-29</td>
|
||||
<td data-sparkline="-7, 55, -13, -64 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Hawaii</th>
|
||||
<td>232</td>
|
||||
<td data-sparkline="73, 34, 74, 51 "/>
|
||||
<td>172</td>
|
||||
<td data-sparkline="1, 83, 49, 39 "/>
|
||||
<td>60</td>
|
||||
<td data-sparkline="72, -49, 25, 12 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Idaho</th>
|
||||
<td>166</td>
|
||||
<td data-sparkline="25, 43, 31, 67 "/>
|
||||
<td>152</td>
|
||||
<td data-sparkline="30, 30, 75, 17 "/>
|
||||
<td>14</td>
|
||||
<td data-sparkline="-5, 13, -44, 50 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Illinois</th>
|
||||
<td>336</td>
|
||||
<td data-sparkline="56, 84, 98, 98 "/>
|
||||
<td>151</td>
|
||||
<td data-sparkline="61, 12, 77, 1 "/>
|
||||
<td>185</td>
|
||||
<td data-sparkline="-5, 72, 21, 97 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Indiana</th>
|
||||
<td>216</td>
|
||||
<td data-sparkline="52, 87, 64, 13 "/>
|
||||
<td>216</td>
|
||||
<td data-sparkline="2, 47, 94, 73 "/>
|
||||
<td>0</td>
|
||||
<td data-sparkline="50, 40, -30, -60 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Iowa</th>
|
||||
<td>135</td>
|
||||
<td data-sparkline="41, 45, 19, 30 "/>
|
||||
<td>159</td>
|
||||
<td data-sparkline="17, 34, 45, 63 "/>
|
||||
<td>-24</td>
|
||||
<td data-sparkline="24, 11, -26, -33 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Kansas</th>
|
||||
<td>184</td>
|
||||
<td data-sparkline="52, 43, 65, 24 "/>
|
||||
<td>215</td>
|
||||
<td data-sparkline="20, 42, 97, 56 "/>
|
||||
<td>-31</td>
|
||||
<td data-sparkline="32, 1, -32, -32 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Kentucky</th>
|
||||
<td>289</td>
|
||||
<td data-sparkline="85, 74, 98, 32 "/>
|
||||
<td>219</td>
|
||||
<td data-sparkline="37, 38, 93, 51 "/>
|
||||
<td>70</td>
|
||||
<td data-sparkline="48, 36, 5, -19 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Louisiana</th>
|
||||
<td>257</td>
|
||||
<td data-sparkline="89, 18, 87, 63 "/>
|
||||
<td>201</td>
|
||||
<td data-sparkline="19, 54, 35, 93 "/>
|
||||
<td>56</td>
|
||||
<td data-sparkline="70, -36, 52, -30 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Maine</th>
|
||||
<td>194</td>
|
||||
<td data-sparkline="17, 68, 61, 48 "/>
|
||||
<td>133</td>
|
||||
<td data-sparkline="44, 35, 42, 12 "/>
|
||||
<td>61</td>
|
||||
<td data-sparkline="-27, 33, 19, 36 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Maryland</th>
|
||||
<td>204</td>
|
||||
<td data-sparkline="74, 12, 74, 44 "/>
|
||||
<td>157</td>
|
||||
<td data-sparkline="65, 58, 22, 12 "/>
|
||||
<td>47</td>
|
||||
<td data-sparkline="9, -46, 52, 32 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Massachusetts</th>
|
||||
<td>172</td>
|
||||
<td data-sparkline="44, 35, 69, 24 "/>
|
||||
<td>115</td>
|
||||
<td data-sparkline="26, 3, 69, 17 "/>
|
||||
<td>57</td>
|
||||
<td data-sparkline="18, 32, 0, 7 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Michigan</th>
|
||||
<td>177</td>
|
||||
<td data-sparkline="99, 26, 13, 39 "/>
|
||||
<td>185</td>
|
||||
<td data-sparkline="20, 37, 99, 29 "/>
|
||||
<td>-8</td>
|
||||
<td data-sparkline="79, -11, -86, 10 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Minnesota</th>
|
||||
<td>99</td>
|
||||
<td data-sparkline="34, 30, 16, 19 "/>
|
||||
<td>137</td>
|
||||
<td data-sparkline="49, 43, 24, 21 "/>
|
||||
<td>-38</td>
|
||||
<td data-sparkline="-15, -13, -8, -2 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Mississippi</th>
|
||||
<td>205</td>
|
||||
<td data-sparkline="38, 75, 31, 61 "/>
|
||||
<td>179</td>
|
||||
<td data-sparkline="0, 68, 100, 11 "/>
|
||||
<td>26</td>
|
||||
<td data-sparkline="38, 7, -69, 50 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Missouri</th>
|
||||
<td>135</td>
|
||||
<td data-sparkline="37, 48, 2, 48 "/>
|
||||
<td>202</td>
|
||||
<td data-sparkline="41, 64, 17, 80 "/>
|
||||
<td>-67</td>
|
||||
<td data-sparkline="-4, -16, -15, -32 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Montana</th>
|
||||
<td>195</td>
|
||||
<td data-sparkline="48, 81, 38, 28 "/>
|
||||
<td>237</td>
|
||||
<td data-sparkline="44, 33, 86, 74 "/>
|
||||
<td>-42</td>
|
||||
<td data-sparkline="4, 48, -48, -46 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Nebraska</th>
|
||||
<td>286</td>
|
||||
<td data-sparkline="98, 55, 82, 51 "/>
|
||||
<td>232</td>
|
||||
<td data-sparkline="89, 54, 28, 61 "/>
|
||||
<td>54</td>
|
||||
<td data-sparkline="9, 1, 54, -10 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Nevada</th>
|
||||
<td>221</td>
|
||||
<td data-sparkline="66, 4, 57, 94 "/>
|
||||
<td>214</td>
|
||||
<td data-sparkline="59, 39, 94, 22 "/>
|
||||
<td>7</td>
|
||||
<td data-sparkline="7, -35, -37, 72 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>New Hampshire</th>
|
||||
<td>136</td>
|
||||
<td data-sparkline="32, 21, 1, 82 "/>
|
||||
<td>306</td>
|
||||
<td data-sparkline="88, 85, 65, 68 "/>
|
||||
<td>-170</td>
|
||||
<td data-sparkline="-56, -64, -64, 14 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>New Jersey</th>
|
||||
<td>194</td>
|
||||
<td data-sparkline="31, 40, 24, 99 "/>
|
||||
<td>147</td>
|
||||
<td data-sparkline="7, 45, 12, 83 "/>
|
||||
<td>47</td>
|
||||
<td data-sparkline="24, -5, 12, 16 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>New Mexico</th>
|
||||
<td>207</td>
|
||||
<td data-sparkline="66, 93, 18, 30 "/>
|
||||
<td>261</td>
|
||||
<td data-sparkline="97, 28, 79, 57 "/>
|
||||
<td>-54</td>
|
||||
<td data-sparkline="-31, 65, -61, -27 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>New York</th>
|
||||
<td>316</td>
|
||||
<td data-sparkline="48, 95, 76, 97 "/>
|
||||
<td>193</td>
|
||||
<td data-sparkline="68, 5, 97, 23 "/>
|
||||
<td>123</td>
|
||||
<td data-sparkline="-20, 90, -21, 74 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>North Carolina</th>
|
||||
<td>175</td>
|
||||
<td data-sparkline="31, 71, 2, 71 "/>
|
||||
<td>188</td>
|
||||
<td data-sparkline="93, 5, 81, 9 "/>
|
||||
<td>-13</td>
|
||||
<td data-sparkline="-62, 66, -79, 62 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>North Dakota</th>
|
||||
<td>181</td>
|
||||
<td data-sparkline="3, 90, 62, 26 "/>
|
||||
<td>288</td>
|
||||
<td data-sparkline="70, 63, 82, 73 "/>
|
||||
<td>-107</td>
|
||||
<td data-sparkline="-67, 27, -20, -47 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Ohio</th>
|
||||
<td>189</td>
|
||||
<td data-sparkline="70, 50, 6, 63 "/>
|
||||
<td>163</td>
|
||||
<td data-sparkline="21, 94, 4, 44 "/>
|
||||
<td>26</td>
|
||||
<td data-sparkline="49, -44, 2, 19 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Oklahoma</th>
|
||||
<td>188</td>
|
||||
<td data-sparkline="66, 46, 53, 23 "/>
|
||||
<td>172</td>
|
||||
<td data-sparkline="26, 25, 35, 86 "/>
|
||||
<td>16</td>
|
||||
<td data-sparkline="40, 21, 18, -63 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Oregon</th>
|
||||
<td>165</td>
|
||||
<td data-sparkline="82, 31, 38, 14 "/>
|
||||
<td>257</td>
|
||||
<td data-sparkline="91, 9, 80, 77 "/>
|
||||
<td>-92</td>
|
||||
<td data-sparkline="-9, 22, -42, -63 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Pennsylvania</th>
|
||||
<td>268</td>
|
||||
<td data-sparkline="33, 88, 82, 65 "/>
|
||||
<td>129</td>
|
||||
<td data-sparkline="30, 29, 41, 29 "/>
|
||||
<td>139</td>
|
||||
<td data-sparkline="3, 59, 41, 36 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Rhode Island</th>
|
||||
<td>164</td>
|
||||
<td data-sparkline="8, 86, 32, 38 "/>
|
||||
<td>182</td>
|
||||
<td data-sparkline="88, 8, 18, 68 "/>
|
||||
<td>-18</td>
|
||||
<td data-sparkline="-80, 78, 14, -30 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>South Carolina</th>
|
||||
<td>91</td>
|
||||
<td data-sparkline="24, 18, 0, 49 "/>
|
||||
<td>193</td>
|
||||
<td data-sparkline="72, 62, 21, 38 "/>
|
||||
<td>-102</td>
|
||||
<td data-sparkline="-48, -44, -21, 11 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>South Dakota</th>
|
||||
<td>184</td>
|
||||
<td data-sparkline="73, 17, 64, 30 "/>
|
||||
<td>221</td>
|
||||
<td data-sparkline="21, 91, 57, 52 "/>
|
||||
<td>-37</td>
|
||||
<td data-sparkline="52, -74, 7, -22 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Tennessee</th>
|
||||
<td>233</td>
|
||||
<td data-sparkline="92, 24, 25, 92 "/>
|
||||
<td>131</td>
|
||||
<td data-sparkline="5, 18, 42, 66 "/>
|
||||
<td>102</td>
|
||||
<td data-sparkline="87, 6, -17, 26 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Texas</th>
|
||||
<td>211</td>
|
||||
<td data-sparkline="33, 80, 68, 30 "/>
|
||||
<td>225</td>
|
||||
<td data-sparkline="86, 58, 36, 45 "/>
|
||||
<td>-14</td>
|
||||
<td data-sparkline="-53, 22, 32, -15 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Utah</th>
|
||||
<td>362</td>
|
||||
<td data-sparkline="89, 98, 96, 79 "/>
|
||||
<td>225</td>
|
||||
<td data-sparkline="35, 51, 88, 51 "/>
|
||||
<td>137</td>
|
||||
<td data-sparkline="54, 47, 8, 28 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Vermont</th>
|
||||
<td>119</td>
|
||||
<td data-sparkline="4, 19, 56, 40 "/>
|
||||
<td>152</td>
|
||||
<td data-sparkline="17, 66, 27, 42 "/>
|
||||
<td>-33</td>
|
||||
<td data-sparkline="-13, -47, 29, -2 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Virginia</th>
|
||||
<td>127</td>
|
||||
<td data-sparkline="24, 27, 41, 35 "/>
|
||||
<td>71</td>
|
||||
<td data-sparkline="30, 2, 36, 3 "/>
|
||||
<td>56</td>
|
||||
<td data-sparkline="-6, 25, 5, 32 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Washington</th>
|
||||
<td>165</td>
|
||||
<td data-sparkline="40, 11, 63, 51 "/>
|
||||
<td>245</td>
|
||||
<td data-sparkline="46, 41, 94, 64 "/>
|
||||
<td>-80</td>
|
||||
<td data-sparkline="-6, -30, -31, -13 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>West Virginia</th>
|
||||
<td>248</td>
|
||||
<td data-sparkline="66, 56, 97, 29 "/>
|
||||
<td>171</td>
|
||||
<td data-sparkline="65, 53, 37, 16 "/>
|
||||
<td>77</td>
|
||||
<td data-sparkline="1, 3, 60, 13 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Wisconsin</th>
|
||||
<td>183</td>
|
||||
<td data-sparkline="24, 55, 21, 83 "/>
|
||||
<td>224</td>
|
||||
<td data-sparkline="80, 64, 13, 67 "/>
|
||||
<td>-41</td>
|
||||
<td data-sparkline="-56, -9, 8, 16 ; column"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Wyoming</th>
|
||||
<td>231</td>
|
||||
<td data-sparkline="52, 49, 97, 33 "/>
|
||||
<td>251</td>
|
||||
<td data-sparkline="96, 50, 23, 82 "/>
|
||||
<td>-20</td>
|
||||
<td data-sparkline="-44, -1, 74, -49 ; column"/>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
79
lib/highcharts/examples/spline-inverted/index.htm
Normal file
79
lib/highcharts/examples/spline-inverted/index.htm
Normal file
@ -0,0 +1,79 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'spline',
|
||||
inverted: true
|
||||
},
|
||||
title: {
|
||||
text: 'Atmosphere Temperature by Altitude'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'According to the Standard Atmosphere Model'
|
||||
},
|
||||
xAxis: {
|
||||
reversed: false,
|
||||
title: {
|
||||
enabled: true,
|
||||
text: 'Altitude'
|
||||
},
|
||||
labels: {
|
||||
formatter: function () {
|
||||
return this.value + 'km';
|
||||
}
|
||||
},
|
||||
maxPadding: 0.05,
|
||||
showLastLabel: true
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Temperature'
|
||||
},
|
||||
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: 'Temperature',
|
||||
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]]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
132
lib/highcharts/examples/spline-irregular-time/index.htm
Normal file
132
lib/highcharts/examples/spline-irregular-time/index.htm
Normal file
@ -0,0 +1,132 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'spline'
|
||||
},
|
||||
title: {
|
||||
text: 'Snow depth at Vikjafjellet, Norway'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Irregular time data in Highcharts JS'
|
||||
},
|
||||
xAxis: {
|
||||
type: 'datetime',
|
||||
dateTimeLabelFormats: { // don't display the dummy year
|
||||
month: '%e. %b',
|
||||
year: '%b'
|
||||
},
|
||||
title: {
|
||||
text: 'Date'
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Snow depth (m)'
|
||||
},
|
||||
min: 0
|
||||
},
|
||||
tooltip: {
|
||||
headerFormat: '<b>{series.name}</b><br>',
|
||||
pointFormat: '{point.x:%e. %b}: {point.y:.2f} m'
|
||||
},
|
||||
|
||||
plotOptions: {
|
||||
spline: {
|
||||
marker: {
|
||||
enabled: true
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
series: [{
|
||||
name: "Winter 2012-2013",
|
||||
// Define the data points. All series have a dummy year
|
||||
// of 1970/71 in order to be compared on the same x axis. Note
|
||||
// that in JavaScript, months start at 0 for January, 1 for February etc.
|
||||
data: [
|
||||
[Date.UTC(1970, 9, 21), 0],
|
||||
[Date.UTC(1970, 10, 4), 0.28],
|
||||
[Date.UTC(1970, 10, 9), 0.25],
|
||||
[Date.UTC(1970, 10, 27), 0.2],
|
||||
[Date.UTC(1970, 11, 2), 0.28],
|
||||
[Date.UTC(1970, 11, 26), 0.28],
|
||||
[Date.UTC(1970, 11, 29), 0.47],
|
||||
[Date.UTC(1971, 0, 11), 0.79],
|
||||
[Date.UTC(1971, 0, 26), 0.72],
|
||||
[Date.UTC(1971, 1, 3), 1.02],
|
||||
[Date.UTC(1971, 1, 11), 1.12],
|
||||
[Date.UTC(1971, 1, 25), 1.2],
|
||||
[Date.UTC(1971, 2, 11), 1.18],
|
||||
[Date.UTC(1971, 3, 11), 1.19],
|
||||
[Date.UTC(1971, 4, 1), 1.85],
|
||||
[Date.UTC(1971, 4, 5), 2.22],
|
||||
[Date.UTC(1971, 4, 19), 1.15],
|
||||
[Date.UTC(1971, 5, 3), 0]
|
||||
]
|
||||
}, {
|
||||
name: "Winter 2013-2014",
|
||||
data: [
|
||||
[Date.UTC(1970, 9, 29), 0],
|
||||
[Date.UTC(1970, 10, 9), 0.4],
|
||||
[Date.UTC(1970, 11, 1), 0.25],
|
||||
[Date.UTC(1971, 0, 1), 1.66],
|
||||
[Date.UTC(1971, 0, 10), 1.8],
|
||||
[Date.UTC(1971, 1, 19), 1.76],
|
||||
[Date.UTC(1971, 2, 25), 2.62],
|
||||
[Date.UTC(1971, 3, 19), 2.41],
|
||||
[Date.UTC(1971, 3, 30), 2.05],
|
||||
[Date.UTC(1971, 4, 14), 1.7],
|
||||
[Date.UTC(1971, 4, 24), 1.1],
|
||||
[Date.UTC(1971, 5, 10), 0]
|
||||
]
|
||||
}, {
|
||||
name: "Winter 2014-2015",
|
||||
data: [
|
||||
[Date.UTC(1970, 10, 25), 0],
|
||||
[Date.UTC(1970, 11, 6), 0.25],
|
||||
[Date.UTC(1970, 11, 20), 1.41],
|
||||
[Date.UTC(1970, 11, 25), 1.64],
|
||||
[Date.UTC(1971, 0, 4), 1.6],
|
||||
[Date.UTC(1971, 0, 17), 2.55],
|
||||
[Date.UTC(1971, 0, 24), 2.62],
|
||||
[Date.UTC(1971, 1, 4), 2.5],
|
||||
[Date.UTC(1971, 1, 14), 2.42],
|
||||
[Date.UTC(1971, 2, 6), 2.74],
|
||||
[Date.UTC(1971, 2, 14), 2.62],
|
||||
[Date.UTC(1971, 2, 24), 2.6],
|
||||
[Date.UTC(1971, 3, 2), 2.81],
|
||||
[Date.UTC(1971, 3, 12), 2.63],
|
||||
[Date.UTC(1971, 3, 28), 2.77],
|
||||
[Date.UTC(1971, 4, 5), 2.68],
|
||||
[Date.UTC(1971, 4, 10), 2.56],
|
||||
[Date.UTC(1971, 4, 15), 2.39],
|
||||
[Date.UTC(1971, 4, 20), 2.3],
|
||||
[Date.UTC(1971, 5, 5), 2],
|
||||
[Date.UTC(1971, 5, 10), 1.85],
|
||||
[Date.UTC(1971, 5, 15), 1.49],
|
||||
[Date.UTC(1971, 5, 23), 1.08]
|
||||
]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
151
lib/highcharts/examples/spline-plot-bands/index.htm
Normal file
151
lib/highcharts/examples/spline-plot-bands/index.htm
Normal file
@ -0,0 +1,151 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
// Data retrieved from http://vikjavev.no/ver/index.php?spenn=2d&sluttid=16.06.2015.
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'spline'
|
||||
},
|
||||
title: {
|
||||
text: 'Wind speed during two days'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'May 31 and and June 1, 2015 at two locations in Vik i Sogn, Norway'
|
||||
},
|
||||
xAxis: {
|
||||
type: 'datetime',
|
||||
labels: {
|
||||
overflow: 'justify'
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Wind speed (m/s)'
|
||||
},
|
||||
minorGridLineWidth: 0,
|
||||
gridLineWidth: 0,
|
||||
alternateGridColor: null,
|
||||
plotBands: [{ // Light air
|
||||
from: 0.3,
|
||||
to: 1.5,
|
||||
color: 'rgba(68, 170, 213, 0.1)',
|
||||
label: {
|
||||
text: 'Light air',
|
||||
style: {
|
||||
color: '#606060'
|
||||
}
|
||||
}
|
||||
}, { // Light breeze
|
||||
from: 1.5,
|
||||
to: 3.3,
|
||||
color: 'rgba(0, 0, 0, 0)',
|
||||
label: {
|
||||
text: 'Light breeze',
|
||||
style: {
|
||||
color: '#606060'
|
||||
}
|
||||
}
|
||||
}, { // Gentle breeze
|
||||
from: 3.3,
|
||||
to: 5.5,
|
||||
color: 'rgba(68, 170, 213, 0.1)',
|
||||
label: {
|
||||
text: 'Gentle breeze',
|
||||
style: {
|
||||
color: '#606060'
|
||||
}
|
||||
}
|
||||
}, { // Moderate breeze
|
||||
from: 5.5,
|
||||
to: 8,
|
||||
color: 'rgba(0, 0, 0, 0)',
|
||||
label: {
|
||||
text: 'Moderate breeze',
|
||||
style: {
|
||||
color: '#606060'
|
||||
}
|
||||
}
|
||||
}, { // Fresh breeze
|
||||
from: 8,
|
||||
to: 11,
|
||||
color: 'rgba(68, 170, 213, 0.1)',
|
||||
label: {
|
||||
text: 'Fresh breeze',
|
||||
style: {
|
||||
color: '#606060'
|
||||
}
|
||||
}
|
||||
}, { // Strong breeze
|
||||
from: 11,
|
||||
to: 14,
|
||||
color: 'rgba(0, 0, 0, 0)',
|
||||
label: {
|
||||
text: 'Strong breeze',
|
||||
style: {
|
||||
color: '#606060'
|
||||
}
|
||||
}
|
||||
}, { // High wind
|
||||
from: 14,
|
||||
to: 15,
|
||||
color: 'rgba(68, 170, 213, 0.1)',
|
||||
label: {
|
||||
text: 'High wind',
|
||||
style: {
|
||||
color: '#606060'
|
||||
}
|
||||
}
|
||||
}]
|
||||
},
|
||||
tooltip: {
|
||||
valueSuffix: ' m/s'
|
||||
},
|
||||
plotOptions: {
|
||||
spline: {
|
||||
lineWidth: 4,
|
||||
states: {
|
||||
hover: {
|
||||
lineWidth: 5
|
||||
}
|
||||
},
|
||||
marker: {
|
||||
enabled: false
|
||||
},
|
||||
pointInterval: 3600000, // one hour
|
||||
pointStart: Date.UTC(2015, 4, 31, 0, 0, 0)
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: 'Hestavollane',
|
||||
data: [0.2, 0.8, 0.8, 0.8, 1, 1.3, 1.5, 2.9, 1.9, 2.6, 1.6, 3, 4, 3.6, 4.5, 4.2, 4.5, 4.5, 4, 3.1, 2.7, 4, 2.7, 2.3, 2.3, 4.1, 7.7, 7.1, 5.6, 6.1, 5.8, 8.6, 7.2, 9, 10.9, 11.5, 11.6, 11.1, 12, 12.3, 10.7, 9.4, 9.8, 9.6, 9.8, 9.5, 8.5, 7.4, 7.6]
|
||||
|
||||
}, {
|
||||
name: 'Vik',
|
||||
data: [0, 0, 0.6, 0.9, 0.8, 0.2, 0, 0, 0, 0.1, 0.6, 0.7, 0.8, 0.6, 0.2, 0, 0.1, 0.3, 0.3, 0, 0.1, 0, 0, 0, 0.2, 0.1, 0, 0.3, 0, 0.1, 0.2, 0.1, 0.3, 0.3, 0, 3.1, 3.1, 2.5, 1.5, 1.9, 2.1, 1, 2.3, 1.9, 1.2, 0.7, 1.3, 0.4, 0.3]
|
||||
}],
|
||||
navigation: {
|
||||
menuItemStyle: {
|
||||
fontSize: '10px'
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
85
lib/highcharts/examples/spline-symbols/index.htm
Normal file
85
lib/highcharts/examples/spline-symbols/index.htm
Normal file
@ -0,0 +1,85 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'spline'
|
||||
},
|
||||
title: {
|
||||
text: 'Monthly Average Temperature'
|
||||
},
|
||||
subtitle: {
|
||||
text: 'Source: WorldClimate.com'
|
||||
},
|
||||
xAxis: {
|
||||
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
|
||||
'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'Temperature'
|
||||
},
|
||||
labels: {
|
||||
formatter: function () {
|
||||
return this.value + '°';
|
||||
}
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
crosshairs: true,
|
||||
shared: true
|
||||
},
|
||||
plotOptions: {
|
||||
spline: {
|
||||
marker: {
|
||||
radius: 4,
|
||||
lineColor: '#666666',
|
||||
lineWidth: 1
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [{
|
||||
name: 'Tokyo',
|
||||
marker: {
|
||||
symbol: 'square'
|
||||
},
|
||||
data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, {
|
||||
y: 26.5,
|
||||
marker: {
|
||||
symbol: 'url(http://www.highcharts.com/demo/gfx/sun.png)'
|
||||
}
|
||||
}, 23.3, 18.3, 13.9, 9.6]
|
||||
|
||||
}, {
|
||||
name: 'London',
|
||||
marker: {
|
||||
symbol: 'diamond'
|
||||
},
|
||||
data: [{
|
||||
y: 3.9,
|
||||
marker: {
|
||||
symbol: 'url(http://www.highcharts.com/demo/gfx/snow.png)'
|
||||
}
|
||||
}, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
|
||||
}]
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
156
lib/highcharts/examples/synchronized-charts/index.htm
Normal file
156
lib/highcharts/examples/synchronized-charts/index.htm
Normal file
@ -0,0 +1,156 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
.chart {
|
||||
min-width: 320px;
|
||||
max-width: 800px;
|
||||
height: 220px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
</style>
|
||||
<!-- http://doc.jsfiddle.net/use/hacks.html#css-panel-hack -->
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<style>
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
/*
|
||||
The purpose of this demo is to demonstrate how multiple charts on the same page can be linked
|
||||
through DOM and Highcharts events and API methods. It takes a standard Highcharts config with a
|
||||
small variation for each data set, and a mouse/touch event handler to bind the charts together.
|
||||
*/
|
||||
|
||||
$(function () {
|
||||
|
||||
/**
|
||||
* In order to synchronize tooltips and crosshairs, override the
|
||||
* built-in events with handlers defined on the parent element.
|
||||
*/
|
||||
$('#container').bind('mousemove touchmove', function (e) {
|
||||
var chart,
|
||||
point,
|
||||
i;
|
||||
|
||||
for (i = 0; i < Highcharts.charts.length; i = i + 1) {
|
||||
chart = Highcharts.charts[i];
|
||||
e = chart.pointer.normalize(e); // Find coordinates within the chart
|
||||
point = chart.series[0].searchPoint(e, true); // Get the hovered point
|
||||
|
||||
if (point) {
|
||||
point.onMouseOver(); // Show the hover marker
|
||||
chart.tooltip.refresh(point); // Show the tooltip
|
||||
chart.xAxis[0].drawCrosshair(e, point); // Show the crosshair
|
||||
}
|
||||
}
|
||||
});
|
||||
/**
|
||||
* Override the reset function, we don't need to hide the tooltips and crosshairs.
|
||||
*/
|
||||
Highcharts.Pointer.prototype.reset = function () {
|
||||
return undefined;
|
||||
};
|
||||
|
||||
/**
|
||||
* Synchronize zooming through the setExtremes event handler.
|
||||
*/
|
||||
function syncExtremes(e) {
|
||||
var thisChart = this.chart;
|
||||
|
||||
Highcharts.each(Highcharts.charts, function (chart) {
|
||||
if (chart !== thisChart) {
|
||||
if (chart.xAxis[0].setExtremes) { // It is null while updating
|
||||
chart.xAxis[0].setExtremes(e.min, e.max);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Get the data. The contents of the data file can be viewed at
|
||||
// https://github.com/highslide-software/highcharts.com/blob/master/samples/data/activity.json
|
||||
$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=activity.json&callback=?', function (activity) {
|
||||
$.each(activity.datasets, function (i, dataset) {
|
||||
|
||||
// Add X values
|
||||
dataset.data = Highcharts.map(dataset.data, function (val, i) {
|
||||
return [activity.xData[i], val];
|
||||
});
|
||||
|
||||
$('<div class="chart">')
|
||||
.appendTo('#container')
|
||||
.highcharts({
|
||||
chart: {
|
||||
marginLeft: 40, // Keep all charts left aligned
|
||||
spacingTop: 20,
|
||||
spacingBottom: 20
|
||||
// zoomType: 'x',
|
||||
// pinchType: null // Disable zoom on touch devices
|
||||
},
|
||||
title: {
|
||||
text: dataset.name,
|
||||
align: 'left',
|
||||
margin: 0,
|
||||
x: 30
|
||||
},
|
||||
credits: {
|
||||
enabled: false
|
||||
},
|
||||
legend: {
|
||||
enabled: false
|
||||
},
|
||||
xAxis: {
|
||||
crosshair: true,
|
||||
events: {
|
||||
setExtremes: syncExtremes
|
||||
},
|
||||
labels: {
|
||||
format: '{value} km'
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
title: {
|
||||
text: null
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
positioner: function () {
|
||||
return {
|
||||
x: this.chart.chartWidth - this.label.width, // right aligned
|
||||
y: -1 // align to title
|
||||
};
|
||||
},
|
||||
borderWidth: 0,
|
||||
backgroundColor: 'none',
|
||||
pointFormat: '{point.y}',
|
||||
headerFormat: '',
|
||||
shadow: false,
|
||||
style: {
|
||||
fontSize: '18px'
|
||||
},
|
||||
valueDecimals: dataset.valueDecimals
|
||||
},
|
||||
series: [{
|
||||
data: dataset.data,
|
||||
name: dataset.name,
|
||||
type: dataset.type,
|
||||
color: Highcharts.getOptions().colors[i],
|
||||
fillOpacity: 0.3,
|
||||
tooltip: {
|
||||
valueSuffix: ' ' + dataset.unit
|
||||
}
|
||||
}]
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
|
||||
<div id="container"></div>
|
||||
</body>
|
||||
</html>
|
||||
68
lib/highcharts/examples/treemap-coloraxis/index.htm
Normal file
68
lib/highcharts/examples/treemap-coloraxis/index.htm
Normal file
@ -0,0 +1,68 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
#container {
|
||||
min-width: 300px;
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
colorAxis: {
|
||||
minColor: '#FFFFFF',
|
||||
maxColor: Highcharts.getOptions().colors[0]
|
||||
},
|
||||
series: [{
|
||||
type: "treemap",
|
||||
layoutAlgorithm: 'squarified',
|
||||
data: [{
|
||||
name: 'A',
|
||||
value: 6,
|
||||
colorValue: 1
|
||||
}, {
|
||||
name: 'B',
|
||||
value: 6,
|
||||
colorValue: 2
|
||||
}, {
|
||||
name: 'C',
|
||||
value: 4,
|
||||
colorValue: 3
|
||||
}, {
|
||||
name: 'D',
|
||||
value: 3,
|
||||
colorValue: 4
|
||||
}, {
|
||||
name: 'E',
|
||||
value: 2,
|
||||
colorValue: 5
|
||||
}, {
|
||||
name: 'F',
|
||||
value: 2,
|
||||
colorValue: 6
|
||||
}, {
|
||||
name: 'G',
|
||||
value: 1,
|
||||
colorValue: 7
|
||||
}]
|
||||
}],
|
||||
title: {
|
||||
text: 'Highcharts Treemap'
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/heatmap.js"></script>
|
||||
<script src="../../js/modules/treemap.js"></script>
|
||||
<div id="container"></div>
|
||||
</body>
|
||||
</html>
|
||||
980
lib/highcharts/examples/treemap-large-dataset/index.htm
Normal file
980
lib/highcharts/examples/treemap-large-dataset/index.htm
Normal file
@ -0,0 +1,980 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
#container {
|
||||
min-width: 300px;
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
var data = {
|
||||
"South-East Asia": {
|
||||
"Sri Lanka": {
|
||||
"Communicable & other Group I": "75.5",
|
||||
"Injuries": "89.0",
|
||||
"Noncommunicable diseases": "501.2"
|
||||
},
|
||||
"Bangladesh": {
|
||||
"Noncommunicable diseases": "548.9",
|
||||
"Injuries": "64.0",
|
||||
"Communicable & other Group I": "234.6"
|
||||
},
|
||||
"Myanmar": {
|
||||
"Communicable & other Group I": "316.4",
|
||||
"Injuries": "102.0",
|
||||
"Noncommunicable diseases": "708.7"
|
||||
},
|
||||
"Maldives": {
|
||||
"Injuries": "35.0",
|
||||
"Noncommunicable diseases": "487.2",
|
||||
"Communicable & other Group I": "59.2"
|
||||
},
|
||||
"Democratic People's Republic of Korea": {
|
||||
"Injuries": "91.9",
|
||||
"Noncommunicable diseases": "751.4",
|
||||
"Communicable & other Group I": "117.3"
|
||||
},
|
||||
"Bhutan": {
|
||||
"Injuries": "142.2",
|
||||
"Noncommunicable diseases": "572.8",
|
||||
"Communicable & other Group I": "186.9"
|
||||
},
|
||||
"Thailand": {
|
||||
"Injuries": "72.8",
|
||||
"Communicable & other Group I": "123.3",
|
||||
"Noncommunicable diseases": "449.1"
|
||||
},
|
||||
"Nepal": {
|
||||
"Noncommunicable diseases": "678.1",
|
||||
"Injuries": "88.7",
|
||||
"Communicable & other Group I": "251.8"
|
||||
},
|
||||
"Timor-Leste": {
|
||||
"Injuries": "69.2",
|
||||
"Noncommunicable diseases": "670.5",
|
||||
"Communicable & other Group I": "343.5"
|
||||
},
|
||||
"India": {
|
||||
"Communicable & other Group I": "253.0",
|
||||
"Injuries": "115.9",
|
||||
"Noncommunicable diseases": "682.3"
|
||||
},
|
||||
"Indonesia": {
|
||||
"Injuries": "49.3",
|
||||
"Noncommunicable diseases": "680.1",
|
||||
"Communicable & other Group I": "162.4"
|
||||
}
|
||||
},
|
||||
"Europe": {
|
||||
"Hungary": {
|
||||
"Communicable & other Group I": "16.8",
|
||||
"Noncommunicable diseases": "602.8",
|
||||
"Injuries": "44.3"
|
||||
},
|
||||
"Poland": {
|
||||
"Communicable & other Group I": "22.6",
|
||||
"Noncommunicable diseases": "494.5",
|
||||
"Injuries": "48.9"
|
||||
},
|
||||
"Israel": {
|
||||
"Communicable & other Group I": "31.2",
|
||||
"Noncommunicable diseases": "311.2",
|
||||
"Injuries": "20.8"
|
||||
},
|
||||
"France": {
|
||||
"Communicable & other Group I": "21.4",
|
||||
"Noncommunicable diseases": "313.2",
|
||||
"Injuries": "34.6"
|
||||
},
|
||||
"Turkey": {
|
||||
"Injuries": "39.1",
|
||||
"Communicable & other Group I": "43.9",
|
||||
"Noncommunicable diseases": "555.2"
|
||||
},
|
||||
"Kyrgyzstan": {
|
||||
"Communicable & other Group I": "65.8",
|
||||
"Injuries": "65.1",
|
||||
"Noncommunicable diseases": "835.4"
|
||||
},
|
||||
"Croatia": {
|
||||
"Communicable & other Group I": "12.2",
|
||||
"Noncommunicable diseases": "495.8",
|
||||
"Injuries": "40.1"
|
||||
},
|
||||
"Portugal": {
|
||||
"Injuries": "25.2",
|
||||
"Communicable & other Group I": "39.9",
|
||||
"Noncommunicable diseases": "343.3"
|
||||
},
|
||||
"Greece": {
|
||||
"Injuries": "26.5",
|
||||
"Noncommunicable diseases": "365.0",
|
||||
"Communicable & other Group I": "24.1"
|
||||
},
|
||||
"Italy": {
|
||||
"Injuries": "20.1",
|
||||
"Communicable & other Group I": "15.5",
|
||||
"Noncommunicable diseases": "303.6"
|
||||
},
|
||||
"Belgium": {
|
||||
"Communicable & other Group I": "27.8",
|
||||
"Injuries": "38.9",
|
||||
"Noncommunicable diseases": "356.8"
|
||||
},
|
||||
"Lithuania": {
|
||||
"Noncommunicable diseases": "580.6",
|
||||
"Communicable & other Group I": "25.5",
|
||||
"Injuries": "76.4"
|
||||
},
|
||||
"Uzbekistan": {
|
||||
"Communicable & other Group I": "85.8",
|
||||
"Injuries": "47.4",
|
||||
"Noncommunicable diseases": "810.9"
|
||||
},
|
||||
"Serbia": {
|
||||
"Communicable & other Group I": "19.4",
|
||||
"Injuries": "32.0",
|
||||
"Noncommunicable diseases": "657.7"
|
||||
},
|
||||
"Austria": {
|
||||
"Noncommunicable diseases": "359.5",
|
||||
"Injuries": "30.6",
|
||||
"Communicable & other Group I": "12.6"
|
||||
},
|
||||
"Bosnia and Herzegovina": {
|
||||
"Injuries": "42.4",
|
||||
"Noncommunicable diseases": "512.5",
|
||||
"Communicable & other Group I": "20.0"
|
||||
},
|
||||
"Slovakia": {
|
||||
"Injuries": "39.1",
|
||||
"Communicable & other Group I": "35.3",
|
||||
"Noncommunicable diseases": "532.5"
|
||||
},
|
||||
"The former Yugoslav republic of Macedonia": {
|
||||
"Injuries": "24.0",
|
||||
"Communicable & other Group I": "16.9",
|
||||
"Noncommunicable diseases": "636.5"
|
||||
},
|
||||
"Sweden": {
|
||||
"Communicable & other Group I": "19.3",
|
||||
"Noncommunicable diseases": "333.5",
|
||||
"Injuries": "26.1"
|
||||
},
|
||||
"Russian Federation": {
|
||||
"Noncommunicable diseases": "790.3",
|
||||
"Communicable & other Group I": "73.8",
|
||||
"Injuries": "102.8"
|
||||
},
|
||||
"Republic of Moldova": {
|
||||
"Noncommunicable diseases": "787.6",
|
||||
"Injuries": "75.7",
|
||||
"Communicable & other Group I": "44.5"
|
||||
},
|
||||
"Ireland": {
|
||||
"Injuries": "31.8",
|
||||
"Communicable & other Group I": "21.5",
|
||||
"Noncommunicable diseases": "343.9"
|
||||
},
|
||||
"Estonia": {
|
||||
"Injuries": "47.0",
|
||||
"Communicable & other Group I": "18.5",
|
||||
"Noncommunicable diseases": "510.7"
|
||||
},
|
||||
"Cyprus": {
|
||||
"Noncommunicable diseases": "333.0",
|
||||
"Injuries": "26.6",
|
||||
"Communicable & other Group I": "16.2"
|
||||
},
|
||||
"Kazakhstan": {
|
||||
"Noncommunicable diseases": "949.7",
|
||||
"Injuries": "101.6",
|
||||
"Communicable & other Group I": "55.3"
|
||||
},
|
||||
"Netherlands": {
|
||||
"Noncommunicable diseases": "355.2",
|
||||
"Injuries": "22.3",
|
||||
"Communicable & other Group I": "25.5"
|
||||
},
|
||||
"Finland": {
|
||||
"Noncommunicable diseases": "366.6",
|
||||
"Injuries": "38.7",
|
||||
"Communicable & other Group I": "9.0"
|
||||
},
|
||||
"Romania": {
|
||||
"Noncommunicable diseases": "612.2",
|
||||
"Injuries": "40.7",
|
||||
"Communicable & other Group I": "38.5"
|
||||
},
|
||||
"Albania": {
|
||||
"Noncommunicable diseases": "671.6",
|
||||
"Injuries": "48.0",
|
||||
"Communicable & other Group I": "46.5"
|
||||
},
|
||||
"Iceland": {
|
||||
"Injuries": "29.0",
|
||||
"Noncommunicable diseases": "311.7",
|
||||
"Communicable & other Group I": "14.0"
|
||||
},
|
||||
"Azerbaijan": {
|
||||
"Noncommunicable diseases": "664.3",
|
||||
"Injuries": "33.6",
|
||||
"Communicable & other Group I": "70.8"
|
||||
},
|
||||
"Tajikistan": {
|
||||
"Injuries": "51.6",
|
||||
"Communicable & other Group I": "147.7",
|
||||
"Noncommunicable diseases": "752.6"
|
||||
},
|
||||
"Bulgaria": {
|
||||
"Communicable & other Group I": "33.4",
|
||||
"Injuries": "36.4",
|
||||
"Noncommunicable diseases": "638.2"
|
||||
},
|
||||
"United Kingdom of Great Britain and Northern Ireland": {
|
||||
"Communicable & other Group I": "28.5",
|
||||
"Injuries": "21.5",
|
||||
"Noncommunicable diseases": "358.8"
|
||||
},
|
||||
"Spain": {
|
||||
"Communicable & other Group I": "19.1",
|
||||
"Injuries": "17.8",
|
||||
"Noncommunicable diseases": "323.1"
|
||||
},
|
||||
"Ukraine": {
|
||||
"Communicable & other Group I": "69.3",
|
||||
"Injuries": "67.3",
|
||||
"Noncommunicable diseases": "749.0"
|
||||
},
|
||||
"Norway": {
|
||||
"Noncommunicable diseases": "336.6",
|
||||
"Communicable & other Group I": "25.2",
|
||||
"Injuries": "25.6"
|
||||
},
|
||||
"Denmark": {
|
||||
"Injuries": "22.5",
|
||||
"Communicable & other Group I": "29.5",
|
||||
"Noncommunicable diseases": "406.1"
|
||||
},
|
||||
"Belarus": {
|
||||
"Noncommunicable diseases": "682.5",
|
||||
"Communicable & other Group I": "28.3",
|
||||
"Injuries": "91.3"
|
||||
},
|
||||
"Malta": {
|
||||
"Noncommunicable diseases": "364.5",
|
||||
"Injuries": "19.0",
|
||||
"Communicable & other Group I": "23.6"
|
||||
},
|
||||
"Latvia": {
|
||||
"Noncommunicable diseases": "623.7",
|
||||
"Injuries": "54.5",
|
||||
"Communicable & other Group I": "26.0"
|
||||
},
|
||||
"Turkmenistan": {
|
||||
"Injuries": "93.0",
|
||||
"Communicable & other Group I": "115.8",
|
||||
"Noncommunicable diseases": "1025.1"
|
||||
},
|
||||
"Switzerland": {
|
||||
"Communicable & other Group I": "14.5",
|
||||
"Noncommunicable diseases": "291.6",
|
||||
"Injuries": "25.4"
|
||||
},
|
||||
"Luxembourg": {
|
||||
"Injuries": "31.1",
|
||||
"Noncommunicable diseases": "317.8",
|
||||
"Communicable & other Group I": "20.5"
|
||||
},
|
||||
"Georgia": {
|
||||
"Injuries": "32.2",
|
||||
"Communicable & other Group I": "39.3",
|
||||
"Noncommunicable diseases": "615.2"
|
||||
},
|
||||
"Slovenia": {
|
||||
"Noncommunicable diseases": "369.2",
|
||||
"Communicable & other Group I": "15.4",
|
||||
"Injuries": "44.2"
|
||||
},
|
||||
"Montenegro": {
|
||||
"Communicable & other Group I": "18.7",
|
||||
"Noncommunicable diseases": "571.5",
|
||||
"Injuries": "41.2"
|
||||
},
|
||||
"Armenia": {
|
||||
"Noncommunicable diseases": "847.5",
|
||||
"Communicable & other Group I": "45.0",
|
||||
"Injuries": "49.2"
|
||||
},
|
||||
"Germany": {
|
||||
"Injuries": "23.0",
|
||||
"Communicable & other Group I": "21.6",
|
||||
"Noncommunicable diseases": "365.1"
|
||||
},
|
||||
"Czech Republic": {
|
||||
"Injuries": "39.1",
|
||||
"Noncommunicable diseases": "460.7",
|
||||
"Communicable & other Group I": "27.0"
|
||||
}
|
||||
},
|
||||
"Africa": {
|
||||
"Equatorial Guinea": {
|
||||
"Communicable & other Group I": "756.8",
|
||||
"Injuries": "133.6",
|
||||
"Noncommunicable diseases": "729.0"
|
||||
},
|
||||
"Madagascar": {
|
||||
"Noncommunicable diseases": "648.6",
|
||||
"Communicable & other Group I": "429.9",
|
||||
"Injuries": "89.0"
|
||||
},
|
||||
"Swaziland": {
|
||||
"Communicable & other Group I": "884.3",
|
||||
"Injuries": "119.5",
|
||||
"Noncommunicable diseases": "702.4"
|
||||
},
|
||||
"Congo": {
|
||||
"Noncommunicable diseases": "632.3",
|
||||
"Communicable & other Group I": "666.9",
|
||||
"Injuries": "89.0"
|
||||
},
|
||||
"Burkina Faso": {
|
||||
"Communicable & other Group I": "648.2",
|
||||
"Noncommunicable diseases": "784.0",
|
||||
"Injuries": "119.3"
|
||||
},
|
||||
"Guinea-Bissau": {
|
||||
"Communicable & other Group I": "869.8",
|
||||
"Noncommunicable diseases": "764.7",
|
||||
"Injuries": "111.6"
|
||||
},
|
||||
"Democratic Republic of the Congo": {
|
||||
"Noncommunicable diseases": "724.4",
|
||||
"Injuries": "137.1",
|
||||
"Communicable & other Group I": "920.7"
|
||||
},
|
||||
"Mozambique": {
|
||||
"Injuries": "175.3",
|
||||
"Noncommunicable diseases": "593.7",
|
||||
"Communicable & other Group I": "998.1"
|
||||
},
|
||||
"Central African Republic": {
|
||||
"Communicable & other Group I": "1212.1",
|
||||
"Injuries": "107.9",
|
||||
"Noncommunicable diseases": "550.8"
|
||||
},
|
||||
"United Republic of Tanzania": {
|
||||
"Noncommunicable diseases": "569.8",
|
||||
"Communicable & other Group I": "584.2",
|
||||
"Injuries": "129.2"
|
||||
},
|
||||
"Cameroon": {
|
||||
"Communicable & other Group I": "768.8",
|
||||
"Injuries": "106.0",
|
||||
"Noncommunicable diseases": "675.2"
|
||||
},
|
||||
"Togo": {
|
||||
"Noncommunicable diseases": "679.0",
|
||||
"Communicable & other Group I": "681.8",
|
||||
"Injuries": "93.0"
|
||||
},
|
||||
"Eritrea": {
|
||||
"Injuries": "118.7",
|
||||
"Communicable & other Group I": "506.0",
|
||||
"Noncommunicable diseases": "671.9"
|
||||
},
|
||||
"Namibia": {
|
||||
"Injuries": "76.4",
|
||||
"Noncommunicable diseases": "580.2",
|
||||
"Communicable & other Group I": "356.6"
|
||||
},
|
||||
"Senegal": {
|
||||
"Noncommunicable diseases": "558.1",
|
||||
"Injuries": "89.3",
|
||||
"Communicable & other Group I": "587.7"
|
||||
},
|
||||
"Chad": {
|
||||
"Communicable & other Group I": "1070.9",
|
||||
"Injuries": "114.5",
|
||||
"Noncommunicable diseases": "712.6"
|
||||
},
|
||||
"Benin": {
|
||||
"Injuries": "98.0",
|
||||
"Noncommunicable diseases": "761.5",
|
||||
"Communicable & other Group I": "577.3"
|
||||
},
|
||||
"Zimbabwe": {
|
||||
"Communicable & other Group I": "711.3",
|
||||
"Injuries": "82.5",
|
||||
"Noncommunicable diseases": "598.9"
|
||||
},
|
||||
"Rwanda": {
|
||||
"Noncommunicable diseases": "585.3",
|
||||
"Injuries": "106.3",
|
||||
"Communicable & other Group I": "401.7"
|
||||
},
|
||||
"Zambia": {
|
||||
"Noncommunicable diseases": "587.4",
|
||||
"Injuries": "156.4",
|
||||
"Communicable & other Group I": "764.3"
|
||||
},
|
||||
"Mali": {
|
||||
"Injuries": "119.5",
|
||||
"Communicable & other Group I": "588.3",
|
||||
"Noncommunicable diseases": "866.1"
|
||||
},
|
||||
"Ethiopia": {
|
||||
"Injuries": "94.5",
|
||||
"Communicable & other Group I": "558.9",
|
||||
"Noncommunicable diseases": "476.3"
|
||||
},
|
||||
"South Africa": {
|
||||
"Communicable & other Group I": "611.6",
|
||||
"Injuries": "103.5",
|
||||
"Noncommunicable diseases": "710.9"
|
||||
},
|
||||
"Burundi": {
|
||||
"Injuries": "146.6",
|
||||
"Communicable & other Group I": "704.8",
|
||||
"Noncommunicable diseases": "729.5"
|
||||
},
|
||||
"Cabo Verde": {
|
||||
"Injuries": "54.4",
|
||||
"Noncommunicable diseases": "482.1",
|
||||
"Communicable & other Group I": "141.9"
|
||||
},
|
||||
"Liberia": {
|
||||
"Noncommunicable diseases": "656.9",
|
||||
"Injuries": "83.3",
|
||||
"Communicable & other Group I": "609.1"
|
||||
},
|
||||
"Uganda": {
|
||||
"Noncommunicable diseases": "664.4",
|
||||
"Communicable & other Group I": "696.7",
|
||||
"Injuries": "166.8"
|
||||
},
|
||||
"Mauritius": {
|
||||
"Noncommunicable diseases": "576.5",
|
||||
"Injuries": "44.1",
|
||||
"Communicable & other Group I": "61.8"
|
||||
},
|
||||
"Algeria": {
|
||||
"Noncommunicable diseases": "710.4",
|
||||
"Injuries": "53.8",
|
||||
"Communicable & other Group I": "97.8"
|
||||
},
|
||||
"C\u00f4te d'Ivoire": {
|
||||
"Noncommunicable diseases": "794.0",
|
||||
"Injuries": "124.0",
|
||||
"Communicable & other Group I": "861.3"
|
||||
},
|
||||
"Malawi": {
|
||||
"Injuries": "97.7",
|
||||
"Communicable & other Group I": "777.6",
|
||||
"Noncommunicable diseases": "655.0"
|
||||
},
|
||||
"Botswana": {
|
||||
"Injuries": "87.9",
|
||||
"Noncommunicable diseases": "612.2",
|
||||
"Communicable & other Group I": "555.3"
|
||||
},
|
||||
"Guinea": {
|
||||
"Injuries": "96.0",
|
||||
"Noncommunicable diseases": "681.1",
|
||||
"Communicable & other Group I": "679.6"
|
||||
},
|
||||
"Ghana": {
|
||||
"Injuries": "76.1",
|
||||
"Noncommunicable diseases": "669.9",
|
||||
"Communicable & other Group I": "476.0"
|
||||
},
|
||||
"Kenya": {
|
||||
"Noncommunicable diseases": "514.7",
|
||||
"Injuries": "101.1",
|
||||
"Communicable & other Group I": "657.5"
|
||||
},
|
||||
"Gambia": {
|
||||
"Noncommunicable diseases": "629.6",
|
||||
"Injuries": "96.0",
|
||||
"Communicable & other Group I": "590.5"
|
||||
},
|
||||
"Angola": {
|
||||
"Injuries": "137.8",
|
||||
"Noncommunicable diseases": "768.4",
|
||||
"Communicable & other Group I": "873.3"
|
||||
},
|
||||
"Sierra Leone": {
|
||||
"Communicable & other Group I": "1327.4",
|
||||
"Noncommunicable diseases": "963.5",
|
||||
"Injuries": "149.5"
|
||||
},
|
||||
"Mauritania": {
|
||||
"Communicable & other Group I": "619.1",
|
||||
"Injuries": "83.4",
|
||||
"Noncommunicable diseases": "555.1"
|
||||
},
|
||||
"Comoros": {
|
||||
"Communicable & other Group I": "494.6",
|
||||
"Injuries": "132.4",
|
||||
"Noncommunicable diseases": "695.5"
|
||||
},
|
||||
"Gabon": {
|
||||
"Noncommunicable diseases": "504.6",
|
||||
"Injuries": "77.4",
|
||||
"Communicable & other Group I": "589.4"
|
||||
},
|
||||
"Niger": {
|
||||
"Injuries": "97.6",
|
||||
"Communicable & other Group I": "740.0",
|
||||
"Noncommunicable diseases": "649.1"
|
||||
},
|
||||
"Lesotho": {
|
||||
"Communicable & other Group I": "1110.5",
|
||||
"Injuries": "142.5",
|
||||
"Noncommunicable diseases": "671.8"
|
||||
},
|
||||
"Nigeria": {
|
||||
"Noncommunicable diseases": "673.7",
|
||||
"Communicable & other Group I": "866.2",
|
||||
"Injuries": "145.6"
|
||||
}
|
||||
},
|
||||
"Americas": {
|
||||
"Canada": {
|
||||
"Noncommunicable diseases": "318.0",
|
||||
"Injuries": "31.3",
|
||||
"Communicable & other Group I": "22.6"
|
||||
},
|
||||
"Bolivia (Plurinational State of)": {
|
||||
"Communicable & other Group I": "226.2",
|
||||
"Noncommunicable diseases": "635.3",
|
||||
"Injuries": "100.0"
|
||||
},
|
||||
"Haiti": {
|
||||
"Communicable & other Group I": "405.4",
|
||||
"Noncommunicable diseases": "724.6",
|
||||
"Injuries": "89.3"
|
||||
},
|
||||
"Belize": {
|
||||
"Noncommunicable diseases": "470.7",
|
||||
"Injuries": "82.0",
|
||||
"Communicable & other Group I": "104.6"
|
||||
},
|
||||
"Suriname": {
|
||||
"Injuries": "70.5",
|
||||
"Communicable & other Group I": "83.7",
|
||||
"Noncommunicable diseases": "374.8"
|
||||
},
|
||||
"Argentina": {
|
||||
"Communicable & other Group I": "68.7",
|
||||
"Injuries": "50.7",
|
||||
"Noncommunicable diseases": "467.3"
|
||||
},
|
||||
"Mexico": {
|
||||
"Injuries": "63.2",
|
||||
"Communicable & other Group I": "57.0",
|
||||
"Noncommunicable diseases": "468.3"
|
||||
},
|
||||
"Jamaica": {
|
||||
"Injuries": "51.5",
|
||||
"Communicable & other Group I": "97.0",
|
||||
"Noncommunicable diseases": "519.1"
|
||||
},
|
||||
"Peru": {
|
||||
"Noncommunicable diseases": "363.5",
|
||||
"Injuries": "47.9",
|
||||
"Communicable & other Group I": "121.3"
|
||||
},
|
||||
"Brazil": {
|
||||
"Injuries": "80.2",
|
||||
"Communicable & other Group I": "92.8",
|
||||
"Noncommunicable diseases": "513.8"
|
||||
},
|
||||
"Venezuela (Bolivarian Republic of)": {
|
||||
"Communicable & other Group I": "58.2",
|
||||
"Injuries": "103.2",
|
||||
"Noncommunicable diseases": "410.6"
|
||||
},
|
||||
"Paraguay": {
|
||||
"Noncommunicable diseases": "485.5",
|
||||
"Communicable & other Group I": "77.3",
|
||||
"Injuries": "67.6"
|
||||
},
|
||||
"Chile": {
|
||||
"Noncommunicable diseases": "366.5",
|
||||
"Communicable & other Group I": "36.3",
|
||||
"Injuries": "41.2"
|
||||
},
|
||||
"Trinidad and Tobago": {
|
||||
"Noncommunicable diseases": "705.3",
|
||||
"Communicable & other Group I": "80.4",
|
||||
"Injuries": "98.4"
|
||||
},
|
||||
"Colombia": {
|
||||
"Noncommunicable diseases": "377.3",
|
||||
"Communicable & other Group I": "55.0",
|
||||
"Injuries": "72.6"
|
||||
},
|
||||
"Cuba": {
|
||||
"Injuries": "45.3",
|
||||
"Noncommunicable diseases": "421.8",
|
||||
"Communicable & other Group I": "33.2"
|
||||
},
|
||||
"El Salvador": {
|
||||
"Noncommunicable diseases": "474.9",
|
||||
"Injuries": "157.7",
|
||||
"Communicable & other Group I": "96.2"
|
||||
},
|
||||
"Honduras": {
|
||||
"Injuries": "80.8",
|
||||
"Communicable & other Group I": "117.5",
|
||||
"Noncommunicable diseases": "441.5"
|
||||
},
|
||||
"Ecuador": {
|
||||
"Noncommunicable diseases": "409.7",
|
||||
"Injuries": "83.7",
|
||||
"Communicable & other Group I": "97.3"
|
||||
},
|
||||
"Costa Rica": {
|
||||
"Communicable & other Group I": "30.5",
|
||||
"Noncommunicable diseases": "391.8",
|
||||
"Injuries": "46.5"
|
||||
},
|
||||
"Dominican Republic": {
|
||||
"Noncommunicable diseases": "396.0",
|
||||
"Injuries": "66.4",
|
||||
"Communicable & other Group I": "76.8"
|
||||
},
|
||||
"Nicaragua": {
|
||||
"Communicable & other Group I": "75.2",
|
||||
"Injuries": "64.4",
|
||||
"Noncommunicable diseases": "546.6"
|
||||
},
|
||||
"Barbados": {
|
||||
"Noncommunicable diseases": "404.5",
|
||||
"Injuries": "28.0",
|
||||
"Communicable & other Group I": "60.8"
|
||||
},
|
||||
"Uruguay": {
|
||||
"Noncommunicable diseases": "446.0",
|
||||
"Injuries": "53.8",
|
||||
"Communicable & other Group I": "46.2"
|
||||
},
|
||||
"Panama": {
|
||||
"Communicable & other Group I": "86.1",
|
||||
"Injuries": "67.4",
|
||||
"Noncommunicable diseases": "372.9"
|
||||
},
|
||||
"Bahamas": {
|
||||
"Noncommunicable diseases": "465.2",
|
||||
"Injuries": "45.7",
|
||||
"Communicable & other Group I": "122.0"
|
||||
},
|
||||
"Guyana": {
|
||||
"Communicable & other Group I": "177.2",
|
||||
"Noncommunicable diseases": "1024.2",
|
||||
"Injuries": "150.0"
|
||||
},
|
||||
"United States of America": {
|
||||
"Noncommunicable diseases": "412.8",
|
||||
"Injuries": "44.2",
|
||||
"Communicable & other Group I": "31.3"
|
||||
},
|
||||
"Guatemala": {
|
||||
"Communicable & other Group I": "212.7",
|
||||
"Noncommunicable diseases": "409.4",
|
||||
"Injuries": "111.0"
|
||||
}
|
||||
},
|
||||
"Eastern Mediterranean": {
|
||||
"Egypt": {
|
||||
"Communicable & other Group I": "74.3",
|
||||
"Noncommunicable diseases": "781.7",
|
||||
"Injuries": "33.5"
|
||||
},
|
||||
"South Sudan": {
|
||||
"Injuries": "143.4",
|
||||
"Communicable & other Group I": "831.3",
|
||||
"Noncommunicable diseases": "623.4"
|
||||
},
|
||||
"Sudan": {
|
||||
"Injuries": "133.6",
|
||||
"Noncommunicable diseases": "551.0",
|
||||
"Communicable & other Group I": "495.0"
|
||||
},
|
||||
"Libya": {
|
||||
"Injuries": "62.8",
|
||||
"Noncommunicable diseases": "550.0",
|
||||
"Communicable & other Group I": "52.6"
|
||||
},
|
||||
"Jordan": {
|
||||
"Noncommunicable diseases": "640.3",
|
||||
"Injuries": "53.5",
|
||||
"Communicable & other Group I": "52.5"
|
||||
},
|
||||
"Pakistan": {
|
||||
"Communicable & other Group I": "296.0",
|
||||
"Noncommunicable diseases": "669.3",
|
||||
"Injuries": "98.7"
|
||||
},
|
||||
"Djibouti": {
|
||||
"Noncommunicable diseases": "631.1",
|
||||
"Communicable & other Group I": "626.0",
|
||||
"Injuries": "106.0"
|
||||
},
|
||||
"Syrian Arab Republic": {
|
||||
"Communicable & other Group I": "41.0",
|
||||
"Injuries": "308.0",
|
||||
"Noncommunicable diseases": "572.7"
|
||||
},
|
||||
"Morocco": {
|
||||
"Noncommunicable diseases": "707.7",
|
||||
"Communicable & other Group I": "131.5",
|
||||
"Injuries": "47.0"
|
||||
},
|
||||
"Yemen": {
|
||||
"Communicable & other Group I": "515.0",
|
||||
"Noncommunicable diseases": "626.9",
|
||||
"Injuries": "84.3"
|
||||
},
|
||||
"Bahrain": {
|
||||
"Injuries": "33.5",
|
||||
"Noncommunicable diseases": "505.7",
|
||||
"Communicable & other Group I": "48.5"
|
||||
},
|
||||
"United Arab Emirates": {
|
||||
"Noncommunicable diseases": "546.8",
|
||||
"Injuries": "31.5",
|
||||
"Communicable & other Group I": "35.6"
|
||||
},
|
||||
"Lebanon": {
|
||||
"Noncommunicable diseases": "384.6",
|
||||
"Injuries": "40.6",
|
||||
"Communicable & other Group I": "30.5"
|
||||
},
|
||||
"Saudi Arabia": {
|
||||
"Noncommunicable diseases": "549.4",
|
||||
"Injuries": "41.1",
|
||||
"Communicable & other Group I": "71.3"
|
||||
},
|
||||
"Iran (Islamic Republic of)": {
|
||||
"Injuries": "74.9",
|
||||
"Communicable & other Group I": "56.2",
|
||||
"Noncommunicable diseases": "569.3"
|
||||
},
|
||||
"Iraq": {
|
||||
"Communicable & other Group I": "87.0",
|
||||
"Noncommunicable diseases": "715.5",
|
||||
"Injuries": "128.5"
|
||||
},
|
||||
"Qatar": {
|
||||
"Communicable & other Group I": "28.3",
|
||||
"Injuries": "41.0",
|
||||
"Noncommunicable diseases": "407.0"
|
||||
},
|
||||
"Afghanistan": {
|
||||
"Communicable & other Group I": "362.7",
|
||||
"Injuries": "169.2",
|
||||
"Noncommunicable diseases": "846.3"
|
||||
},
|
||||
"Somalia": {
|
||||
"Noncommunicable diseases": "550.7",
|
||||
"Communicable & other Group I": "927.2",
|
||||
"Injuries": "188.5"
|
||||
},
|
||||
"Kuwait": {
|
||||
"Communicable & other Group I": "82.5",
|
||||
"Injuries": "25.4",
|
||||
"Noncommunicable diseases": "406.3"
|
||||
},
|
||||
"Oman": {
|
||||
"Injuries": "52.8",
|
||||
"Noncommunicable diseases": "478.2",
|
||||
"Communicable & other Group I": "84.2"
|
||||
},
|
||||
"Tunisia": {
|
||||
"Noncommunicable diseases": "509.3",
|
||||
"Communicable & other Group I": "65.0",
|
||||
"Injuries": "39.1"
|
||||
}
|
||||
},
|
||||
"Western Pacific": {
|
||||
"Mongolia": {
|
||||
"Injuries": "69.4",
|
||||
"Noncommunicable diseases": "966.5",
|
||||
"Communicable & other Group I": "82.8"
|
||||
},
|
||||
"Cambodia": {
|
||||
"Injuries": "62.2",
|
||||
"Communicable & other Group I": "227.5",
|
||||
"Noncommunicable diseases": "394.0"
|
||||
},
|
||||
"Japan": {
|
||||
"Injuries": "40.5",
|
||||
"Noncommunicable diseases": "244.2",
|
||||
"Communicable & other Group I": "33.9"
|
||||
},
|
||||
"Brunei Darussalam": {
|
||||
"Injuries": "44.6",
|
||||
"Noncommunicable diseases": "475.3",
|
||||
"Communicable & other Group I": "56.1"
|
||||
},
|
||||
"Solomon Islands": {
|
||||
"Communicable & other Group I": "230.6",
|
||||
"Injuries": "75.1",
|
||||
"Noncommunicable diseases": "709.7"
|
||||
},
|
||||
"Viet Nam": {
|
||||
"Communicable & other Group I": "96.0",
|
||||
"Injuries": "59.0",
|
||||
"Noncommunicable diseases": "435.4"
|
||||
},
|
||||
"Lao People's Democratic Republic": {
|
||||
"Communicable & other Group I": "328.7",
|
||||
"Injuries": "75.2",
|
||||
"Noncommunicable diseases": "680.0"
|
||||
},
|
||||
"China": {
|
||||
"Communicable & other Group I": "41.4",
|
||||
"Noncommunicable diseases": "576.3",
|
||||
"Injuries": "50.4"
|
||||
},
|
||||
"New Zealand": {
|
||||
"Injuries": "32.9",
|
||||
"Noncommunicable diseases": "313.6",
|
||||
"Communicable & other Group I": "18.0"
|
||||
},
|
||||
"Papua New Guinea": {
|
||||
"Injuries": "100.1",
|
||||
"Communicable & other Group I": "554.3",
|
||||
"Noncommunicable diseases": "693.2"
|
||||
},
|
||||
"Philippines": {
|
||||
"Communicable & other Group I": "226.4",
|
||||
"Noncommunicable diseases": "720.0",
|
||||
"Injuries": "53.8"
|
||||
},
|
||||
"Malaysia": {
|
||||
"Injuries": "62.8",
|
||||
"Noncommunicable diseases": "563.2",
|
||||
"Communicable & other Group I": "117.4"
|
||||
},
|
||||
"Australia": {
|
||||
"Communicable & other Group I": "13.7",
|
||||
"Noncommunicable diseases": "302.9",
|
||||
"Injuries": "28.2"
|
||||
},
|
||||
"Fiji": {
|
||||
"Noncommunicable diseases": "804.0",
|
||||
"Injuries": "64.0",
|
||||
"Communicable & other Group I": "105.2"
|
||||
},
|
||||
"Singapore": {
|
||||
"Communicable & other Group I": "66.2",
|
||||
"Noncommunicable diseases": "264.8",
|
||||
"Injuries": "17.5"
|
||||
},
|
||||
"Republic of Korea": {
|
||||
"Injuries": "53.1",
|
||||
"Communicable & other Group I": "33.8",
|
||||
"Noncommunicable diseases": "302.1"
|
||||
}
|
||||
}
|
||||
},
|
||||
points = [],
|
||||
region_p,
|
||||
region_val,
|
||||
region_i,
|
||||
country_p,
|
||||
country_i,
|
||||
cause_p,
|
||||
cause_i,
|
||||
cause_name = [],
|
||||
region,
|
||||
country,
|
||||
cause;
|
||||
cause_name['Communicable & other Group I'] = 'Communicable diseases';
|
||||
cause_name['Noncommunicable diseases'] = 'Non-communicable diseases';
|
||||
cause_name.Injuries = 'Injuries';
|
||||
region_i = 0;
|
||||
for (region in data) {
|
||||
if (data.hasOwnProperty(region)) {
|
||||
region_val = 0;
|
||||
region_p = {
|
||||
id: "id_" + region_i,
|
||||
name: region,
|
||||
color: Highcharts.getOptions().colors[region_i]
|
||||
};
|
||||
country_i = 0;
|
||||
for (country in data[region]) {
|
||||
if (data[region].hasOwnProperty(country)) {
|
||||
country_p = {
|
||||
id: region_p.id + "_" + country_i,
|
||||
name: country,
|
||||
parent: region_p.id
|
||||
};
|
||||
points.push(country_p);
|
||||
cause_i = 0;
|
||||
for (cause in data[region][country]) {
|
||||
if (data[region][country].hasOwnProperty(cause)) {
|
||||
cause_p = {
|
||||
id: country_p.id + "_" + cause_i,
|
||||
name: cause_name[cause],
|
||||
parent: country_p.id,
|
||||
value: Math.round(+data[region][country][cause])
|
||||
};
|
||||
region_val += cause_p.value;
|
||||
points.push(cause_p);
|
||||
cause_i = cause_i + 1;
|
||||
}
|
||||
}
|
||||
country_i = country_i + 1;
|
||||
}
|
||||
}
|
||||
region_p.value = Math.round(region_val / country_i);
|
||||
points.push(region_p);
|
||||
region_i = region_i + 1;
|
||||
}
|
||||
}
|
||||
$('#container').highcharts({
|
||||
series: [{
|
||||
type: "treemap",
|
||||
layoutAlgorithm: 'squarified',
|
||||
allowDrillToNode: true,
|
||||
dataLabels: {
|
||||
enabled: false
|
||||
},
|
||||
levelIsConstant: false,
|
||||
levels: [{
|
||||
level: 1,
|
||||
dataLabels: {
|
||||
enabled: true
|
||||
},
|
||||
borderWidth: 3
|
||||
}],
|
||||
data: points
|
||||
}],
|
||||
subtitle: {
|
||||
text: 'Click points to drill down. Source: <a href="http://apps.who.int/gho/data/node.main.12?lang=en">WHO</a>.'
|
||||
},
|
||||
title: {
|
||||
text: 'Global Mortality Rate 2012, per 100 000 population'
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/heatmap.js"></script>
|
||||
<script src="../../js/modules/treemap.js"></script>
|
||||
<div id="container"></div>
|
||||
</body>
|
||||
</html>
|
||||
102
lib/highcharts/examples/treemap-with-levels/index.htm
Normal file
102
lib/highcharts/examples/treemap-with-levels/index.htm
Normal file
@ -0,0 +1,102 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
#container {
|
||||
min-width: 300px;
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
series: [{
|
||||
type: "treemap",
|
||||
layoutAlgorithm: 'stripes',
|
||||
alternateStartingDirection: true,
|
||||
levels: [{
|
||||
level: 1,
|
||||
layoutAlgorithm: 'sliceAndDice',
|
||||
dataLabels: {
|
||||
enabled: true,
|
||||
align: 'left',
|
||||
verticalAlign: 'top',
|
||||
style: {
|
||||
fontSize: '15px',
|
||||
fontWeight: 'bold'
|
||||
}
|
||||
}
|
||||
}],
|
||||
data: [{
|
||||
id: 'A',
|
||||
name: 'Apples',
|
||||
color: "#EC2500"
|
||||
}, {
|
||||
id: 'B',
|
||||
name: 'Bananas',
|
||||
color: "#ECE100"
|
||||
}, {
|
||||
id: 'O',
|
||||
name: 'Oranges',
|
||||
color: '#EC9800'
|
||||
}, {
|
||||
name: 'Anne',
|
||||
parent: 'A',
|
||||
value: 5
|
||||
}, {
|
||||
name: 'Rick',
|
||||
parent: 'A',
|
||||
value: 3
|
||||
}, {
|
||||
name: 'Peter',
|
||||
parent: 'A',
|
||||
value: 4
|
||||
}, {
|
||||
name: 'Anne',
|
||||
parent: 'B',
|
||||
value: 4
|
||||
}, {
|
||||
name: 'Rick',
|
||||
parent: 'B',
|
||||
value: 10
|
||||
}, {
|
||||
name: 'Peter',
|
||||
parent: 'B',
|
||||
value: 1
|
||||
}, {
|
||||
name: 'Anne',
|
||||
parent: 'O',
|
||||
value: 1
|
||||
}, {
|
||||
name: 'Rick',
|
||||
parent: 'O',
|
||||
value: 3
|
||||
}, {
|
||||
name: 'Peter',
|
||||
parent: 'O',
|
||||
value: 3
|
||||
}, {
|
||||
name: 'Susanne',
|
||||
parent: 'Kiwi',
|
||||
value: 2,
|
||||
color: '#9EDE00'
|
||||
}]
|
||||
}],
|
||||
title: {
|
||||
text: 'Fruit consumption'
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/modules/treemap.js"></script>
|
||||
<div id="container"></div>
|
||||
</body>
|
||||
</html>
|
||||
93
lib/highcharts/examples/waterfall/index.htm
Normal file
93
lib/highcharts/examples/waterfall/index.htm
Normal file
@ -0,0 +1,93 @@
|
||||
<!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://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
|
||||
<style type="text/css">
|
||||
${demo.css}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$('#container').highcharts({
|
||||
chart: {
|
||||
type: 'waterfall'
|
||||
},
|
||||
|
||||
title: {
|
||||
text: 'Highcharts Waterfall'
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
type: 'category'
|
||||
},
|
||||
|
||||
yAxis: {
|
||||
title: {
|
||||
text: 'USD'
|
||||
}
|
||||
},
|
||||
|
||||
legend: {
|
||||
enabled: false
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
pointFormat: '<b>${point.y:,.2f}</b> USD'
|
||||
},
|
||||
|
||||
series: [{
|
||||
upColor: Highcharts.getOptions().colors[2],
|
||||
color: Highcharts.getOptions().colors[3],
|
||||
data: [{
|
||||
name: 'Start',
|
||||
y: 120000
|
||||
}, {
|
||||
name: 'Product Revenue',
|
||||
y: 569000
|
||||
}, {
|
||||
name: 'Service Revenue',
|
||||
y: 231000
|
||||
}, {
|
||||
name: 'Positive Balance',
|
||||
isIntermediateSum: true,
|
||||
color: Highcharts.getOptions().colors[1]
|
||||
}, {
|
||||
name: 'Fixed Costs',
|
||||
y: -342000
|
||||
}, {
|
||||
name: 'Variable Costs',
|
||||
y: -233000
|
||||
}, {
|
||||
name: 'Balance',
|
||||
isSum: true,
|
||||
color: Highcharts.getOptions().colors[1]
|
||||
}],
|
||||
dataLabels: {
|
||||
enabled: true,
|
||||
formatter: function () {
|
||||
return Highcharts.numberFormat(this.y / 1000, 0, ',') + 'k';
|
||||
},
|
||||
style: {
|
||||
color: '#FFFFFF',
|
||||
fontWeight: 'bold',
|
||||
textShadow: '0px 0px 3px black'
|
||||
}
|
||||
},
|
||||
pointPadding: 0
|
||||
}]
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../js/highcharts.js"></script>
|
||||
<script src="../../js/highcharts-more.js"></script>
|
||||
<script src="../../js/modules/exporting.js"></script>
|
||||
|
||||
<div id="container" style="min-width: 310px; max-width: 600px; height: 400px; margin: 0 auto"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
BIN
lib/highcharts/gfx/vml-radial-gradient.png
Normal file
BIN
lib/highcharts/gfx/vml-radial-gradient.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
BIN
lib/highcharts/graphics/meteogram-symbols-30px.png
Normal file
BIN
lib/highcharts/graphics/meteogram-symbols-30px.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 39 KiB |
BIN
lib/highcharts/graphics/skies.jpg
Normal file
BIN
lib/highcharts/graphics/skies.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 42 KiB |
BIN
lib/highcharts/graphics/snow.png
Normal file
BIN
lib/highcharts/graphics/snow.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.6 KiB |
BIN
lib/highcharts/graphics/sun.png
Normal file
BIN
lib/highcharts/graphics/sun.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.8 KiB |
121
lib/highcharts/index.htm
Normal file
121
lib/highcharts/index.htm
Normal file
@ -0,0 +1,121 @@
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<title>Highcharts Examples</title>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Highcharts Examples</h1>
|
||||
<h4>Line charts</h4>
|
||||
<ul>
|
||||
<li><a href="examples/line-basic/index.htm">Basic line</a></li>
|
||||
<li><a href="examples/line-ajax/index.htm">Ajax loaded data, clickable points</a></li>
|
||||
<li><a href="examples/line-labels/index.htm">With data labels</a></li>
|
||||
<li><a href="examples/line-time-series/index.htm">Time series, zoomable</a></li>
|
||||
<li><a href="examples/spline-inverted/index.htm">Spline with inverted axes</a></li>
|
||||
<li><a href="examples/spline-symbols/index.htm">Spline with symbols</a></li>
|
||||
<li><a href="examples/spline-plot-bands/index.htm">Spline with plot bands</a></li>
|
||||
<li><a href="examples/spline-irregular-time/index.htm">Time data with irregular intervals</a></li>
|
||||
<li><a href="examples/line-log-axis/index.htm">Logarithmic axis</a></li>
|
||||
</ul>
|
||||
<h4>Area charts</h4>
|
||||
<ul>
|
||||
<li><a href="examples/area-basic/index.htm">Basic area</a></li>
|
||||
<li><a href="examples/area-negative/index.htm">Area with negative values</a></li>
|
||||
<li><a href="examples/area-stacked/index.htm">Stacked area</a></li>
|
||||
<li><a href="examples/area-stacked-percent/index.htm">Percentage area</a></li>
|
||||
<li><a href="examples/area-missing/index.htm">Area with missing points</a></li>
|
||||
<li><a href="examples/area-inverted/index.htm">Inverted axes</a></li>
|
||||
<li><a href="examples/areaspline/index.htm">Area-spline</a></li>
|
||||
<li><a href="examples/arearange/index.htm">Area range</a></li>
|
||||
<li><a href="examples/arearange-line/index.htm">Area range and line</a></li>
|
||||
<li><a href="examples/sparkline/index.htm">Sparkline charts</a></li>
|
||||
</ul>
|
||||
<h4>Column and bar charts</h4>
|
||||
<ul>
|
||||
<li><a href="examples/bar-basic/index.htm">Basic bar</a></li>
|
||||
<li><a href="examples/bar-stacked/index.htm">Stacked bar</a></li>
|
||||
<li><a href="examples/bar-negative-stack/index.htm">Bar with negative stack</a></li>
|
||||
<li><a href="examples/column-basic/index.htm">Basic column</a></li>
|
||||
<li><a href="examples/column-negative/index.htm">Column with negative values</a></li>
|
||||
<li><a href="examples/column-stacked/index.htm">Stacked column</a></li>
|
||||
<li><a href="examples/column-stacked-and-grouped/index.htm">Stacked and grouped column</a></li>
|
||||
<li><a href="examples/column-stacked-percent/index.htm">Stacked percentage column</a></li>
|
||||
<li><a href="examples/column-rotated-labels/index.htm">Column with rotated labels</a></li>
|
||||
<li><a href="examples/column-drilldown/index.htm">Column with drilldown</a></li>
|
||||
<li><a href="examples/column-placement/index.htm">Fixed placement columns</a></li>
|
||||
<li><a href="examples/column-parsed/index.htm">Data defined in a HTML table</a></li>
|
||||
<li><a href="examples/columnrange/index.htm">Column range</a></li>
|
||||
</ul>
|
||||
<h4>Pie charts</h4>
|
||||
<ul>
|
||||
<li><a href="examples/pie-basic/index.htm">Pie chart</a></li>
|
||||
<li><a href="examples/pie-legend/index.htm">Pie with legend</a></li>
|
||||
<li><a href="examples/pie-donut/index.htm">Donut chart</a></li>
|
||||
<li><a href="examples/pie-semi-circle/index.htm">Semi circle donut</a></li>
|
||||
<li><a href="examples/pie-drilldown/index.htm">Pie with drilldown</a></li>
|
||||
<li><a href="examples/pie-gradient/index.htm">Pie with gradient fill</a></li>
|
||||
<li><a href="examples/pie-monochrome/index.htm">Pie with monochrome fill</a></li>
|
||||
</ul>
|
||||
<h4>Scatter and bubble charts</h4>
|
||||
<ul>
|
||||
<li><a href="examples/scatter/index.htm">Scatter plot</a></li>
|
||||
<li><a href="examples/bubble/index.htm">Bubble chart</a></li>
|
||||
<li><a href="examples/bubble-3d/index.htm">3D bubbles</a></li>
|
||||
</ul>
|
||||
<h4>Combinations</h4>
|
||||
<ul>
|
||||
<li><a href="examples/synchronized-charts/index.htm">Synchronized charts</a></li>
|
||||
<li><a href="examples/combo/index.htm">Column, line and pie</a></li>
|
||||
<li><a href="examples/combo-dual-axes/index.htm">Dual axes, line and column</a></li>
|
||||
<li><a href="examples/combo-multi-axes/index.htm">Multiple axes</a></li>
|
||||
<li><a href="examples/combo-regression/index.htm">Scatter with regression line</a></li>
|
||||
<li><a href="examples/combo-meteogram/index.htm">Meteogram</a></li>
|
||||
<li><a href="examples/combo-timeline/index.htm">Advanced timeline</a></li>
|
||||
</ul>
|
||||
<h4>Dynamic charts</h4>
|
||||
<ul>
|
||||
<li><a href="examples/dynamic-update/index.htm">Spline updating each second</a></li>
|
||||
<li><a href="examples/dynamic-click-to-add/index.htm">Click to add a point</a></li>
|
||||
<li><a href="examples/dynamic-master-detail/index.htm">Master-detail chart</a></li>
|
||||
</ul>
|
||||
<h4>3D charts</h4>
|
||||
<ul>
|
||||
<li><a href="examples/3d-column-interactive/index.htm">3D column</a></li>
|
||||
<li><a href="examples/3d-column-null-values/index.htm">3D column with null and 0 values</a></li>
|
||||
<li><a href="examples/3d-column-stacking-grouping/index.htm">3D column with stacking and grouping</a></li>
|
||||
<li><a href="examples/3d-pie/index.htm">3D pie</a></li>
|
||||
<li><a href="examples/3d-pie-donut/index.htm">3D donut</a></li>
|
||||
<li><a href="examples/3d-scatter-draggable/index.htm">3D scatter chart</a></li>
|
||||
</ul>
|
||||
<h4>Gauges</h4>
|
||||
<ul>
|
||||
<li><a href="examples/gauge-speedometer/index.htm">Angular gauge</a></li>
|
||||
<li><a href="examples/gauge-solid/index.htm">Solid gauge</a></li>
|
||||
<li><a href="examples/gauge-clock/index.htm">Clock</a></li>
|
||||
<li><a href="examples/gauge-dual/index.htm">Gauge with dual axes</a></li>
|
||||
<li><a href="examples/gauge-vu-meter/index.htm">VU meter</a></li>
|
||||
</ul>
|
||||
<h4>Heat and tree maps</h4>
|
||||
<ul>
|
||||
<li><a href="examples/heatmap/index.htm">Heat map</a></li>
|
||||
<li><a href="examples/heatmap-canvas/index.htm">Large heat map</a></li>
|
||||
<li><a href="examples/treemap-coloraxis/index.htm">Tree map with color axis</a></li>
|
||||
<li><a href="examples/treemap-with-levels/index.htm">Tree map with levels</a></li>
|
||||
<li><a href="examples/treemap-large-dataset/index.htm">Large tree map</a></li>
|
||||
</ul>
|
||||
<h4>More chart types</h4>
|
||||
<ul>
|
||||
<li><a href="examples/polar/index.htm">Polar chart</a></li>
|
||||
<li><a href="examples/polar-spider/index.htm">Spiderweb</a></li>
|
||||
<li><a href="examples/polar-wind-rose/index.htm">Wind rose</a></li>
|
||||
<li><a href="examples/box-plot/index.htm">Box plot</a></li>
|
||||
<li><a href="examples/error-bar/index.htm">Error bar</a></li>
|
||||
<li><a href="examples/waterfall/index.htm">Waterfall</a></li>
|
||||
<li><a href="examples/funnel/index.htm">Funnel chart</a></li>
|
||||
<li><a href="examples/pyramid/index.htm">Pyramid chart</a></li>
|
||||
<li><a href="examples/polygon/index.htm">Polygon series</a></li>
|
||||
<li><a href="examples/renderer/index.htm">General drawing</a></li>
|
||||
</ul>
|
||||
</body>
|
||||
</html>
|
||||
18
lib/highcharts/js/adapters/standalone-framework.js
Normal file
18
lib/highcharts/js/adapters/standalone-framework.js
Normal file
@ -0,0 +1,18 @@
|
||||
/*
|
||||
Highcharts JS v4.1.9 (2015-10-07)
|
||||
|
||||
Standalone Highcharts Framework
|
||||
|
||||
License: MIT License
|
||||
*/
|
||||
var HighchartsAdapter=function(){function o(c){function a(a,b,d){a.removeEventListener(b,d,!1)}function d(a,b,d){d=a.HCProxiedMethods[d.toString()];a.detachEvent("on"+b,d)}function b(b,c){var f=b.HCEvents,k,h,l,g;if(b.removeEventListener)k=a;else if(b.attachEvent)k=d;else return;c?(h={},h[c]=!0):h=f;for(g in h)if(f[g])for(l=f[g].length;l--;)k(b,g,f[g][l])}c.HCExtended||Highcharts.extend(c,{HCExtended:!0,HCEvents:{},bind:function(a,b){var d=this,c=this.HCEvents,h;if(d.addEventListener)d.addEventListener(a,
|
||||
b,!1);else if(d.attachEvent){h=function(a){a.target=a.srcElement||window;b.call(d,a)};if(!d.HCProxiedMethods)d.HCProxiedMethods={};d.HCProxiedMethods[b.toString()]=h;d.attachEvent("on"+a,h)}c[a]===q&&(c[a]=[]);c[a].push(b)},unbind:function(c,i){var f,k;c?(f=this.HCEvents[c]||[],i?(k=HighchartsAdapter.inArray(i,f),k>-1&&(f.splice(k,1),this.HCEvents[c]=f),this.removeEventListener?a(this,c,i):this.attachEvent&&d(this,c,i)):(b(this,c),this.HCEvents[c]=[])):(b(this),this.HCEvents={})},trigger:function(a,
|
||||
b){var d=this.HCEvents[a]||[],c=d.length,h,g,j;g=function(){b.defaultPrevented=!0};for(h=0;h<c;h++){j=d[h];if(b.stopped)break;b.preventDefault=g;b.target=this;if(!b.type)b.type=a;j.call(this,b)===!1&&b.preventDefault()}}});return c}var q,j=document,p=[],g=[],m={},n;Math.easeInOutSine=function(c,a,d,b){return-d/2*(Math.cos(Math.PI*c/b)-1)+a};return{init:function(c){if(!j.defaultView)this._getStyle=function(a,d){var b;return a.style[d]?a.style[d]:(d==="opacity"&&(d="filter"),b=a.currentStyle[d.replace(/\-(\w)/g,
|
||||
function(a,b){return b.toUpperCase()})],d==="filter"&&(b=b.replace(/alpha\(opacity=([0-9]+)\)/,function(a,b){return b/100})),b===""?1:b)},this.adapterRun=function(a,d){var b={width:"clientWidth",height:"clientHeight"}[d];if(b)return a.style.zoom=1,a[b]-2*parseInt(HighchartsAdapter._getStyle(a,"padding"),10)};if(!Array.prototype.forEach)this.each=function(a,d){for(var b=0,c=a.length;b<c;b++)if(d.call(a[b],a[b],b,a)===!1)return b};if(!Array.prototype.indexOf)this.inArray=function(a,d){var b,c=0;if(d)for(b=
|
||||
d.length;c<b;c++)if(d[c]===a)return c;return-1};if(!Array.prototype.filter)this.grep=function(a,d){for(var b=[],c=0,i=a.length;c<i;c++)d(a[c],c)&&b.push(a[c]);return b};n=function(a,c,b){this.options=c;this.elem=a;this.prop=b};n.prototype={update:function(){var a;a=this.paths;var d=this.elem,b=d.element;if(m[this.prop])m[this.prop](this);else a&&b?d.attr("d",c.step(a[0],a[1],this.now,this.toD)):d.attr?b&&d.attr(this.prop,this.now):(a={},a[this.prop]=this.now+this.unit,Highcharts.css(d,a));this.options.step&&
|
||||
this.options.step.call(this.elem,this.now,this)},custom:function(a,c,b){var e=this,i=function(a){return e.step(a)},f;this.startTime=+new Date;this.start=a;this.end=c;this.unit=b;this.now=this.start;this.pos=this.state=0;i.elem=this.elem;if(i()&&g.push(i)===1)i.timerId=setInterval(function(){for(f=0;f<g.length;f++)g[f]()||g.splice(f--,1);g.length||clearInterval(i.timerId)},13)},step:function(a){var c=+new Date,b;b=this.options;var e=this.elem,i;if(e.attr&&!e.element)b=!1;else if(a||c>=b.duration+this.startTime){this.now=
|
||||
this.end;this.pos=this.state=1;this.update();a=this.options.curAnim[this.prop]=!0;for(i in b.curAnim)b.curAnim[i]!==!0&&(a=!1);a&&b.complete&&b.complete.call(e);b=!1}else e=c-this.startTime,this.state=e/b.duration,this.pos=b.easing(e,0,1,b.duration),this.now=this.start+(this.end-this.start)*this.pos,this.update(),b=!0;return b}};this.animate=function(a,d,b){var e,i="",f,g,h;if(typeof b!=="object"||b===null)e=arguments,b={duration:e[2],easing:e[3],complete:e[4]};if(typeof b.duration!=="number")b.duration=
|
||||
400;b.easing=Math[b.easing]||Math.easeInOutSine;b.curAnim=Highcharts.extend({},d);for(h in d)g=new n(a,b,h),f=null,h==="d"?(g.paths=c.init(a,a.d,d.d),g.toD=d.d,e=0,f=1):a.attr?e=a.attr(h):(e=parseFloat(HighchartsAdapter._getStyle(a,h))||0,h!=="opacity"&&(i="px")),f||(f=d[h]),f.match&&f.match("px")&&(f=f.replace(/px/g,"")),g.custom(e,f,i)}},_getStyle:function(c,a){return window.getComputedStyle(c,void 0).getPropertyValue(a)},addAnimSetter:function(c,a){m[c]=a},getScript:function(c,a){var d=j.getElementsByTagName("head")[0],
|
||||
b=j.createElement("script");b.type="text/javascript";b.src=c;b.onload=a;d.appendChild(b)},inArray:function(c,a){return a.indexOf?a.indexOf(c):p.indexOf.call(a,c)},adapterRun:function(c,a){return parseInt(HighchartsAdapter._getStyle(c,a),10)},grep:function(c,a){return p.filter.call(c,a)},map:function(c,a){for(var d=[],b=0,e=c.length;b<e;b++)d[b]=a.call(c[b],c[b],b,c);return d},offset:function(c){var a=document.documentElement,c=c.getBoundingClientRect();return{top:c.top+(window.pageYOffset||a.scrollTop)-
|
||||
(a.clientTop||0),left:c.left+(window.pageXOffset||a.scrollLeft)-(a.clientLeft||0)}},addEvent:function(c,a,d){o(c).bind(a,d)},removeEvent:function(c,a,d){o(c).unbind(a,d)},fireEvent:function(c,a,d,b){var e;j.createEvent&&(c.dispatchEvent||c.fireEvent)?(e=j.createEvent("Events"),e.initEvent(a,!0,!0),e.target=c,Highcharts.extend(e,d),c.dispatchEvent?c.dispatchEvent(e):c.fireEvent(a,e)):c.HCExtended===!0&&(d=d||{},c.trigger(a,d));d&&d.defaultPrevented&&(b=null);b&&b(d)},washMouseEvent:function(c){return c},
|
||||
stop:function(c){for(var a=g.length,d;a--;)d=g[a],d.elem===c&&g.splice(a,1)},each:function(c,a){return Array.prototype.forEach.call(c,a)}}}();
|
||||
614
lib/highcharts/js/adapters/standalone-framework.src.js
Normal file
614
lib/highcharts/js/adapters/standalone-framework.src.js
Normal file
@ -0,0 +1,614 @@
|
||||
/**
|
||||
* @license Highcharts JS v4.1.9 (2015-10-07)
|
||||
*
|
||||
* Standalone Highcharts Framework
|
||||
*
|
||||
* License: MIT License
|
||||
*/
|
||||
|
||||
|
||||
/*global Highcharts */
|
||||
var HighchartsAdapter = (function () {
|
||||
|
||||
var UNDEFINED,
|
||||
doc = document,
|
||||
emptyArray = [],
|
||||
timers = [],
|
||||
animSetters = {},
|
||||
Fx;
|
||||
|
||||
Math.easeInOutSine = function (t, b, c, d) {
|
||||
return -c / 2 * (Math.cos(Math.PI * t / d) - 1) + b;
|
||||
};
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Extend given object with custom events
|
||||
*/
|
||||
function augment(obj) {
|
||||
function removeOneEvent(el, type, fn) {
|
||||
el.removeEventListener(type, fn, false);
|
||||
}
|
||||
|
||||
function IERemoveOneEvent(el, type, fn) {
|
||||
fn = el.HCProxiedMethods[fn.toString()];
|
||||
el.detachEvent('on' + type, fn);
|
||||
}
|
||||
|
||||
function removeAllEvents(el, type) {
|
||||
var events = el.HCEvents,
|
||||
remove,
|
||||
types,
|
||||
len,
|
||||
n;
|
||||
|
||||
if (el.removeEventListener) {
|
||||
remove = removeOneEvent;
|
||||
} else if (el.attachEvent) {
|
||||
remove = IERemoveOneEvent;
|
||||
} else {
|
||||
return; // break on non-DOM events
|
||||
}
|
||||
|
||||
|
||||
if (type) {
|
||||
types = {};
|
||||
types[type] = true;
|
||||
} else {
|
||||
types = events;
|
||||
}
|
||||
|
||||
for (n in types) {
|
||||
if (events[n]) {
|
||||
len = events[n].length;
|
||||
while (len--) {
|
||||
remove(el, n, events[n][len]);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (!obj.HCExtended) {
|
||||
Highcharts.extend(obj, {
|
||||
HCExtended: true,
|
||||
|
||||
HCEvents: {},
|
||||
|
||||
bind: function (name, fn) {
|
||||
var el = this,
|
||||
events = this.HCEvents,
|
||||
wrappedFn;
|
||||
|
||||
// handle DOM events in modern browsers
|
||||
if (el.addEventListener) {
|
||||
el.addEventListener(name, fn, false);
|
||||
|
||||
// handle old IE implementation
|
||||
} else if (el.attachEvent) {
|
||||
|
||||
wrappedFn = function (e) {
|
||||
e.target = e.srcElement || window; // #2820
|
||||
fn.call(el, e);
|
||||
};
|
||||
|
||||
if (!el.HCProxiedMethods) {
|
||||
el.HCProxiedMethods = {};
|
||||
}
|
||||
|
||||
// link wrapped fn with original fn, so we can get this in removeEvent
|
||||
el.HCProxiedMethods[fn.toString()] = wrappedFn;
|
||||
|
||||
el.attachEvent('on' + name, wrappedFn);
|
||||
}
|
||||
|
||||
|
||||
if (events[name] === UNDEFINED) {
|
||||
events[name] = [];
|
||||
}
|
||||
|
||||
events[name].push(fn);
|
||||
},
|
||||
|
||||
unbind: function (name, fn) {
|
||||
var events,
|
||||
index;
|
||||
|
||||
if (name) {
|
||||
events = this.HCEvents[name] || [];
|
||||
if (fn) {
|
||||
index = HighchartsAdapter.inArray(fn, events);
|
||||
if (index > -1) {
|
||||
events.splice(index, 1);
|
||||
this.HCEvents[name] = events;
|
||||
}
|
||||
if (this.removeEventListener) {
|
||||
removeOneEvent(this, name, fn);
|
||||
} else if (this.attachEvent) {
|
||||
IERemoveOneEvent(this, name, fn);
|
||||
}
|
||||
} else {
|
||||
removeAllEvents(this, name);
|
||||
this.HCEvents[name] = [];
|
||||
}
|
||||
} else {
|
||||
removeAllEvents(this);
|
||||
this.HCEvents = {};
|
||||
}
|
||||
},
|
||||
|
||||
trigger: function (name, args) {
|
||||
var events = this.HCEvents[name] || [],
|
||||
target = this,
|
||||
len = events.length,
|
||||
i,
|
||||
preventDefault,
|
||||
fn;
|
||||
|
||||
// Attach a simple preventDefault function to skip default handler if called
|
||||
preventDefault = function () {
|
||||
args.defaultPrevented = true;
|
||||
};
|
||||
|
||||
for (i = 0; i < len; i++) {
|
||||
fn = events[i];
|
||||
|
||||
// args is never null here
|
||||
if (args.stopped) {
|
||||
return;
|
||||
}
|
||||
|
||||
args.preventDefault = preventDefault;
|
||||
args.target = target;
|
||||
|
||||
// If the type is not set, we're running a custom event (#2297). If it is set,
|
||||
// we're running a browser event, and setting it will cause en error in
|
||||
// IE8 (#2465).
|
||||
if (!args.type) {
|
||||
args.type = name;
|
||||
}
|
||||
|
||||
|
||||
|
||||
// If the event handler return false, prevent the default handler from executing
|
||||
if (fn.call(this, args) === false) {
|
||||
args.preventDefault();
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return obj;
|
||||
}
|
||||
|
||||
|
||||
return {
|
||||
|
||||
/**
|
||||
* Initialize the adapter. This is run once as Highcharts is first run.
|
||||
*/
|
||||
init: function (pathAnim) {
|
||||
|
||||
/**
|
||||
* Compatibility section to add support for legacy IE. This can be removed if old IE
|
||||
* support is not needed.
|
||||
*/
|
||||
if (!doc.defaultView) {
|
||||
this._getStyle = function (el, prop) {
|
||||
var val;
|
||||
if (el.style[prop]) {
|
||||
return el.style[prop];
|
||||
} else {
|
||||
if (prop === 'opacity') {
|
||||
prop = 'filter';
|
||||
}
|
||||
/*jslint unparam: true*/
|
||||
val = el.currentStyle[prop.replace(/\-(\w)/g, function (a, b) { return b.toUpperCase(); })];
|
||||
if (prop === 'filter') {
|
||||
val = val.replace(
|
||||
/alpha\(opacity=([0-9]+)\)/,
|
||||
function (a, b) {
|
||||
return b / 100;
|
||||
}
|
||||
);
|
||||
}
|
||||
/*jslint unparam: false*/
|
||||
return val === '' ? 1 : val;
|
||||
}
|
||||
};
|
||||
this.adapterRun = function (elem, method) {
|
||||
var alias = { width: 'clientWidth', height: 'clientHeight' }[method];
|
||||
|
||||
if (alias) {
|
||||
elem.style.zoom = 1;
|
||||
return elem[alias] - 2 * parseInt(HighchartsAdapter._getStyle(elem, 'padding'), 10);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
if (!Array.prototype.forEach) {
|
||||
this.each = function (arr, fn) { // legacy
|
||||
var i = 0,
|
||||
len = arr.length;
|
||||
for (; i < len; i++) {
|
||||
if (fn.call(arr[i], arr[i], i, arr) === false) {
|
||||
return i;
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
if (!Array.prototype.indexOf) {
|
||||
this.inArray = function (item, arr) {
|
||||
var len,
|
||||
i = 0;
|
||||
|
||||
if (arr) {
|
||||
len = arr.length;
|
||||
|
||||
for (; i < len; i++) {
|
||||
if (arr[i] === item) {
|
||||
return i;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return -1;
|
||||
};
|
||||
}
|
||||
|
||||
if (!Array.prototype.filter) {
|
||||
this.grep = function (elements, callback) {
|
||||
var ret = [],
|
||||
i = 0,
|
||||
length = elements.length;
|
||||
|
||||
for (; i < length; i++) {
|
||||
if (!!callback(elements[i], i)) {
|
||||
ret.push(elements[i]);
|
||||
}
|
||||
}
|
||||
|
||||
return ret;
|
||||
};
|
||||
}
|
||||
|
||||
//--- End compatibility section ---
|
||||
|
||||
|
||||
/**
|
||||
* Start of animation specific code
|
||||
*/
|
||||
Fx = function (elem, options, prop) {
|
||||
this.options = options;
|
||||
this.elem = elem;
|
||||
this.prop = prop;
|
||||
};
|
||||
Fx.prototype = {
|
||||
|
||||
update: function () {
|
||||
var styles,
|
||||
paths = this.paths,
|
||||
elem = this.elem,
|
||||
elemelem = elem.element; // if destroyed, it is null
|
||||
|
||||
// Animation setter defined from outside
|
||||
if (animSetters[this.prop]) {
|
||||
animSetters[this.prop](this);
|
||||
|
||||
// Animating a path definition on SVGElement
|
||||
} else if (paths && elemelem) {
|
||||
elem.attr('d', pathAnim.step(paths[0], paths[1], this.now, this.toD));
|
||||
|
||||
// Other animations on SVGElement
|
||||
} else if (elem.attr) {
|
||||
if (elemelem) {
|
||||
elem.attr(this.prop, this.now);
|
||||
}
|
||||
|
||||
// HTML styles
|
||||
} else {
|
||||
styles = {};
|
||||
styles[this.prop] = this.now + this.unit;
|
||||
Highcharts.css(elem, styles);
|
||||
}
|
||||
|
||||
if (this.options.step) {
|
||||
this.options.step.call(this.elem, this.now, this);
|
||||
}
|
||||
|
||||
},
|
||||
custom: function (from, to, unit) {
|
||||
var self = this,
|
||||
t = function (gotoEnd) {
|
||||
return self.step(gotoEnd);
|
||||
},
|
||||
i;
|
||||
|
||||
this.startTime = +new Date();
|
||||
this.start = from;
|
||||
this.end = to;
|
||||
this.unit = unit;
|
||||
this.now = this.start;
|
||||
this.pos = this.state = 0;
|
||||
|
||||
t.elem = this.elem;
|
||||
|
||||
if (t() && timers.push(t) === 1) {
|
||||
t.timerId = setInterval(function () {
|
||||
|
||||
for (i = 0; i < timers.length; i++) {
|
||||
if (!timers[i]()) {
|
||||
timers.splice(i--, 1);
|
||||
}
|
||||
}
|
||||
|
||||
if (!timers.length) {
|
||||
clearInterval(t.timerId);
|
||||
}
|
||||
}, 13);
|
||||
}
|
||||
},
|
||||
|
||||
step: function (gotoEnd) {
|
||||
var t = +new Date(),
|
||||
ret,
|
||||
done,
|
||||
options = this.options,
|
||||
elem = this.elem,
|
||||
i;
|
||||
|
||||
if (elem.attr && !elem.element) { // #2616, element including flag is destroyed
|
||||
ret = false;
|
||||
|
||||
} else if (gotoEnd || t >= options.duration + this.startTime) {
|
||||
this.now = this.end;
|
||||
this.pos = this.state = 1;
|
||||
this.update();
|
||||
|
||||
this.options.curAnim[this.prop] = true;
|
||||
|
||||
done = true;
|
||||
for (i in options.curAnim) {
|
||||
if (options.curAnim[i] !== true) {
|
||||
done = false;
|
||||
}
|
||||
}
|
||||
|
||||
if (done) {
|
||||
if (options.complete) {
|
||||
options.complete.call(elem);
|
||||
}
|
||||
}
|
||||
ret = false;
|
||||
|
||||
} else {
|
||||
var n = t - this.startTime;
|
||||
this.state = n / options.duration;
|
||||
this.pos = options.easing(n, 0, 1, options.duration);
|
||||
this.now = this.start + ((this.end - this.start) * this.pos);
|
||||
this.update();
|
||||
ret = true;
|
||||
}
|
||||
return ret;
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* The adapter animate method
|
||||
*/
|
||||
this.animate = function (el, prop, opt) {
|
||||
var start,
|
||||
unit = '',
|
||||
end,
|
||||
fx,
|
||||
args,
|
||||
name,
|
||||
PX = 'px';
|
||||
|
||||
if (typeof opt !== 'object' || opt === null) {
|
||||
args = arguments;
|
||||
opt = {
|
||||
duration: args[2],
|
||||
easing: args[3],
|
||||
complete: args[4]
|
||||
};
|
||||
}
|
||||
if (typeof opt.duration !== 'number') {
|
||||
opt.duration = 400;
|
||||
}
|
||||
opt.easing = Math[opt.easing] || Math.easeInOutSine;
|
||||
opt.curAnim = Highcharts.extend({}, prop);
|
||||
|
||||
for (name in prop) {
|
||||
fx = new Fx(el, opt, name);
|
||||
end = null;
|
||||
|
||||
if (name === 'd') {
|
||||
fx.paths = pathAnim.init(
|
||||
el,
|
||||
el.d,
|
||||
prop.d
|
||||
);
|
||||
fx.toD = prop.d;
|
||||
start = 0;
|
||||
end = 1;
|
||||
} else if (el.attr) {
|
||||
start = el.attr(name);
|
||||
} else {
|
||||
start = parseFloat(HighchartsAdapter._getStyle(el, name)) || 0;
|
||||
if (name !== 'opacity') {
|
||||
unit = PX;
|
||||
}
|
||||
}
|
||||
|
||||
if (!end) {
|
||||
end = prop[name];
|
||||
}
|
||||
if (end.match && end.match(PX)) {
|
||||
end = end.replace(/px/g, ''); // #4351
|
||||
}
|
||||
fx.custom(start, end, unit);
|
||||
}
|
||||
};
|
||||
},
|
||||
|
||||
/**
|
||||
* Internal method to return CSS value for given element and property
|
||||
*/
|
||||
_getStyle: function (el, prop) {
|
||||
return window.getComputedStyle(el, undefined).getPropertyValue(prop);
|
||||
},
|
||||
|
||||
/**
|
||||
* Add an animation setter for a specific property
|
||||
*/
|
||||
addAnimSetter: function (prop, fn) {
|
||||
animSetters[prop] = fn;
|
||||
},
|
||||
|
||||
/**
|
||||
* Downloads a script and executes a callback when done.
|
||||
* @param {String} scriptLocation
|
||||
* @param {Function} callback
|
||||
*/
|
||||
getScript: function (scriptLocation, callback) {
|
||||
// We cannot assume that Assets class from mootools-more is available so instead insert a script tag to download script.
|
||||
var head = doc.getElementsByTagName('head')[0],
|
||||
script = doc.createElement('script');
|
||||
|
||||
script.type = 'text/javascript';
|
||||
script.src = scriptLocation;
|
||||
script.onload = callback;
|
||||
|
||||
head.appendChild(script);
|
||||
},
|
||||
|
||||
/**
|
||||
* Return the index of an item in an array, or -1 if not found
|
||||
*/
|
||||
inArray: function (item, arr) {
|
||||
return arr.indexOf ? arr.indexOf(item) : emptyArray.indexOf.call(arr, item);
|
||||
},
|
||||
|
||||
|
||||
/**
|
||||
* A direct link to adapter methods
|
||||
*/
|
||||
adapterRun: function (elem, method) {
|
||||
return parseInt(HighchartsAdapter._getStyle(elem, method), 10);
|
||||
},
|
||||
|
||||
/**
|
||||
* Filter an array
|
||||
*/
|
||||
grep: function (elements, callback) {
|
||||
return emptyArray.filter.call(elements, callback);
|
||||
},
|
||||
|
||||
/**
|
||||
* Map an array
|
||||
*/
|
||||
map: function (arr, fn) {
|
||||
var results = [], i = 0, len = arr.length;
|
||||
|
||||
for (; i < len; i++) {
|
||||
results[i] = fn.call(arr[i], arr[i], i, arr);
|
||||
}
|
||||
|
||||
return results;
|
||||
},
|
||||
|
||||
/**
|
||||
* Get the element's offset position, corrected by overflow:auto. Loosely based on jQuery's offset method.
|
||||
*/
|
||||
offset: function (el) {
|
||||
var docElem = document.documentElement,
|
||||
box = el.getBoundingClientRect();
|
||||
|
||||
return {
|
||||
top: box.top + (window.pageYOffset || docElem.scrollTop) - (docElem.clientTop || 0),
|
||||
left: box.left + (window.pageXOffset || docElem.scrollLeft) - (docElem.clientLeft || 0)
|
||||
};
|
||||
},
|
||||
|
||||
/**
|
||||
* Add an event listener
|
||||
*/
|
||||
addEvent: function (el, type, fn) {
|
||||
augment(el).bind(type, fn);
|
||||
},
|
||||
|
||||
/**
|
||||
* Remove event added with addEvent
|
||||
*/
|
||||
removeEvent: function (el, type, fn) {
|
||||
augment(el).unbind(type, fn);
|
||||
},
|
||||
|
||||
/**
|
||||
* Fire an event on a custom object
|
||||
*/
|
||||
fireEvent: function (el, type, eventArguments, defaultFunction) {
|
||||
var e;
|
||||
|
||||
if (doc.createEvent && (el.dispatchEvent || el.fireEvent)) {
|
||||
e = doc.createEvent('Events');
|
||||
e.initEvent(type, true, true);
|
||||
e.target = el;
|
||||
|
||||
Highcharts.extend(e, eventArguments);
|
||||
|
||||
if (el.dispatchEvent) {
|
||||
el.dispatchEvent(e);
|
||||
} else {
|
||||
el.fireEvent(type, e);
|
||||
}
|
||||
|
||||
} else if (el.HCExtended === true) {
|
||||
eventArguments = eventArguments || {};
|
||||
el.trigger(type, eventArguments);
|
||||
}
|
||||
|
||||
if (eventArguments && eventArguments.defaultPrevented) {
|
||||
defaultFunction = null;
|
||||
}
|
||||
|
||||
if (defaultFunction) {
|
||||
defaultFunction(eventArguments);
|
||||
}
|
||||
},
|
||||
|
||||
washMouseEvent: function (e) {
|
||||
return e;
|
||||
},
|
||||
|
||||
|
||||
/**
|
||||
* Stop running animation
|
||||
*/
|
||||
stop: function (el) {
|
||||
|
||||
var i = timers.length,
|
||||
timer;
|
||||
|
||||
// Remove timers related to this element (#4519)
|
||||
while (i--) {
|
||||
timer = timers[i];
|
||||
if (timer.elem === el) {
|
||||
timers.splice(i, 1);
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Utility for iterating over an array. Parameters are reversed compared to jQuery.
|
||||
* @param {Array} arr
|
||||
* @param {Function} fn
|
||||
*/
|
||||
each: function (arr, fn) { // modern browsers
|
||||
return Array.prototype.forEach.call(arr, fn);
|
||||
}
|
||||
};
|
||||
}());
|
||||
47
lib/highcharts/js/highcharts-3d.js
Normal file
47
lib/highcharts/js/highcharts-3d.js
Normal file
@ -0,0 +1,47 @@
|
||||
/*
|
||||
Highcharts JS v4.1.9 (2015-10-07)
|
||||
|
||||
(c) 2009-2013 Torstein H?nsi
|
||||
|
||||
License: www.highcharts.com/license
|
||||
*/
|
||||
(function(d){function p(c,b,a){var e,g,f=b.options.chart.options3d,h=!1;a?(h=b.inverted,a=b.plotWidth/2,b=b.plotHeight/2,e=f.depth/2,g=z(f.depth,1)*z(f.viewDistance,0)):(a=b.plotLeft+b.plotWidth/2,b=b.plotTop+b.plotHeight/2,e=f.depth/2,g=z(f.depth,1)*z(f.viewDistance,0));var j=[],i=a,k=b,l=e,q=g,a=A*(h?f.beta:-f.beta),f=A*(h?-f.alpha:f.alpha),o=m(a),x=n(a),r=m(f),v=n(f),t,u,y,w,s,p;d.each(c,function(a){t=(h?a.y:a.x)-i;u=(h?a.x:a.y)-k;y=(a.z||0)-l;w=x*t-o*y;s=-o*r*t-x*r*y+v*u;p=o*v*t+x*v*y+r*u;q>0&&
|
||||
q<Number.POSITIVE_INFINITY&&(w*=q/(p+l+q),s*=q/(p+l+q));w+=i;s+=k;p+=l;j.push({x:h?s:w,y:h?w:s,z:p})});return j}function B(c){return c!==void 0&&c!==null}function F(c){var b=0,a,e;for(a=0;a<c.length;a++)e=(a+1)%c.length,b+=c[a].x*c[e].y-c[e].x*c[a].y;return b/2}function D(c){var b=0,a;for(a=0;a<c.length;a++)b+=c[a].z;return c.length?b/c.length:0}function s(c,b,a,e,g,f,d,j){var i=[];return f>g&&f-g>o/2+1.0E-4?(i=i.concat(s(c,b,a,e,g,g+o/2,d,j)),i=i.concat(s(c,b,a,e,g+o/2,f,d,j))):f<g&&g-f>o/2+1.0E-4?
|
||||
(i=i.concat(s(c,b,a,e,g,g-o/2,d,j)),i=i.concat(s(c,b,a,e,g-o/2,f,d,j))):(i=f-g,["C",c+a*n(g)-a*C*i*m(g)+d,b+e*m(g)+e*C*i*n(g)+j,c+a*n(f)+a*C*i*m(f)+d,b+e*m(f)-e*C*i*n(f)+j,c+a*n(f)+d,b+e*m(f)+j])}function G(c){if(this.chart.is3d()){var b=this.chart.options.plotOptions.column.grouping;if(b!==void 0&&!b&&this.group.zIndex!==void 0&&!this.zIndexSet)this.group.attr({zIndex:this.group.zIndex*10}),this.zIndexSet=!0;var a=this.options,e=this.options.states;this.borderWidth=a.borderWidth=B(a.edgeWidth)?a.edgeWidth:
|
||||
1;d.each(this.data,function(b){if(b.y!==null)b=b.pointAttr,this.borderColor=d.pick(a.edgeColor,b[""].fill),b[""].stroke=this.borderColor,b.hover.stroke=d.pick(e.hover.edgeColor,this.borderColor),b.select.stroke=d.pick(e.select.edgeColor,this.borderColor)})}c.apply(this,[].slice.call(arguments,1))}var o=Math.PI,A=o/180,m=Math.sin,n=Math.cos,z=d.pick,H=Math.round;d.perspective=p;var C=4*(Math.sqrt(2)-1)/3/(o/2);d.SVGRenderer.prototype.toLinePath=function(c,b){var a=[];d.each(c,function(b){a.push("L",
|
||||
b.x,b.y)});c.length&&(a[0]="M",b&&a.push("Z"));return a};d.SVGRenderer.prototype.cuboid=function(c){var b=this.g(),c=this.cuboidPath(c);b.front=this.path(c[0]).attr({zIndex:c[3],"stroke-linejoin":"round"}).add(b);b.top=this.path(c[1]).attr({zIndex:c[4],"stroke-linejoin":"round"}).add(b);b.side=this.path(c[2]).attr({zIndex:c[5],"stroke-linejoin":"round"}).add(b);b.fillSetter=function(a){var b=d.Color(a).brighten(0.1).get(),c=d.Color(a).brighten(-0.1).get();this.front.attr({fill:a});this.top.attr({fill:b});
|
||||
this.side.attr({fill:c});this.color=a;return this};b.opacitySetter=function(a){this.front.attr({opacity:a});this.top.attr({opacity:a});this.side.attr({opacity:a});return this};b.attr=function(a){a.shapeArgs||B(a.x)?(a=this.renderer.cuboidPath(a.shapeArgs||a),this.front.attr({d:a[0],zIndex:a[3]}),this.top.attr({d:a[1],zIndex:a[4]}),this.side.attr({d:a[2],zIndex:a[5]})):d.SVGElement.prototype.attr.call(this,a);return this};b.animate=function(a,b,c){B(a.x)&&B(a.y)?(a=this.renderer.cuboidPath(a),this.front.attr({zIndex:a[3]}).animate({d:a[0]},
|
||||
b,c),this.top.attr({zIndex:a[4]}).animate({d:a[1]},b,c),this.side.attr({zIndex:a[5]}).animate({d:a[2]},b,c)):a.opacity?(this.front.animate(a,b,c),this.top.animate(a,b,c),this.side.animate(a,b,c)):d.SVGElement.prototype.animate.call(this,a,b,c);return this};b.destroy=function(){this.front.destroy();this.top.destroy();this.side.destroy();return null};b.attr({zIndex:-c[3]});return b};d.SVGRenderer.prototype.cuboidPath=function(c){var b=c.x,a=c.y,e=c.z,g=c.height,f=c.width,h=c.depth,j=d.map,i=[{x:b,y:a,
|
||||
z:e},{x:b+f,y:a,z:e},{x:b+f,y:a+g,z:e},{x:b,y:a+g,z:e},{x:b,y:a+g,z:e+h},{x:b+f,y:a+g,z:e+h},{x:b+f,y:a,z:e+h},{x:b,y:a,z:e+h}],i=p(i,d.charts[this.chartIndex],c.insidePlotArea),a=function(a,b){a=j(a,function(a){return i[a]});b=j(b,function(a){return i[a]});return F(a)<0?a:F(b)<0?b:[]},c=a([3,2,1,0],[7,6,5,4]),b=a([1,6,7,0],[4,5,2,3]),a=a([1,2,5,6],[0,7,4,3]);return[this.toLinePath(c,!0),this.toLinePath(b,!0),this.toLinePath(a,!0),D(c),D(b),D(a)]};d.SVGRenderer.prototype.arc3d=function(c){c.alpha*=
|
||||
A;c.beta*=A;var b=this.g(),a=this.arc3dPath(c),e=b.renderer,g=a.zTop*100;b.shapeArgs=c;b.top=e.path(a.top).setRadialReference(c.center).attr({zIndex:a.zTop}).add(b);b.side1=e.path(a.side2).attr({zIndex:a.zSide1});b.side2=e.path(a.side1).attr({zIndex:a.zSide2});b.inn=e.path(a.inn).attr({zIndex:a.zInn});b.out=e.path(a.out).attr({zIndex:a.zOut});b.fillSetter=function(a){this.color=a;var b=d.Color(a).brighten(-0.1).get();this.side1.attr({fill:b});this.side2.attr({fill:b});this.inn.attr({fill:b});this.out.attr({fill:b});
|
||||
this.top.attr({fill:a});return this};b.translateXSetter=function(a){this.out.attr({translateX:a});this.inn.attr({translateX:a});this.side1.attr({translateX:a});this.side2.attr({translateX:a});this.top.attr({translateX:a})};b.translateYSetter=function(a){this.out.attr({translateY:a});this.inn.attr({translateY:a});this.side1.attr({translateY:a});this.side2.attr({translateY:a});this.top.attr({translateY:a})};b.animate=function(a,b,c){B(a.end)||B(a.start)?(this._shapeArgs=this.shapeArgs,d.SVGElement.prototype.animate.call(this,
|
||||
{_args:a},{duration:b,start:function(){var a=arguments[0].elem,b=a._shapeArgs;b.fill!==a.color&&a.attr({fill:b.fill})},step:function(){var a=arguments[1],b=a.elem,c=b._shapeArgs,e=a.end,a=a.pos,c=d.merge(c,{x:c.x+(e.x-c.x)*a,y:c.y+(e.y-c.y)*a,r:c.r+(e.r-c.r)*a,innerR:c.innerR+(e.innerR-c.innerR)*a,start:c.start+(e.start-c.start)*a,end:c.end+(e.end-c.end)*a}),e=b.renderer.arc3dPath(c);b.shapeArgs=c;b.top.attr({d:e.top,zIndex:e.zTop});b.inn.attr({d:e.inn,zIndex:e.zInn});b.out.attr({d:e.out,zIndex:e.zOut});
|
||||
b.side1.attr({d:e.side1,zIndex:e.zSide1});b.side2.attr({d:e.side2,zIndex:e.zSide2})}},c)):d.SVGElement.prototype.animate.call(this,a,b,c);return this};b.destroy=function(){this.top.destroy();this.out.destroy();this.inn.destroy();this.side1.destroy();this.side2.destroy();d.SVGElement.prototype.destroy.call(this)};b.hide=function(){this.top.hide();this.out.hide();this.inn.hide();this.side1.hide();this.side2.hide()};b.show=function(){this.top.show();this.out.show();this.inn.show();this.side1.show();
|
||||
this.side2.show()};b.zIndex=g;b.attr({zIndex:g});return b};d.SVGRenderer.prototype.arc3dPath=function(c){function b(a){a%=2*o;a>o&&(a=2*o-a);return a}var a=c.x,e=c.y,d=c.start,f=c.end-1.0E-5,h=c.r,j=c.innerR,i=c.depth,k=c.alpha,l=c.beta,q=n(d),p=m(d),c=n(f),x=m(f),r=h*n(l);h*=n(k);var v=j*n(l),t=j*n(k),j=i*m(l),u=i*m(k),i=["M",a+r*q,e+h*p],i=i.concat(s(a,e,r,h,d,f,0,0)),i=i.concat(["L",a+v*c,e+t*x]),i=i.concat(s(a,e,v,t,f,d,0,0)),i=i.concat(["Z"]),y=l>0?o/2:0,l=k>0?0:o/2,y=d>-y?d:f>-y?-y:d,w=f<o-
|
||||
l?f:d<o-l?o-l:f,k=["M",a+r*n(y),e+h*m(y)],k=k.concat(s(a,e,r,h,y,w,0,0));f>o-l&&d<o-l&&(k=k.concat(["L",a+r*n(w)+j,e+h*m(w)+u]),k=k.concat(s(a,e,r,h,w,f,j,u)),k=k.concat(["L",a+r*n(f),e+h*m(f)]),k=k.concat(s(a,e,r,h,f,w,0,0)));k=k.concat(["L",a+r*n(w)+j,e+h*m(w)+u]);k=k.concat(s(a,e,r,h,w,y,j,u));k=k.concat(["Z"]);l=["M",a+v*q,e+t*p];l=l.concat(s(a,e,v,t,d,f,0,0));l=l.concat(["L",a+v*n(f)+j,e+t*m(f)+u]);l=l.concat(s(a,e,v,t,f,d,j,u));l=l.concat(["Z"]);q=["M",a+r*q,e+h*p,"L",a+r*q+j,e+h*p+u,"L",a+
|
||||
v*q+j,e+t*p+u,"L",a+v*q,e+t*p,"Z"];a=["M",a+r*c,e+h*x,"L",a+r*c+j,e+h*x+u,"L",a+v*c+j,e+t*x+u,"L",a+v*c,e+t*x,"Z"];x=Math.atan2(u,-j);e=Math.abs(f+x);c=Math.abs(d+x);d=Math.abs((d+f)/2+x);e=b(e);c=b(c);d=b(d);d*=1E5;f=c*1E5;e*=1E5;return{top:i,zTop:o*1E5+1,out:k,zOut:Math.max(d,f,e),inn:l,zInn:Math.max(d,f,e),side1:q,zSide1:e*0.99,side2:a,zSide2:f*0.99}};d.Chart.prototype.is3d=function(){return this.options.chart.options3d&&this.options.chart.options3d.enabled};d.wrap(d.Chart.prototype,"isInsidePlot",
|
||||
function(c){return this.is3d()?!0:c.apply(this,[].slice.call(arguments,1))});d.getOptions().chart.options3d={enabled:!1,alpha:0,beta:0,depth:100,viewDistance:25,frame:{bottom:{size:1,color:"rgba(255,255,255,0)"},side:{size:1,color:"rgba(255,255,255,0)"},back:{size:1,color:"rgba(255,255,255,0)"}}};d.wrap(d.Chart.prototype,"init",function(c){var b=[].slice.call(arguments,1),a;if(b[0].chart.options3d&&b[0].chart.options3d.enabled)b[0].chart.options3d.alpha=(b[0].chart.options3d.alpha||0)%360,b[0].chart.options3d.beta=
|
||||
(b[0].chart.options3d.beta||0)%360,a=b[0].plotOptions||{},a=a.pie||{},a.borderColor=d.pick(a.borderColor,void 0);c.apply(this,b)});d.wrap(d.Chart.prototype,"setChartSize",function(c){c.apply(this,[].slice.call(arguments,1));if(this.is3d()){var b=this.inverted,a=this.clipBox,e=this.margin;a[b?"y":"x"]=-(e[3]||0);a[b?"x":"y"]=-(e[0]||0);a[b?"height":"width"]=this.chartWidth+(e[3]||0)+(e[1]||0);a[b?"width":"height"]=this.chartHeight+(e[0]||0)+(e[2]||0)}});d.wrap(d.Chart.prototype,"redraw",function(c){if(this.is3d())this.isDirtyBox=
|
||||
!0;c.apply(this,[].slice.call(arguments,1))});d.wrap(d.Chart.prototype,"renderSeries",function(c){var b=this.series.length;if(this.is3d())for(;b--;)c=this.series[b],c.translate(),c.render();else c.call(this)});d.Chart.prototype.retrieveStacks=function(c){var b=this.series,a={},e,g=1;d.each(this.series,function(d){e=z(d.options.stack,c?0:b.length-1-d.index);a[e]?a[e].series.push(d):(a[e]={series:[d],position:g},g++)});a.totalStacks=g+1;return a};d.wrap(d.Axis.prototype,"setOptions",function(c,b){var a;
|
||||
c.call(this,b);if(this.chart.is3d())a=this.options,a.tickWidth=d.pick(a.tickWidth,0),a.gridLineWidth=d.pick(a.gridLineWidth,1)});d.wrap(d.Axis.prototype,"render",function(c){c.apply(this,[].slice.call(arguments,1));if(this.chart.is3d()){var b=this.chart,a=b.renderer,e=b.options.chart.options3d,d=e.frame,f=d.bottom,h=d.back,d=d.side,j=e.depth,i=this.height,k=this.width,l=this.left,q=this.top;if(!this.isZAxis)this.horiz?(h={x:l,y:q+(b.xAxis[0].opposite?-f.size:i),z:0,width:k,height:f.size,depth:j,insidePlotArea:!1},
|
||||
this.bottomFrame?this.bottomFrame.animate(h):this.bottomFrame=a.cuboid(h).attr({fill:f.color,zIndex:b.yAxis[0].reversed&&e.alpha>0?4:-1}).css({stroke:f.color}).add()):(e={x:l+(b.yAxis[0].opposite?0:-d.size),y:q+(b.xAxis[0].opposite?-f.size:0),z:j,width:k+d.size,height:i+f.size,depth:h.size,insidePlotArea:!1},this.backFrame?this.backFrame.animate(e):this.backFrame=a.cuboid(e).attr({fill:h.color,zIndex:-3}).css({stroke:h.color}).add(),b={x:l+(b.yAxis[0].opposite?k:-d.size),y:q+(b.xAxis[0].opposite?
|
||||
-f.size:0),z:0,width:d.size,height:i+f.size,depth:j,insidePlotArea:!1},this.sideFrame?this.sideFrame.animate(b):this.sideFrame=a.cuboid(b).attr({fill:d.color,zIndex:-2}).css({stroke:d.color}).add())}});d.wrap(d.Axis.prototype,"getPlotLinePath",function(c){var b=c.apply(this,[].slice.call(arguments,1));if(!this.chart.is3d())return b;if(b===null)return b;var a=this.chart.options.chart.options3d,a=this.isZAxis?this.chart.plotWidth:a.depth,d=this.opposite;this.horiz&&(d=!d);b=[this.swapZ({x:b[1],y:b[2],
|
||||
z:d?a:0}),this.swapZ({x:b[1],y:b[2],z:a}),this.swapZ({x:b[4],y:b[5],z:a}),this.swapZ({x:b[4],y:b[5],z:d?0:a})];b=p(b,this.chart,!1);return b=this.chart.renderer.toLinePath(b,!1)});d.wrap(d.Axis.prototype,"getLinePath",function(c){return this.chart.is3d()?[]:c.apply(this,[].slice.call(arguments,1))});d.wrap(d.Axis.prototype,"getPlotBandPath",function(c){if(this.chart.is3d()){var b=arguments,a=b[1],b=this.getPlotLinePath(b[2]);(a=this.getPlotLinePath(a))&&b?a.push("L",b[10],b[11],"L",b[7],b[8],"L",
|
||||
b[4],b[5],"L",b[1],b[2]):a=null;return a}else return c.apply(this,[].slice.call(arguments,1))});d.wrap(d.Tick.prototype,"getMarkPath",function(c){var b=c.apply(this,[].slice.call(arguments,1));if(!this.axis.chart.is3d())return b;b=[this.axis.swapZ({x:b[1],y:b[2],z:0}),this.axis.swapZ({x:b[4],y:b[5],z:0})];b=p(b,this.axis.chart,!1);return b=["M",b[0].x,b[0].y,"L",b[1].x,b[1].y]});d.wrap(d.Tick.prototype,"getLabelPosition",function(c){var b=c.apply(this,[].slice.call(arguments,1));if(!this.axis.chart.is3d())return b;
|
||||
var a=p([this.axis.swapZ({x:b.x,y:b.y,z:0})],this.axis.chart,!1)[0];a.x-=!this.axis.horiz&&this.axis.opposite?this.axis.transA:0;a.old=b;return a});d.wrap(d.Tick.prototype,"handleOverflow",function(c,b){if(this.axis.chart.is3d())b=b.old;return c.call(this,b)});d.wrap(d.Axis.prototype,"getTitlePosition",function(c){var b=c.apply(this,[].slice.call(arguments,1));return!this.chart.is3d()?b:b=p([this.swapZ({x:b.x,y:b.y,z:0})],this.chart,!1)[0]});d.wrap(d.Axis.prototype,"drawCrosshair",function(c){var b=
|
||||
arguments;this.chart.is3d()&&b[2]&&(b[2]={plotX:b[2].plotXold||b[2].plotX,plotY:b[2].plotYold||b[2].plotY});c.apply(this,[].slice.call(b,1))});d.Axis.prototype.swapZ=function(c,b){if(this.isZAxis){var a=b?0:this.chart.plotLeft,d=this.chart;return{x:a+(d.yAxis[0].opposite?c.z:d.xAxis[0].width-c.z),y:c.y,z:c.x-a}}else return c};var E=d.ZAxis=function(){this.isZAxis=!0;this.init.apply(this,arguments)};d.extend(E.prototype,d.Axis.prototype);d.extend(E.prototype,{setOptions:function(c){c=d.merge({offset:0,
|
||||
lineWidth:0},c);d.Axis.prototype.setOptions.call(this,c);this.coll="zAxis"},setAxisSize:function(){d.Axis.prototype.setAxisSize.call(this);this.width=this.len=this.chart.options.chart.options3d.depth;this.right=this.chart.chartWidth-this.width-this.left},getSeriesExtremes:function(){var c=this,b=c.chart;c.hasVisibleSeries=!1;c.dataMin=c.dataMax=c.ignoreMinPadding=c.ignoreMaxPadding=null;c.buildStacks&&c.buildStacks();d.each(c.series,function(a){if(a.visible||!b.options.chart.ignoreHiddenSeries)if(c.hasVisibleSeries=
|
||||
!0,a=a.zData,a.length)c.dataMin=Math.min(z(c.dataMin,a[0]),Math.min.apply(null,a)),c.dataMax=Math.max(z(c.dataMax,a[0]),Math.max.apply(null,a))})}});d.wrap(d.Chart.prototype,"getAxes",function(c){var b=this,a=this.options,a=a.zAxis=d.splat(a.zAxis||{});c.call(this);if(b.is3d())this.zAxis=[],d.each(a,function(a,c){a.index=c;a.isX=!0;(new E(b,a)).setScale()})});d.wrap(d.seriesTypes.column.prototype,"translate",function(c){c.apply(this,[].slice.call(arguments,1));if(this.chart.is3d()){var b=this.chart,
|
||||
a=this.options,e=a.depth||25,g=(a.stacking?a.stack||0:this._i)*(e+(a.groupZPadding||1));a.grouping!==!1&&(g=0);g+=a.groupZPadding||1;d.each(this.data,function(a){if(a.y!==null){var c=a.shapeArgs,d=a.tooltipPos;a.shapeType="cuboid";c.z=g;c.depth=e;c.insidePlotArea=!0;d=p([{x:d[0],y:d[1],z:g}],b,!1)[0];a.tooltipPos=[d.x,d.y]}});this.z=g}});d.wrap(d.seriesTypes.column.prototype,"animate",function(c){if(this.chart.is3d()){var b=arguments[1],a=this.yAxis,e=this,g=this.yAxis.reversed;if(d.svg)b?d.each(e.data,
|
||||
function(b){if(b.y!==null&&(b.height=b.shapeArgs.height,b.shapey=b.shapeArgs.y,b.shapeArgs.height=1,!g))b.shapeArgs.y=b.stackY?b.plotY+a.translate(b.stackY):b.plotY+(b.negative?-b.height:b.height)}):(d.each(e.data,function(a){if(a.y!==null)a.shapeArgs.height=a.height,a.shapeArgs.y=a.shapey,a.graphic&&a.graphic.animate(a.shapeArgs,e.options.animation)}),this.drawDataLabels(),e.animate=null)}else c.apply(this,[].slice.call(arguments,1))});d.wrap(d.seriesTypes.column.prototype,"init",function(c){c.apply(this,
|
||||
[].slice.call(arguments,1));if(this.chart.is3d()){var b=this.options,a=b.grouping,d=b.stacking,g=0;if(a===void 0||a){a=this.chart.retrieveStacks(d);d=b.stack||0;for(g=0;g<a[d].series.length;g++)if(a[d].series[g]===this)break;g=a.totalStacks*10-10*(a.totalStacks-a[d].position)-g}b.zIndex=g}});d.wrap(d.Series.prototype,"alignDataLabel",function(c){if(this.chart.is3d()&&(this.type==="column"||this.type==="columnrange")){var b=arguments[4],a={x:b.x,y:b.y,z:this.z},a=p([a],this.chart,!0)[0];b.x=a.x;b.y=
|
||||
a.y}c.apply(this,[].slice.call(arguments,1))});d.seriesTypes.columnrange&&d.wrap(d.seriesTypes.columnrange.prototype,"drawPoints",G);d.wrap(d.seriesTypes.column.prototype,"drawPoints",G);d.wrap(d.seriesTypes.pie.prototype,"translate",function(c){c.apply(this,[].slice.call(arguments,1));if(this.chart.is3d()){var b=this,a=b.chart,e=b.options,g=e.depth||0,f=a.options.chart.options3d,h={x:a.plotWidth/2,y:a.plotHeight/2,z:f.depth},j=f.alpha,i=f.beta,k=e.stacking?(e.stack||0)*g:b._i*g;k+=g/2;e.grouping!==
|
||||
!1&&(k=0);d.each(b.data,function(a){var c=a.shapeArgs;a.shapeType="arc3d";c.z=k;c.depth=g*0.75;c.origin=h;c.alpha=j;c.beta=i;c.center=b.center;c=(c.end+c.start)/2;a.slicedTranslation={translateX:H(n(c)*e.slicedOffset*n(j*A)),translateY:H(m(c)*e.slicedOffset*n(j*A))}})}});d.wrap(d.seriesTypes.pie.prototype.pointClass.prototype,"haloPath",function(c){var b=arguments;return this.series.chart.is3d()?[]:c.call(this,b[1])});d.wrap(d.seriesTypes.pie.prototype,"drawPoints",function(c){var b=this.group,a=
|
||||
this.options,e=a.states;if(this.chart.is3d())this.borderWidth=a.borderWidth=a.edgeWidth||1,this.borderColor=a.edgeColor=d.pick(a.edgeColor,a.borderColor,void 0),e.hover.borderColor=d.pick(e.hover.edgeColor,this.borderColor),e.hover.borderWidth=d.pick(e.hover.edgeWidth,this.borderWidth),e.select.borderColor=d.pick(e.select.edgeColor,this.borderColor),e.select.borderWidth=d.pick(e.select.edgeWidth,this.borderWidth),d.each(this.data,function(a){var b=a.pointAttr;b[""].stroke=a.series.borderColor||a.color;
|
||||
b[""]["stroke-width"]=a.series.borderWidth;b.hover.stroke=e.hover.borderColor;b.hover["stroke-width"]=e.hover.borderWidth;b.select.stroke=e.select.borderColor;b.select["stroke-width"]=e.select.borderWidth});c.apply(this,[].slice.call(arguments,1));this.chart.is3d()&&d.each(this.points,function(a){var c=a.graphic;c.out.add(b);c.inn.add(b);c.side1.add(b);c.side2.add(b);c[a.y?"show":"hide"]()})});d.wrap(d.seriesTypes.pie.prototype,"drawDataLabels",function(c){if(this.chart.is3d()){var b=this;d.each(b.data,
|
||||
function(a){var c=a.shapeArgs,d=c.r,f=c.depth,h=(c.alpha||b.chart.options.chart.options3d.alpha)*A,c=(c.start+c.end)/2,a=a.labelPos;a[1]+=-d*(1-n(h))*m(c)+(m(c)>0?m(h)*f:0);a[3]+=-d*(1-n(h))*m(c)+(m(c)>0?m(h)*f:0);a[5]+=-d*(1-n(h))*m(c)+(m(c)>0?m(h)*f:0)})}c.apply(this,[].slice.call(arguments,1))});d.wrap(d.seriesTypes.pie.prototype,"addPoint",function(c){c.apply(this,[].slice.call(arguments,1));this.chart.is3d()&&this.update(this.userOptions,!0)});d.wrap(d.seriesTypes.pie.prototype,"animate",function(c){if(this.chart.is3d()){var b=
|
||||
arguments[1],a=this.options.animation,e=this.center,g=this.group,f=this.markerGroup;if(d.svg)if(a===!0&&(a={}),b){if(g.oldtranslateX=g.translateX,g.oldtranslateY=g.translateY,b={translateX:e[0],translateY:e[1],scaleX:0.001,scaleY:0.001},g.attr(b),f)f.attrSetters=g.attrSetters,f.attr(b)}else b={translateX:g.oldtranslateX,translateY:g.oldtranslateY,scaleX:1,scaleY:1},g.animate(b,a),f&&f.animate(b,a),this.animate=null}else c.apply(this,[].slice.call(arguments,1))});d.wrap(d.seriesTypes.scatter.prototype,
|
||||
"translate",function(c){c.apply(this,[].slice.call(arguments,1));if(this.chart.is3d()){var b=this.chart,a=d.pick(this.zAxis,b.options.zAxis[0]),e=[],g,f,h;for(h=0;h<this.data.length;h++)g=this.data[h],f=a.isLog&&a.val2lin?a.val2lin(g.z):g.z,g.plotZ=a.translate(f),g.isInside=g.isInside?f>=a.min&&f<=a.max:!1,e.push({x:g.plotX,y:g.plotY,z:g.plotZ});b=p(e,b,!0);for(h=0;h<this.data.length;h++)g=this.data[h],a=b[h],g.plotXold=g.plotX,g.plotYold=g.plotY,g.plotX=a.x,g.plotY=a.y,g.plotZ=a.z}});d.wrap(d.seriesTypes.scatter.prototype,
|
||||
"init",function(c,b,a){if(b.is3d())this.axisTypes=["xAxis","yAxis","zAxis"],this.pointArrayMap=["x","y","z"],this.parallelArrays=["x","y","z"];c=c.apply(this,[b,a]);if(this.chart.is3d())this.tooltipOptions.pointFormat=this.userOptions.tooltip?this.userOptions.tooltip.pointFormat||"x: <b>{point.x}</b><br/>y: <b>{point.y}</b><br/>z: <b>{point.z}</b><br/>":"x: <b>{point.x}</b><br/>y: <b>{point.y}</b><br/>z: <b>{point.z}</b><br/>";return c});if(d.VMLRenderer)d.setOptions({animate:!1}),d.VMLRenderer.prototype.cuboid=
|
||||
d.SVGRenderer.prototype.cuboid,d.VMLRenderer.prototype.cuboidPath=d.SVGRenderer.prototype.cuboidPath,d.VMLRenderer.prototype.toLinePath=d.SVGRenderer.prototype.toLinePath,d.VMLRenderer.prototype.createElement3D=d.SVGRenderer.prototype.createElement3D,d.VMLRenderer.prototype.arc3d=function(c){c=d.SVGRenderer.prototype.arc3d.call(this,c);c.css({zIndex:c.zIndex});return c},d.VMLRenderer.prototype.arc3dPath=d.SVGRenderer.prototype.arc3dPath,d.wrap(d.Axis.prototype,"render",function(c){c.apply(this,[].slice.call(arguments,
|
||||
1));this.sideFrame&&(this.sideFrame.css({zIndex:0}),this.sideFrame.front.attr({fill:this.sideFrame.color}));this.bottomFrame&&(this.bottomFrame.css({zIndex:1}),this.bottomFrame.front.attr({fill:this.bottomFrame.color}));this.backFrame&&(this.backFrame.css({zIndex:0}),this.backFrame.front.attr({fill:this.backFrame.color}))})})(Highcharts);
|
||||
1570
lib/highcharts/js/highcharts-3d.src.js
Normal file
1570
lib/highcharts/js/highcharts-3d.src.js
Normal file
File diff suppressed because it is too large
Load Diff
55
lib/highcharts/js/highcharts-more.js
Normal file
55
lib/highcharts/js/highcharts-more.js
Normal file
@ -0,0 +1,55 @@
|
||||
/*
|
||||
Highcharts JS v4.1.9 (2015-10-07)
|
||||
|
||||
(c) 2009-2014 Torstein Honsi
|
||||
|
||||
License: www.highcharts.com/license
|
||||
*/
|
||||
(function(n,G){function L(a,b,c){this.init.call(this,a,b,c)}var Q=n.arrayMin,R=n.arrayMax,s=n.each,I=n.extend,t=n.merge,S=n.map,o=n.pick,B=n.pInt,p=n.getOptions().plotOptions,i=n.seriesTypes,u=n.extendClass,M=n.splat,r=n.wrap,N=n.Axis,z=n.Tick,J=n.Point,T=n.Pointer,U=n.CenteredSeriesMixin,A=n.TrackerMixin,w=n.Series,y=Math,E=y.round,C=y.floor,O=y.max,V=n.Color,v=function(){};I(L.prototype,{init:function(a,b,c){var d=this,e=d.defaultOptions;d.chart=b;d.options=a=t(e,b.angular?{background:{}}:void 0,
|
||||
a);(a=a.background)&&s([].concat(M(a)).reverse(),function(a){var b=a.backgroundColor,k=c.userOptions,a=t(d.defaultBackgroundOptions,a);if(b)a.backgroundColor=b;a.color=a.backgroundColor;c.options.plotBands.unshift(a);k.plotBands=k.plotBands||[];k.plotBands!==c.options.plotBands&&k.plotBands.unshift(a)})},defaultOptions:{center:["50%","50%"],size:"85%",startAngle:0},defaultBackgroundOptions:{shape:"circle",borderWidth:1,borderColor:"silver",backgroundColor:{linearGradient:{x1:0,y1:0,x2:0,y2:1},stops:[[0,
|
||||
"#FFF"],[1,"#DDD"]]},from:-Number.MAX_VALUE,innerRadius:0,to:Number.MAX_VALUE,outerRadius:"105%"}});var H=N.prototype,z=z.prototype,W={getOffset:v,redraw:function(){this.isDirty=!1},render:function(){this.isDirty=!1},setScale:v,setCategories:v,setTitle:v},P={isRadial:!0,defaultRadialGaugeOptions:{labels:{align:"center",x:0,y:null},minorGridLineWidth:0,minorTickInterval:"auto",minorTickLength:10,minorTickPosition:"inside",minorTickWidth:1,tickLength:10,tickPosition:"inside",tickWidth:2,title:{rotation:0},
|
||||
zIndex:2},defaultRadialXOptions:{gridLineWidth:1,labels:{align:null,distance:15,x:0,y:null},maxPadding:0,minPadding:0,showLastLabel:!1,tickLength:0},defaultRadialYOptions:{gridLineInterpolation:"circle",labels:{align:"right",x:-3,y:-2},showLastLabel:!1,title:{x:4,text:null,rotation:90}},setOptions:function(a){a=this.options=t(this.defaultOptions,this.defaultRadialOptions,a);if(!a.plotBands)a.plotBands=[]},getOffset:function(){H.getOffset.call(this);this.chart.axisOffset[this.side]=0;this.center=this.pane.center=
|
||||
U.getCenter.call(this.pane)},getLinePath:function(a,b){var c=this.center,b=o(b,c[2]/2-this.offset);return this.chart.renderer.symbols.arc(this.left+c[0],this.top+c[1],b,b,{start:this.startAngleRad,end:this.endAngleRad,open:!0,innerR:0})},setAxisTranslation:function(){H.setAxisTranslation.call(this);if(this.center)this.transA=this.isCircular?(this.endAngleRad-this.startAngleRad)/(this.max-this.min||1):this.center[2]/2/(this.max-this.min||1),this.minPixelPadding=this.isXAxis?this.transA*this.minPointOffset:
|
||||
0},beforeSetTickPositions:function(){this.autoConnect&&(this.max+=this.categories&&1||this.pointRange||this.closestPointRange||0)},setAxisSize:function(){H.setAxisSize.call(this);if(this.isRadial){this.center=this.pane.center=n.CenteredSeriesMixin.getCenter.call(this.pane);if(this.isCircular)this.sector=this.endAngleRad-this.startAngleRad;this.len=this.width=this.height=this.center[2]*o(this.sector,1)/2}},getPosition:function(a,b){return this.postTranslate(this.isCircular?this.translate(a):0,o(this.isCircular?
|
||||
b:this.translate(a),this.center[2]/2)-this.offset)},postTranslate:function(a,b){var c=this.chart,d=this.center,a=this.startAngleRad+a;return{x:c.plotLeft+d[0]+Math.cos(a)*b,y:c.plotTop+d[1]+Math.sin(a)*b}},getPlotBandPath:function(a,b,c){var d=this.center,e=this.startAngleRad,f=d[2]/2,h=[o(c.outerRadius,"100%"),c.innerRadius,o(c.thickness,10)],k=/%$/,g,j=this.isCircular;this.options.gridLineInterpolation==="polygon"?d=this.getPlotLinePath(a).concat(this.getPlotLinePath(b,!0)):(a=Math.max(a,this.min),
|
||||
b=Math.min(b,this.max),j||(h[0]=this.translate(a),h[1]=this.translate(b)),h=S(h,function(a){k.test(a)&&(a=B(a,10)*f/100);return a}),c.shape==="circle"||!j?(a=-Math.PI/2,b=Math.PI*1.5,g=!0):(a=e+this.translate(a),b=e+this.translate(b)),d=this.chart.renderer.symbols.arc(this.left+d[0],this.top+d[1],h[0],h[0],{start:Math.min(a,b),end:Math.max(a,b),innerR:o(h[1],h[0]-h[2]),open:g}));return d},getPlotLinePath:function(a,b){var c=this,d=c.center,e=c.chart,f=c.getPosition(a),h,k,g;c.isCircular?g=["M",d[0]+
|
||||
e.plotLeft,d[1]+e.plotTop,"L",f.x,f.y]:c.options.gridLineInterpolation==="circle"?(a=c.translate(a))&&(g=c.getLinePath(0,a)):(s(e.xAxis,function(a){a.pane===c.pane&&(h=a)}),g=[],a=c.translate(a),d=h.tickPositions,h.autoConnect&&(d=d.concat([d[0]])),b&&(d=[].concat(d).reverse()),s(d,function(f,b){k=h.getPosition(f,a);g.push(b?"L":"M",k.x,k.y)}));return g},getTitlePosition:function(){var a=this.center,b=this.chart,c=this.options.title;return{x:b.plotLeft+a[0]+(c.x||0),y:b.plotTop+a[1]-{high:0.5,middle:0.25,
|
||||
low:0}[c.align]*a[2]+(c.y||0)}}};r(H,"init",function(a,b,c){var l;var d=b.angular,e=b.polar,f=c.isX,h=d&&f,k,g;g=b.options;var j=c.pane||0;if(d){if(I(this,h?W:P),k=!f)this.defaultRadialOptions=this.defaultRadialGaugeOptions}else if(e)I(this,P),this.defaultRadialOptions=(k=f)?this.defaultRadialXOptions:t(this.defaultYAxisOptions,this.defaultRadialYOptions);a.call(this,b,c);if(!h&&(d||e)){a=this.options;if(!b.panes)b.panes=[];this.pane=(l=b.panes[j]=b.panes[j]||new L(M(g.pane)[j],b,this),j=l);j=j.options;
|
||||
b.inverted=!1;g.chart.zoomType=null;this.startAngleRad=b=(j.startAngle-90)*Math.PI/180;this.endAngleRad=g=(o(j.endAngle,j.startAngle+360)-90)*Math.PI/180;this.offset=a.offset||0;if((this.isCircular=k)&&c.max===G&&g-b===2*Math.PI)this.autoConnect=!0}});r(z,"getPosition",function(a,b,c,d,e){var f=this.axis;return f.getPosition?f.getPosition(c):a.call(this,b,c,d,e)});r(z,"getLabelPosition",function(a,b,c,d,e,f,h,k,g){var j=this.axis,m=f.y,l=20,i=f.align,x=(j.translate(this.pos)+j.startAngleRad+Math.PI/
|
||||
2)/Math.PI*180%360;j.isRadial?(a=j.getPosition(this.pos,j.center[2]/2+o(f.distance,-25)),f.rotation==="auto"?d.attr({rotation:x}):m===null&&(m=j.chart.renderer.fontMetrics(d.styles.fontSize).b-d.getBBox().height/2),i===null&&(j.isCircular?(this.label.getBBox().width>j.len*j.tickInterval/(j.max-j.min)&&(l=0),i=x>l&&x<180-l?"left":x>180+l&&x<360-l?"right":"center"):i="center",d.attr({align:i})),a.x+=f.x,a.y+=m):a=a.call(this,b,c,d,e,f,h,k,g);return a});r(z,"getMarkPath",function(a,b,c,d,e,f,h){var k=
|
||||
this.axis;k.isRadial?(a=k.getPosition(this.pos,k.center[2]/2+d),b=["M",b,c,"L",a.x,a.y]):b=a.call(this,b,c,d,e,f,h);return b});p.arearange=t(p.area,{lineWidth:1,marker:null,threshold:null,tooltip:{pointFormat:'<span style="color:{series.color}">\u25cf</span> {series.name}: <b>{point.low}</b> - <b>{point.high}</b><br/>'},trackByArea:!0,dataLabels:{align:null,verticalAlign:null,xLow:0,xHigh:0,yLow:0,yHigh:0},states:{hover:{halo:!1}}});i.arearange=u(i.area,{type:"arearange",pointArrayMap:["low","high"],
|
||||
dataLabelCollections:["dataLabel","dataLabelUpper"],toYData:function(a){return[a.low,a.high]},pointValKey:"low",deferTranslatePolar:!0,highToXY:function(a){var b=this.chart,c=this.xAxis.postTranslate(a.rectPlotX,this.yAxis.len-a.plotHigh);a.plotHighX=c.x-b.plotLeft;a.plotHigh=c.y-b.plotTop},getSegments:function(){var a=this;s(a.points,function(b){if(!a.options.connectNulls&&(b.low===null||b.high===null))b.y=null;else if(b.low===null&&b.high!==null)b.y=b.high});w.prototype.getSegments.call(this)},
|
||||
translate:function(){var a=this,b=a.yAxis;i.area.prototype.translate.apply(a);s(a.points,function(a){var d=a.low,e=a.high,f=a.plotY;e===null&&d===null?a.y=null:d===null?(a.plotLow=a.plotY=null,a.plotHigh=b.translate(e,0,1,0,1)):e===null?(a.plotLow=f,a.plotHigh=null):(a.plotLow=f,a.plotHigh=b.translate(e,0,1,0,1))});this.chart.polar&&s(this.points,function(b){a.highToXY(b)})},getSegmentPath:function(a){var b,c=[],d=a.length,e=w.prototype.getSegmentPath,f,h;h=this.options;var k=h.step;for(b=HighchartsAdapter.grep(a,
|
||||
function(a){return a.plotLow!==null});d--;)f=a[d],f.plotHigh!==null&&c.push({plotX:f.plotHighX||f.plotX,plotY:f.plotHigh});a=e.call(this,b);if(k)k===!0&&(k="left"),h.step={left:"right",center:"center",right:"left"}[k];c=e.call(this,c);h.step=k;h=[].concat(a,c);this.chart.polar||(c[0]="L");this.areaPath=this.areaPath.concat(a,c);return h},drawDataLabels:function(){var a=this.data,b=a.length,c,d=[],e=w.prototype,f=this.options.dataLabels,h=f.align,k=f.inside,g,j,m=this.chart.inverted;if(f.enabled||
|
||||
this._hasPointLabels){for(c=b;c--;)if(g=a[c])if(j=k?g.plotHigh<g.plotLow:g.plotHigh>g.plotLow,g.y=g.high,g._plotY=g.plotY,g.plotY=g.plotHigh,d[c]=g.dataLabel,g.dataLabel=g.dataLabelUpper,g.below=j,m){if(!h)f.align=j?"right":"left";f.x=f.xHigh}else f.y=f.yHigh;e.drawDataLabels&&e.drawDataLabels.apply(this,arguments);for(c=b;c--;)if(g=a[c])if(j=k?g.plotHigh<g.plotLow:g.plotHigh>g.plotLow,g.dataLabelUpper=g.dataLabel,g.dataLabel=d[c],g.y=g.low,g.plotY=g._plotY,g.below=!j,m){if(!h)f.align=j?"left":"right";
|
||||
f.x=f.xLow}else f.y=f.yLow;e.drawDataLabels&&e.drawDataLabels.apply(this,arguments)}f.align=h},alignDataLabel:function(){i.column.prototype.alignDataLabel.apply(this,arguments)},setStackedPoints:v,getSymbol:v,drawPoints:v});p.areasplinerange=t(p.arearange);i.areasplinerange=u(i.arearange,{type:"areasplinerange",getPointSpline:i.spline.prototype.getPointSpline});(function(){var a=i.column.prototype;p.columnrange=t(p.column,p.arearange,{lineWidth:1,pointRange:null});i.columnrange=u(i.arearange,{type:"columnrange",
|
||||
translate:function(){var b=this,c=b.yAxis,d;a.translate.apply(b);s(b.points,function(a){var f=a.shapeArgs,h=b.options.minPointLength,k;a.tooltipPos=null;a.plotHigh=d=c.translate(a.high,0,1,0,1);a.plotLow=a.plotY;k=d;a=a.plotY-d;Math.abs(a)<h?(h-=a,a+=h,k-=h/2):a<0&&(a*=-1,k-=a);f.height=a;f.y=k})},directTouch:!0,trackerGroups:["group","dataLabelsGroup"],drawGraph:v,crispCol:a.crispCol,pointAttrToOptions:a.pointAttrToOptions,drawPoints:a.drawPoints,drawTracker:a.drawTracker,animate:a.animate,getColumnMetrics:a.getColumnMetrics})})();
|
||||
p.gauge=t(p.line,{dataLabels:{enabled:!0,defer:!1,y:15,borderWidth:1,borderColor:"silver",borderRadius:3,crop:!1,verticalAlign:"top",zIndex:2},dial:{},pivot:{},tooltip:{headerFormat:""},showInLegend:!1});A={type:"gauge",pointClass:u(J,{setState:function(a){this.state=a}}),angular:!0,drawGraph:v,fixedBox:!0,forceDL:!0,trackerGroups:["group","dataLabelsGroup"],translate:function(){var a=this.yAxis,b=this.options,c=a.center;this.generatePoints();s(this.points,function(d){var e=t(b.dial,d.dial),f=B(o(e.radius,
|
||||
80))*c[2]/200,h=B(o(e.baseLength,70))*f/100,k=B(o(e.rearLength,10))*f/100,g=e.baseWidth||3,j=e.topWidth||1,m=b.overshoot,l=a.startAngleRad+a.translate(d.y,null,null,null,!0);m&&typeof m==="number"?(m=m/180*Math.PI,l=Math.max(a.startAngleRad-m,Math.min(a.endAngleRad+m,l))):b.wrap===!1&&(l=Math.max(a.startAngleRad,Math.min(a.endAngleRad,l)));l=l*180/Math.PI;d.shapeType="path";d.shapeArgs={d:e.path||["M",-k,-g/2,"L",h,-g/2,f,-j/2,f,j/2,h,g/2,-k,g/2,"z"],translateX:c[0],translateY:c[1],rotation:l};d.plotX=
|
||||
c[0];d.plotY=c[1]})},drawPoints:function(){var a=this,b=a.yAxis.center,c=a.pivot,d=a.options,e=d.pivot,f=a.chart.renderer;s(a.points,function(b){var c=b.graphic,g=b.shapeArgs,e=g.d,m=t(d.dial,b.dial);c?(c.animate(g),g.d=e):b.graphic=f[b.shapeType](g).attr({stroke:m.borderColor||"none","stroke-width":m.borderWidth||0,fill:m.backgroundColor||"black",rotation:g.rotation}).add(a.group)});c?c.animate({translateX:b[0],translateY:b[1]}):a.pivot=f.circle(0,0,o(e.radius,5)).attr({"stroke-width":e.borderWidth||
|
||||
0,stroke:e.borderColor||"silver",fill:e.backgroundColor||"black"}).translate(b[0],b[1]).add(a.group)},animate:function(a){var b=this;if(!a)s(b.points,function(a){var d=a.graphic;d&&(d.attr({rotation:b.yAxis.startAngleRad*180/Math.PI}),d.animate({rotation:a.shapeArgs.rotation},b.options.animation))}),b.animate=null},render:function(){this.group=this.plotGroup("group","series",this.visible?"visible":"hidden",this.options.zIndex,this.chart.seriesGroup);w.prototype.render.call(this);this.group.clip(this.chart.clipRect)},
|
||||
setData:function(a,b){w.prototype.setData.call(this,a,!1);this.processData();this.generatePoints();o(b,!0)&&this.chart.redraw()},drawTracker:A&&A.drawTrackerPoint};i.gauge=u(i.line,A);p.boxplot=t(p.column,{fillColor:"#FFFFFF",lineWidth:1,medianWidth:2,states:{hover:{brightness:-0.3}},threshold:null,tooltip:{pointFormat:'<span style="color:{point.color}">\u25cf</span> <b> {series.name}</b><br/>Maximum: {point.high}<br/>Upper quartile: {point.q3}<br/>Median: {point.median}<br/>Lower quartile: {point.q1}<br/>Minimum: {point.low}<br/>'},
|
||||
whiskerLength:"50%",whiskerWidth:2});i.boxplot=u(i.column,{type:"boxplot",pointArrayMap:["low","q1","median","q3","high"],toYData:function(a){return[a.low,a.q1,a.median,a.q3,a.high]},pointValKey:"high",pointAttrToOptions:{fill:"fillColor",stroke:"color","stroke-width":"lineWidth"},drawDataLabels:v,translate:function(){var a=this.yAxis,b=this.pointArrayMap;i.column.prototype.translate.apply(this);s(this.points,function(c){s(b,function(b){c[b]!==null&&(c[b+"Plot"]=a.translate(c[b],0,1,0,1))})})},drawPoints:function(){var a=
|
||||
this,b=a.options,c=a.chart.renderer,d,e,f,h,k,g,j,m,l,i,x,n,K,p,t,r,v,u,w,y,B,A,z=a.doQuartiles!==!1,F,D=a.options.whiskerLength;s(a.points,function(q){l=q.graphic;B=q.shapeArgs;x={};p={};r={};A=q.color||a.color;if(q.plotY!==G)if(d=q.pointAttr[q.selected?"selected":""],v=B.width,u=C(B.x),w=u+v,y=E(v/2),e=C(z?q.q1Plot:q.lowPlot),f=C(z?q.q3Plot:q.lowPlot),h=C(q.highPlot),k=C(q.lowPlot),x.stroke=q.stemColor||b.stemColor||A,x["stroke-width"]=o(q.stemWidth,b.stemWidth,b.lineWidth),x.dashstyle=q.stemDashStyle||
|
||||
b.stemDashStyle,p.stroke=q.whiskerColor||b.whiskerColor||A,p["stroke-width"]=o(q.whiskerWidth,b.whiskerWidth,b.lineWidth),r.stroke=q.medianColor||b.medianColor||A,r["stroke-width"]=o(q.medianWidth,b.medianWidth,b.lineWidth),j=x["stroke-width"]%2/2,m=u+y+j,i=["M",m,f,"L",m,h,"M",m,e,"L",m,k],z&&(j=d["stroke-width"]%2/2,m=C(m)+j,e=C(e)+j,f=C(f)+j,u+=j,w+=j,n=["M",u,f,"L",u,e,"L",w,e,"L",w,f,"L",u,f,"z"]),D&&(j=p["stroke-width"]%2/2,h+=j,k+=j,F=/%$/.test(D)?y*parseFloat(D)/100:D/2,K=["M",m-F,h,"L",m+
|
||||
F,h,"M",m-F,k,"L",m+F,k]),j=r["stroke-width"]%2/2,g=E(q.medianPlot)+j,t=["M",u,g,"L",w,g],l)q.stem.animate({d:i}),D&&q.whiskers.animate({d:K}),z&&q.box.animate({d:n}),q.medianShape.animate({d:t});else{q.graphic=l=c.g().add(a.group);q.stem=c.path(i).attr(x).add(l);if(D)q.whiskers=c.path(K).attr(p).add(l);if(z)q.box=c.path(n).attr(d).add(l);q.medianShape=c.path(t).attr(r).add(l)}})},setStackedPoints:v});p.errorbar=t(p.boxplot,{color:"#000000",grouping:!1,linkedTo:":previous",tooltip:{pointFormat:'<span style="color:{point.color}">\u25cf</span> {series.name}: <b>{point.low}</b> - <b>{point.high}</b><br/>'},
|
||||
whiskerWidth:null});i.errorbar=u(i.boxplot,{type:"errorbar",pointArrayMap:["low","high"],toYData:function(a){return[a.low,a.high]},pointValKey:"high",doQuartiles:!1,drawDataLabels:i.arearange?i.arearange.prototype.drawDataLabels:v,getColumnMetrics:function(){return this.linkedParent&&this.linkedParent.columnMetrics||i.column.prototype.getColumnMetrics.call(this)}});p.waterfall=t(p.column,{lineWidth:1,lineColor:"#333",dashStyle:"dot",borderColor:"#333",dataLabels:{inside:!0},states:{hover:{lineWidthPlus:0}}});
|
||||
i.waterfall=u(i.column,{type:"waterfall",upColorProp:"fill",pointValKey:"y",translate:function(){var a=this.options,b=this.yAxis,c,d,e,f,h,k,g,j,m,l=a.threshold,X=a.stacking;i.column.prototype.translate.apply(this);g=j=l;d=this.points;for(c=0,a=d.length;c<a;c++){e=d[c];k=this.processedYData[c];f=e.shapeArgs;m=(h=X&&b.stacks[(this.negStacks&&k<l?"-":"")+this.stackKey])?h[e.x].points[this.index+","+c]:[0,k];if(e.isSum)e.y=k;else if(e.isIntermediateSum)e.y=k-j;h=O(g,g+e.y)+m[0];f.y=b.translate(h,0,1);
|
||||
if(e.isSum)f.y=b.translate(m[1],0,1),f.height=Math.min(b.translate(m[0],0,1),b.len)-f.y;else if(e.isIntermediateSum)f.y=b.translate(m[1],0,1),f.height=Math.min(b.translate(j,0,1),b.len)-f.y,j=m[1];else{if(g!==0)f.height=k>0?b.translate(g,0,1)-f.y:b.translate(g,0,1)-b.translate(g-k,0,1);g+=k}f.height<0&&(f.y+=f.height,f.height*=-1);e.plotY=f.y=E(f.y)-this.borderWidth%2/2;f.height=O(E(f.height),0.001);e.yBottom=f.y+f.height;f=e.plotY+(e.negative?f.height:0);this.chart.inverted?e.tooltipPos[0]=b.len-
|
||||
f:e.tooltipPos[1]=f}},processData:function(a){var b=this.yData,c=this.options.data,d,e=b.length,f,h,k,g,j,m;h=f=k=g=this.options.threshold||0;for(m=0;m<e;m++)j=b[m],d=c&&c[m]?c[m]:{},j==="sum"||d.isSum?b[m]=h:j==="intermediateSum"||d.isIntermediateSum?b[m]=f:(h+=j,f+=j),k=Math.min(h,k),g=Math.max(h,g);w.prototype.processData.call(this,a);this.dataMin=k;this.dataMax=g},toYData:function(a){if(a.isSum)return a.x===0?null:"sum";else if(a.isIntermediateSum)return a.x===0?null:"intermediateSum";return a.y},
|
||||
getAttribs:function(){i.column.prototype.getAttribs.apply(this,arguments);var a=this,b=a.options,c=b.states,d=b.upColor||a.color,b=n.Color(d).brighten(0.1).get(),e=t(a.pointAttr),f=a.upColorProp;e[""][f]=d;e.hover[f]=c.hover.upColor||b;e.select[f]=c.select.upColor||d;s(a.points,function(f){if(!f.options.color)f.y>0?(f.pointAttr=e,f.color=d):f.pointAttr=a.pointAttr})},getGraphPath:function(){var a=this.data,b=a.length,c=E(this.options.lineWidth+this.borderWidth)%2/2,d=[],e,f,h;for(h=1;h<b;h++)f=a[h].shapeArgs,
|
||||
e=a[h-1].shapeArgs,f=["M",e.x+e.width,e.y+c,"L",f.x,e.y+c],a[h-1].y<0&&(f[2]+=e.height,f[5]+=e.height),d=d.concat(f);return d},getExtremes:v,drawGraph:w.prototype.drawGraph});p.polygon=t(p.scatter,{marker:{enabled:!1}});i.polygon=u(i.scatter,{type:"polygon",fillGraph:!0,getSegmentPath:function(a){return w.prototype.getSegmentPath.call(this,a).concat("z")},drawGraph:w.prototype.drawGraph,drawLegendSymbol:n.LegendSymbolMixin.drawRectangle});p.bubble=t(p.scatter,{dataLabels:{formatter:function(){return this.point.z},
|
||||
inside:!0,verticalAlign:"middle"},marker:{lineColor:null,lineWidth:1},minSize:8,maxSize:"20%",softThreshold:!1,states:{hover:{halo:{size:5}}},tooltip:{pointFormat:"({point.x}, {point.y}), Size: {point.z}"},turboThreshold:0,zThreshold:0,zoneAxis:"z"});A=u(J,{haloPath:function(){return J.prototype.haloPath.call(this,this.shapeArgs.r+this.series.options.states.hover.halo.size)},ttBelow:!1});i.bubble=u(i.scatter,{type:"bubble",pointClass:A,pointArrayMap:["y","z"],parallelArrays:["x","y","z"],trackerGroups:["group",
|
||||
"dataLabelsGroup"],bubblePadding:!0,zoneAxis:"z",pointAttrToOptions:{stroke:"lineColor","stroke-width":"lineWidth",fill:"fillColor"},applyOpacity:function(a){var b=this.options.marker,c=o(b.fillOpacity,0.5),a=a||b.fillColor||this.color;c!==1&&(a=V(a).setOpacity(c).get("rgba"));return a},convertAttribs:function(){var a=w.prototype.convertAttribs.apply(this,arguments);a.fill=this.applyOpacity(a.fill);return a},getRadii:function(a,b,c,d){var e,f,h,k=this.zData,g=[],j=this.options,m=j.sizeBy!=="width",
|
||||
l=j.zThreshold,i=b-a;for(f=0,e=k.length;f<e;f++)h=k[f],j.sizeByAbsoluteValue&&(h=Math.abs(h-l),b=Math.max(b-l,Math.abs(a-l)),a=0),h===null?h=null:h<a?h=c/2-1:(h=i>0?(h-a)/i:0.5,m&&h>=0&&(h=Math.sqrt(h)),h=y.ceil(c+h*(d-c))/2),g.push(h);this.radii=g},animate:function(a){var b=this.options.animation;if(!a)s(this.points,function(a){var d=a.graphic,a=a.shapeArgs;d&&a&&(d.attr("r",1),d.animate({r:a.r},b))}),this.animate=null},translate:function(){var a,b=this.data,c,d,e=this.radii;i.scatter.prototype.translate.call(this);
|
||||
for(a=b.length;a--;)c=b[a],d=e?e[a]:0,typeof d==="number"&&d>=this.minPxSize/2?(c.shapeType="circle",c.shapeArgs={x:c.plotX,y:c.plotY,r:d},c.dlBox={x:c.plotX-d,y:c.plotY-d,width:2*d,height:2*d}):c.shapeArgs=c.plotY=c.dlBox=G},drawLegendSymbol:function(a,b){var c=B(a.itemStyle.fontSize)/2;b.legendSymbol=this.chart.renderer.circle(c,a.baseline-c,c).attr({zIndex:3}).add(b.legendGroup);b.legendSymbol.isMarker=!0},drawPoints:i.column.prototype.drawPoints,alignDataLabel:i.column.prototype.alignDataLabel,
|
||||
buildKDTree:v,applyZones:v});N.prototype.beforePadding=function(){var a=this,b=this.len,c=this.chart,d=0,e=b,f=this.isXAxis,h=f?"xData":"yData",k=this.min,g={},j=y.min(c.plotWidth,c.plotHeight),m=Number.MAX_VALUE,l=-Number.MAX_VALUE,i=this.max-k,x=b/i,n=[];s(this.series,function(b){var h=b.options;if(b.bubblePadding&&(b.visible||!c.options.chart.ignoreHiddenSeries))if(a.allowZoomOutside=!0,n.push(b),f)s(["minSize","maxSize"],function(a){var b=h[a],f=/%$/.test(b),b=B(b);g[a]=f?j*b/100:b}),b.minPxSize=
|
||||
g.minSize,b.maxPxSize=g.maxSize,b=b.zData,b.length&&(m=o(h.zMin,y.min(m,y.max(Q(b),h.displayNegative===!1?h.zThreshold:-Number.MAX_VALUE))),l=o(h.zMax,y.max(l,R(b))))});s(n,function(a){var b=a[h],c=b.length,g;f&&a.getRadii(m,l,a.minPxSize,a.maxPxSize);if(i>0)for(;c--;)typeof b[c]==="number"&&(g=a.radii[c],d=Math.min((b[c]-k)*x-g,d),e=Math.max((b[c]-k)*x+g,e))});n.length&&i>0&&!this.isLog&&(e-=b,x*=(b+d-e)/b,s([["min","userMin",d],["max","userMax",e]],function(b){o(a.options[b[0]],a[b[1]])===G&&(a[b[0]]+=
|
||||
b[2]/x)}))};(function(){function a(a,b,c){a.call(this,b,c);if(this.chart.polar)this.closeSegment=function(a){var b=this.xAxis.center;a.push("L",b[0],b[1])},this.closedStacks=!0}function b(a,b){var c=this.chart,g=this.options.animation,d=this.group,e=this.markerGroup,l=this.xAxis.center,i=c.plotLeft,n=c.plotTop;if(c.polar){if(c.renderer.isSVG)g===!0&&(g={}),b?(c={translateX:l[0]+i,translateY:l[1]+n,scaleX:0.001,scaleY:0.001},d.attr(c),e&&e.attr(c)):(c={translateX:i,translateY:n,scaleX:1,scaleY:1},
|
||||
d.animate(c,g),e&&e.animate(c,g),this.animate=null)}else a.call(this,b)}var c=w.prototype,d=T.prototype,e;c.searchPointByAngle=function(a){var b=this.chart,c=this.xAxis.pane.center;return this.searchKDTree({clientX:180+Math.atan2(a.chartX-c[0]-b.plotLeft,a.chartY-c[1]-b.plotTop)*(-180/Math.PI)})};r(c,"buildKDTree",function(a){if(this.chart.polar)this.kdByAngle?this.searchPoint=this.searchPointByAngle:this.kdDimensions=2;a.apply(this)});c.toXY=function(a){var b,c=this.chart,g=a.plotX;b=a.plotY;a.rectPlotX=
|
||||
g;a.rectPlotY=b;b=this.xAxis.postTranslate(a.plotX,this.yAxis.len-b);a.plotX=a.polarPlotX=b.x-c.plotLeft;a.plotY=a.polarPlotY=b.y-c.plotTop;this.kdByAngle?(c=(g/Math.PI*180+this.xAxis.pane.options.startAngle)%360,c<0&&(c+=360),a.clientX=c):a.clientX=a.plotX};i.area&&r(i.area.prototype,"init",a);i.areaspline&&r(i.areaspline.prototype,"init",a);i.spline&&r(i.spline.prototype,"getPointSpline",function(a,b,c,g){var d,e,l,i,n,p,o;if(this.chart.polar){d=c.plotX;e=c.plotY;a=b[g-1];l=b[g+1];this.connectEnds&&
|
||||
(a||(a=b[b.length-2]),l||(l=b[1]));if(a&&l)i=a.plotX,n=a.plotY,b=l.plotX,p=l.plotY,i=(1.5*d+i)/2.5,n=(1.5*e+n)/2.5,l=(1.5*d+b)/2.5,o=(1.5*e+p)/2.5,b=Math.sqrt(Math.pow(i-d,2)+Math.pow(n-e,2)),p=Math.sqrt(Math.pow(l-d,2)+Math.pow(o-e,2)),i=Math.atan2(n-e,i-d),n=Math.atan2(o-e,l-d),o=Math.PI/2+(i+n)/2,Math.abs(i-o)>Math.PI/2&&(o-=Math.PI),i=d+Math.cos(o)*b,n=e+Math.sin(o)*b,l=d+Math.cos(Math.PI+o)*p,o=e+Math.sin(Math.PI+o)*p,c.rightContX=l,c.rightContY=o;g?(c=["C",a.rightContX||a.plotX,a.rightContY||
|
||||
a.plotY,i||d,n||e,d,e],a.rightContX=a.rightContY=null):c=["M",d,e]}else c=a.call(this,b,c,g);return c});r(c,"translate",function(a){var b=this.chart;a.call(this);if(b.polar&&(this.kdByAngle=b.tooltip&&b.tooltip.shared,!this.preventPostTranslate)){a=this.points;for(b=a.length;b--;)this.toXY(a[b])}});r(c,"getSegmentPath",function(a,b){var c=this.points;if(this.chart.polar&&this.options.connectEnds!==!1&&b[b.length-1]===c[c.length-1]&&c[0].y!==null)this.connectEnds=!0,b=[].concat(b,[c[0]]);return a.call(this,
|
||||
b)});r(c,"animate",b);if(i.column)e=i.column.prototype,r(e,"animate",b),r(e,"translate",function(a){var b=this.xAxis,c=this.yAxis.len,d=b.center,e=b.startAngleRad,i=this.chart.renderer,l,n;this.preventPostTranslate=!0;a.call(this);if(b.isRadial){b=this.points;for(n=b.length;n--;)l=b[n],a=l.barX+e,l.shapeType="path",l.shapeArgs={d:i.symbols.arc(d[0],d[1],c-l.plotY,null,{start:a,end:a+l.pointWidth,innerR:c-o(l.yBottom,c)})},this.toXY(l),l.tooltipPos=[l.plotX,l.plotY],l.ttBelow=l.plotY>d[1]}}),r(e,"alignDataLabel",
|
||||
function(a,b,d,e,j,i){if(this.chart.polar){a=b.rectPlotX/Math.PI*180;if(e.align===null)e.align=a>20&&a<160?"left":a>200&&a<340?"right":"center";if(e.verticalAlign===null)e.verticalAlign=a<45||a>315?"bottom":a>135&&a<225?"top":"middle";c.alignDataLabel.call(this,b,d,e,j,i)}else a.call(this,b,d,e,j,i)});r(d,"getCoordinates",function(a,b){var c=this.chart,d={xAxis:[],yAxis:[]};c.polar?s(c.axes,function(a){var e=a.isXAxis,f=a.center,i=b.chartX-f[0]-c.plotLeft,f=b.chartY-f[1]-c.plotTop;d[e?"xAxis":"yAxis"].push({axis:a,
|
||||
value:a.translate(e?Math.PI-Math.atan2(i,f):Math.sqrt(Math.pow(i,2)+Math.pow(f,2)),!0)})}):d=a.call(this,b);return d})})()})(Highcharts);
|
||||
2650
lib/highcharts/js/highcharts-more.src.js
Normal file
2650
lib/highcharts/js/highcharts-more.src.js
Normal file
File diff suppressed because it is too large
Load Diff
331
lib/highcharts/js/highcharts.js
Normal file
331
lib/highcharts/js/highcharts.js
Normal file
@ -0,0 +1,331 @@
|
||||
/*
|
||||
Highcharts JS v4.1.9 (2015-10-07)
|
||||
|
||||
(c) 2009-2014 Torstein Honsi
|
||||
|
||||
License: www.highcharts.com/license
|
||||
*/
|
||||
(function(){function D(){var a,b=arguments,c,d={},e=function(a,b){var c,d;typeof a!=="object"&&(a={});for(d in b)b.hasOwnProperty(d)&&(c=b[d],a[d]=c&&typeof c==="object"&&Object.prototype.toString.call(c)!=="[object Array]"&&d!=="renderTo"&&typeof c.nodeType!=="number"?e(a[d]||{},c):b[d]);return a};b[0]===!0&&(d=b[1],b=Array.prototype.slice.call(b,2));c=b.length;for(a=0;a<c;a++)d=e(d,b[a]);return d}function G(a,b){return parseInt(a,b||10)}function Ba(a){return typeof a==="string"}function da(a){return a&&
|
||||
typeof a==="object"}function Ga(a){return Object.prototype.toString.call(a)==="[object Array]"}function qa(a){return typeof a==="number"}function Ca(a){return V.log(a)/V.LN10}function ia(a){return V.pow(10,a)}function ja(a,b){for(var c=a.length;c--;)if(a[c]===b){a.splice(c,1);break}}function q(a){return a!==x&&a!==null}function K(a,b,c){var d,e;if(Ba(b))q(c)?a.setAttribute(b,c):a&&a.getAttribute&&(e=a.getAttribute(b));else if(q(b)&&da(b))for(d in b)a.setAttribute(d,b[d]);return e}function ra(a){return Ga(a)?
|
||||
a:[a]}function M(a,b){if(sa&&!ca&&b&&b.opacity!==x)b.filter="alpha(opacity="+b.opacity*100+")";t(a.style,b)}function $(a,b,c,d,e){a=C.createElement(a);b&&t(a,b);e&&M(a,{padding:0,border:P,margin:0});c&&M(a,c);d&&d.appendChild(a);return a}function ka(a,b){var c=function(){return x};c.prototype=new a;t(c.prototype,b);return c}function Ha(a,b){return Array((b||2)+1-String(a).length).join(0)+a}function Wa(a){return(db&&db(a)||nb||0)*6E4}function Ia(a,b){for(var c="{",d=!1,e,f,g,h,i,j=[];(c=a.indexOf(c))!==
|
||||
-1;){e=a.slice(0,c);if(d){f=e.split(":");g=f.shift().split(".");i=g.length;e=b;for(h=0;h<i;h++)e=e[g[h]];if(f.length)f=f.join(":"),g=/\.([0-9])/,h=S.lang,i=void 0,/f$/.test(f)?(i=(i=f.match(g))?i[1]:-1,e!==null&&(e=B.numberFormat(e,i,h.decimalPoint,f.indexOf(",")>-1?h.thousandsSep:""))):e=Na(f,e)}j.push(e);a=a.slice(c+1);c=(d=!d)?"}":"{"}j.push(a);return j.join("")}function ob(a){return V.pow(10,T(V.log(a)/V.LN10))}function pb(a,b,c,d,e){var f,g=a,c=p(c,1);f=a/c;b||(b=[1,2,2.5,5,10],d===!1&&(c===
|
||||
1?b=[1,2,5,10]:c<=0.1&&(b=[1/c])));for(d=0;d<b.length;d++)if(g=b[d],e&&g*c>=a||!e&&f<=(b[d]+(b[d+1]||b[d]))/2)break;g*=c;return g}function qb(a,b){var c=a.length,d,e;for(e=0;e<c;e++)a[e].ss_i=e;a.sort(function(a,c){d=b(a,c);return d===0?a.ss_i-c.ss_i:d});for(e=0;e<c;e++)delete a[e].ss_i}function Oa(a){for(var b=a.length,c=a[0];b--;)a[b]<c&&(c=a[b]);return c}function Da(a){for(var b=a.length,c=a[0];b--;)a[b]>c&&(c=a[b]);return c}function Pa(a,b){for(var c in a)a[c]&&a[c]!==b&&a[c].destroy&&a[c].destroy(),
|
||||
delete a[c]}function Qa(a){eb||(eb=$(Ja));a&&eb.appendChild(a);eb.innerHTML=""}function la(a,b){var c="Highcharts error #"+a+": www.highcharts.com/errors/"+a;if(b)throw c;L.console&&console.log(c)}function ea(a,b){return parseFloat(a.toPrecision(b||14))}function Ra(a,b){b.renderer.globalAnimation=p(a,b.animation)}function Cb(){var a=S.global,b=a.useUTC,c=b?"getUTC":"get",d=b?"setUTC":"set";ya=a.Date||window.Date;nb=b&&a.timezoneOffset;db=b&&a.getTimezoneOffset;fb=function(a,c,d,h,i,j){var k;b?(k=
|
||||
ya.UTC.apply(0,arguments),k+=Wa(k)):k=(new ya(a,c,p(d,1),p(h,0),p(i,0),p(j,0))).getTime();return k};rb=c+"Minutes";sb=c+"Hours";tb=c+"Day";Xa=c+"Date";Ya=c+"Month";Za=c+"FullYear";Db=d+"Milliseconds";Eb=d+"Seconds";Fb=d+"Minutes";Gb=d+"Hours";ub=d+"Date";vb=d+"Month";wb=d+"FullYear"}function Q(){}function Sa(a,b,c,d){this.axis=a;this.pos=b;this.type=c||"";this.isNew=!0;!c&&!d&&this.addLabel()}function Hb(a,b,c,d,e){var f=a.chart.inverted;this.axis=a;this.isNegative=c;this.options=b;this.x=d;this.total=
|
||||
null;this.points={};this.stack=e;this.alignOptions={align:b.align||(f?c?"left":"right":"center"),verticalAlign:b.verticalAlign||(f?"middle":c?"bottom":"top"),y:p(b.y,f?4:c?14:-6),x:p(b.x,f?c?-6:6:0)};this.textAlign=b.textAlign||(f?c?"right":"left":"center")}var x,C=document,L=window,V=Math,w=V.round,T=V.floor,ta=V.ceil,s=V.max,z=V.min,O=V.abs,W=V.cos,aa=V.sin,ma=V.PI,ga=ma*2/360,za=navigator.userAgent,Ib=L.opera,sa=/(msie|trident|edge)/i.test(za)&&!Ib,gb=C.documentMode===8,hb=!sa&&/AppleWebKit/.test(za),
|
||||
Ka=/Firefox/.test(za),Jb=/(Mobile|Android|Windows Phone)/.test(za),Ea="http://www.w3.org/2000/svg",ca=!!C.createElementNS&&!!C.createElementNS(Ea,"svg").createSVGRect,Nb=Ka&&parseInt(za.split("Firefox/")[1],10)<4,fa=!ca&&!sa&&!!C.createElement("canvas").getContext,$a,ab,Kb={},xb=0,eb,S,Na,yb,F,ua=function(){return x},X=[],bb=0,Ja="div",P="none",Ob=/^[0-9]+$/,ib=["plotTop","marginRight","marginBottom","plotLeft"],Pb="stroke-width",ya,fb,nb,db,rb,sb,tb,Xa,Ya,Za,Db,Eb,Fb,Gb,ub,vb,wb,N={},B;B=L.Highcharts=
|
||||
L.Highcharts?la(16,!0):{};B.seriesTypes=N;var t=B.extend=function(a,b){var c;a||(a={});for(c in b)a[c]=b[c];return a},p=B.pick=function(){var a=arguments,b,c,d=a.length;for(b=0;b<d;b++)if(c=a[b],c!==x&&c!==null)return c},Ta=B.wrap=function(a,b,c){var d=a[b];a[b]=function(){var a=Array.prototype.slice.call(arguments);a.unshift(d);return c.apply(this,a)}};Na=function(a,b,c){if(!q(b)||isNaN(b))return S.lang.invalidDate||"";var a=p(a,"%Y-%m-%d %H:%M:%S"),d=new ya(b-Wa(b)),e,f=d[sb](),g=d[tb](),h=d[Xa](),
|
||||
i=d[Ya](),j=d[Za](),k=S.lang,m=k.weekdays,d=t({a:m[g].substr(0,3),A:m[g],d:Ha(h),e:h,w:g,b:k.shortMonths[i],B:k.months[i],m:Ha(i+1),y:j.toString().substr(2,2),Y:j,H:Ha(f),k:f,I:Ha(f%12||12),l:f%12||12,M:Ha(d[rb]()),p:f<12?"AM":"PM",P:f<12?"am":"pm",S:Ha(d.getSeconds()),L:Ha(w(b%1E3),3)},B.dateFormats);for(e in d)for(;a.indexOf("%"+e)!==-1;)a=a.replace("%"+e,typeof d[e]==="function"?d[e](b):d[e]);return c?a.substr(0,1).toUpperCase()+a.substr(1):a};F={millisecond:1,second:1E3,minute:6E4,hour:36E5,day:864E5,
|
||||
week:6048E5,month:24192E5,year:314496E5};B.numberFormat=function(a,b,c,d){var e=S.lang,a=+a||0,f=b===-1?z((a.toString().split(".")[1]||"").length,20):isNaN(b=O(b))?2:b,b=c===void 0?e.decimalPoint:c,d=d===void 0?e.thousandsSep:d,e=a<0?"-":"",c=String(G(a=O(a).toFixed(f))),g=c.length>3?c.length%3:0;return e+(g?c.substr(0,g)+d:"")+c.substr(g).replace(/(\d{3})(?=\d)/g,"$1"+d)+(f?b+O(a-c).toFixed(f).slice(2):"")};yb={init:function(a,b,c){var b=b||"",d=a.shift,e=b.indexOf("C")>-1,f=e?7:3,g,b=b.split(" "),
|
||||
c=[].concat(c),h,i,j=function(a){for(g=a.length;g--;)a[g]==="M"&&a.splice(g+1,0,a[g+1],a[g+2],a[g+1],a[g+2])};e&&(j(b),j(c));a.isArea&&(h=b.splice(b.length-6,6),i=c.splice(c.length-6,6));if(d<=c.length/f&&b.length===c.length)for(;d--;)c=[].concat(c).splice(0,f).concat(c);a.shift=0;if(b.length)for(a=c.length;b.length<a;)d=[].concat(b).splice(b.length-f,f),e&&(d[f-6]=d[f-2],d[f-5]=d[f-1]),b=b.concat(d);h&&(b=b.concat(h),c=c.concat(i));return[b,c]},step:function(a,b,c,d){var e=[],f=a.length;if(c===1)e=
|
||||
d;else if(f===b.length&&c<1)for(;f--;)d=parseFloat(a[f]),e[f]=isNaN(d)?a[f]:c*parseFloat(b[f]-d)+d;else e=b;return e}};(function(a){L.HighchartsAdapter=L.HighchartsAdapter||a&&{init:function(b){var c=a.fx;a.extend(a.easing,{easeOutQuad:function(a,b,c,g,h){return-g*(b/=h)*(b-2)+c}});a.each(["cur","_default","width","height","opacity"],function(b,e){var f=c.step,g;e==="cur"?f=c.prototype:e==="_default"&&a.Tween&&(f=a.Tween.propHooks[e],e="set");(g=f[e])&&(f[e]=function(a){var c,a=b?a:this;if(a.prop!==
|
||||
"align")return c=a.elem,c.attr?c.attr(a.prop,e==="cur"?x:a.now):g.apply(this,arguments)})});Ta(a.cssHooks.opacity,"get",function(a,b,c){return b.attr?b.opacity||0:a.call(this,b,c)});this.addAnimSetter("d",function(a){var c=a.elem,f;if(!a.started)f=b.init(c,c.d,c.toD),a.start=f[0],a.end=f[1],a.started=!0;c.attr("d",b.step(a.start,a.end,a.pos,c.toD))});this.each=Array.prototype.forEach?function(a,b){return Array.prototype.forEach.call(a,b)}:function(a,b){var c,g=a.length;for(c=0;c<g;c++)if(b.call(a[c],
|
||||
a[c],c,a)===!1)return c};a.fn.highcharts=function(){var a="Chart",b=arguments,c,g;if(this[0]){Ba(b[0])&&(a=b[0],b=Array.prototype.slice.call(b,1));c=b[0];if(c!==x)c.chart=c.chart||{},c.chart.renderTo=this[0],new B[a](c,b[1]),g=this;c===x&&(g=X[K(this[0],"data-highcharts-chart")])}return g}},addAnimSetter:function(b,c){a.Tween?a.Tween.propHooks[b]={set:c}:a.fx.step[b]=c},getScript:a.getScript,inArray:a.inArray,adapterRun:function(b,c){return a(b)[c]()},grep:a.grep,map:function(a,c){for(var d=[],e=
|
||||
0,f=a.length;e<f;e++)d[e]=c.call(a[e],a[e],e,a);return d},offset:function(b){return a(b).offset()},addEvent:function(b,c,d){a(b).bind(c,d)},removeEvent:function(b,c,d){var e=C.removeEventListener?"removeEventListener":"detachEvent";C[e]&&b&&!b[e]&&(b[e]=function(){});a(b).unbind(c,d)},fireEvent:function(b,c,d,e){var f=a.Event(c),g="detached"+c,h;!sa&&d&&(delete d.layerX,delete d.layerY,delete d.returnValue);t(f,d);b[c]&&(b[g]=b[c],b[c]=null);a.each(["preventDefault","stopPropagation"],function(a,
|
||||
b){var c=f[b];f[b]=function(){try{c.call(f)}catch(a){b==="preventDefault"&&(h=!0)}}});a(b).trigger(f);b[g]&&(b[c]=b[g],b[g]=null);e&&!f.isDefaultPrevented()&&!h&&e(f)},washMouseEvent:function(a){var c=a.originalEvent||a;if(c.pageX===x)c.pageX=a.pageX,c.pageY=a.pageY;return c},animate:function(b,c,d){var e=a(b);if(!b.style)b.style={};if(c.d)b.toD=c.d,c.d=1;e.stop();c.opacity!==x&&b.attr&&(c.opacity+="px");b.hasAnim=1;e.animate(c,d)},stop:function(b){b.hasAnim&&a(b).stop()}}})(L.jQuery);var U=L.HighchartsAdapter,
|
||||
E=U||{};U&&U.init.call(U,yb);var jb=E.adapterRun,Qb=E.getScript,La=E.inArray,o=B.each=E.each,kb=E.grep,Rb=E.offset,Ua=E.map,I=E.addEvent,Y=E.removeEvent,J=E.fireEvent,Sb=E.washMouseEvent,lb=E.animate,cb=E.stop;S={colors:"#7cb5ec,#434348,#90ed7d,#f7a35c,#8085e9,#f15c80,#e4d354,#2b908f,#f45b5b,#91e8e1".split(","),symbols:["circle","diamond","square","triangle","triangle-down"],lang:{loading:"Loading...",months:"January,February,March,April,May,June,July,August,September,October,November,December".split(","),
|
||||
shortMonths:"Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec".split(","),weekdays:"Sunday,Monday,Tuesday,Wednesday,Thursday,Friday,Saturday".split(","),decimalPoint:".",numericSymbols:"k,M,G,T,P,E".split(","),resetZoom:"Reset zoom",resetZoomTitle:"Reset zoom level 1:1",thousandsSep:" "},global:{useUTC:!0,canvasToolsURL:"http://code.highcharts.com/4.1.9/modules/canvas-tools.js",VMLRadialGradientURL:"http://code.highcharts.com/4.1.9/gfx/vml-radial-gradient.png"},chart:{borderColor:"#4572A7",borderRadius:0,
|
||||
defaultSeriesType:"line",ignoreHiddenSeries:!0,spacing:[10,10,15,10],backgroundColor:"#FFFFFF",plotBorderColor:"#C0C0C0",resetZoomButton:{theme:{zIndex:20},position:{align:"right",x:-10,y:10}}},title:{text:"Chart title",align:"center",margin:15,style:{color:"#333333",fontSize:"18px"}},subtitle:{text:"",align:"center",style:{color:"#555555"}},plotOptions:{line:{allowPointSelect:!1,showCheckbox:!1,animation:{duration:1E3},events:{},lineWidth:2,marker:{lineWidth:0,radius:4,lineColor:"#FFFFFF",states:{hover:{enabled:!0,
|
||||
lineWidthPlus:1,radiusPlus:2},select:{fillColor:"#FFFFFF",lineColor:"#000000",lineWidth:2}}},point:{events:{}},dataLabels:{align:"center",formatter:function(){return this.y===null?"":B.numberFormat(this.y,-1)},style:{color:"contrast",fontSize:"11px",fontWeight:"bold",textShadow:"0 0 6px contrast, 0 0 3px contrast"},verticalAlign:"bottom",x:0,y:0,padding:5},cropThreshold:300,pointRange:0,softThreshold:!0,states:{hover:{lineWidthPlus:1,marker:{},halo:{size:10,opacity:0.25}},select:{marker:{}}},stickyTracking:!0,
|
||||
turboThreshold:1E3}},labels:{style:{position:"absolute",color:"#3E576F"}},legend:{enabled:!0,align:"center",layout:"horizontal",labelFormatter:function(){return this.name},borderColor:"#909090",borderRadius:0,navigation:{activeColor:"#274b6d",inactiveColor:"#CCC"},shadow:!1,itemStyle:{color:"#333333",fontSize:"12px",fontWeight:"bold"},itemHoverStyle:{color:"#000"},itemHiddenStyle:{color:"#CCC"},itemCheckboxStyle:{position:"absolute",width:"13px",height:"13px"},symbolPadding:5,verticalAlign:"bottom",
|
||||
x:0,y:0,title:{style:{fontWeight:"bold"}}},loading:{labelStyle:{fontWeight:"bold",position:"relative",top:"45%"},style:{position:"absolute",backgroundColor:"white",opacity:0.5,textAlign:"center"}},tooltip:{enabled:!0,animation:ca,backgroundColor:"rgba(249, 249, 249, .85)",borderWidth:1,borderRadius:3,dateTimeLabelFormats:{millisecond:"%A, %b %e, %H:%M:%S.%L",second:"%A, %b %e, %H:%M:%S",minute:"%A, %b %e, %H:%M",hour:"%A, %b %e, %H:%M",day:"%A, %b %e, %Y",week:"Week from %A, %b %e, %Y",month:"%B %Y",
|
||||
year:"%Y"},footerFormat:"",headerFormat:'<span style="font-size: 10px">{point.key}</span><br/>',pointFormat:'<span style="color:{point.color}">\u25cf</span> {series.name}: <b>{point.y}</b><br/>',shadow:!0,snap:Jb?25:10,style:{color:"#333333",cursor:"default",fontSize:"12px",padding:"8px",pointerEvents:"none",whiteSpace:"nowrap"}},credits:{enabled:!0,text:"Highcharts.com",href:"http://www.highcharts.com",position:{align:"right",x:-10,verticalAlign:"bottom",y:-5},style:{cursor:"pointer",color:"#909090",
|
||||
fontSize:"9px"}}};var ba=S.plotOptions,U=ba.line;Cb();var Tb=/rgba\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]?(?:\.[0-9]+)?)\s*\)/,Ub=/#([a-fA-F0-9]{2})([a-fA-F0-9]{2})([a-fA-F0-9]{2})/,Vb=/rgb\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*\)/,na=function(a){var b=[],c,d;(function(a){a&&a.stops?d=Ua(a.stops,function(a){return na(a[1])}):(c=Tb.exec(a))?b=[G(c[1]),G(c[2]),G(c[3]),parseFloat(c[4],10)]:(c=Ub.exec(a))?b=[G(c[1],16),G(c[2],16),G(c[3],16),1]:(c=Vb.exec(a))&&
|
||||
(b=[G(c[1]),G(c[2]),G(c[3]),1])})(a);return{get:function(c){var f;d?(f=D(a),f.stops=[].concat(f.stops),o(d,function(a,b){f.stops[b]=[f.stops[b][0],a.get(c)]})):f=b&&!isNaN(b[0])?c==="rgb"?"rgb("+b[0]+","+b[1]+","+b[2]+")":c==="a"?b[3]:"rgba("+b.join(",")+")":a;return f},brighten:function(a){if(d)o(d,function(b){b.brighten(a)});else if(qa(a)&&a!==0){var c;for(c=0;c<3;c++)b[c]+=G(a*255),b[c]<0&&(b[c]=0),b[c]>255&&(b[c]=255)}return this},rgba:b,setOpacity:function(a){b[3]=a;return this},raw:a}};Q.prototype=
|
||||
{opacity:1,textProps:"fontSize,fontWeight,fontFamily,fontStyle,color,lineHeight,width,textDecoration,textOverflow,textShadow".split(","),init:function(a,b){this.element=b==="span"?$(b):C.createElementNS(Ea,b);this.renderer=a},animate:function(a,b,c){b=p(b,this.renderer.globalAnimation,!0);cb(this);if(b){b=D(b,{});if(c)b.complete=c;lb(this,a,b)}else this.attr(a,null,c);return this},colorGradient:function(a,b,c){var d=this.renderer,e,f,g,h,i,j,k,m,n,l,u,r=[];a.linearGradient?f="linearGradient":a.radialGradient&&
|
||||
(f="radialGradient");if(f){g=a[f];i=d.gradients;k=a.stops;l=c.radialReference;Ga(g)&&(a[f]=g={x1:g[0],y1:g[1],x2:g[2],y2:g[3],gradientUnits:"userSpaceOnUse"});f==="radialGradient"&&l&&!q(g.gradientUnits)&&(h=g,g=D(g,d.getRadialAttr(l,h),{gradientUnits:"userSpaceOnUse"}));for(u in g)u!=="id"&&r.push(u,g[u]);for(u in k)r.push(k[u]);r=r.join(",");i[r]?a=i[r].attr("id"):(g.id=a="highcharts-"+xb++,i[r]=j=d.createElement(f).attr(g).add(d.defs),j.radAttr=h,j.stops=[],o(k,function(a){a[1].indexOf("rgba")===
|
||||
0?(e=na(a[1]),m=e.get("rgb"),n=e.get("a")):(m=a[1],n=1);a=d.createElement("stop").attr({offset:a[0],"stop-color":m,"stop-opacity":n}).add(j);j.stops.push(a)}));c.setAttribute(b,"url("+d.url+"#"+a+")");c.gradient=r}},applyTextShadow:function(a){var b=this.element,c,d=a.indexOf("contrast")!==-1,e={},f=this.renderer.forExport,g=f||b.style.textShadow!==x&&!sa;if(d)e.textShadow=a=a.replace(/contrast/g,this.renderer.getContrast(b.style.fill));if(hb||f)e.textRendering="geometricPrecision";g?this.css(e):
|
||||
(this.fakeTS=!0,this.ySetter=this.xSetter,c=[].slice.call(b.getElementsByTagName("tspan")),o(a.split(/\s?,\s?/g),function(a){var d=b.firstChild,e,f,a=a.split(" ");e=a[a.length-1];(f=a[a.length-2])&&o(c,function(a,c){var g;c===0&&(a.setAttribute("x",b.getAttribute("x")),c=b.getAttribute("y"),a.setAttribute("y",c||0),c===null&&b.setAttribute("y",0));g=a.cloneNode(1);K(g,{"class":"highcharts-text-shadow",fill:e,stroke:e,"stroke-opacity":1/s(G(f),3),"stroke-width":f,"stroke-linejoin":"round"});b.insertBefore(g,
|
||||
d)})}))},attr:function(a,b,c){var d,e=this.element,f,g=this,h;typeof a==="string"&&b!==x&&(d=a,a={},a[d]=b);if(typeof a==="string")g=(this[a+"Getter"]||this._defaultGetter).call(this,a,e);else{for(d in a){b=a[d];h=!1;this.symbolName&&/^(x|y|width|height|r|start|end|innerR|anchorX|anchorY)/.test(d)&&(f||(this.symbolAttr(a),f=!0),h=!0);if(this.rotation&&(d==="x"||d==="y"))this.doTransform=!0;h||(this[d+"Setter"]||this._defaultSetter).call(this,b,d,e);this.shadows&&/^(width|height|visibility|x|y|d|transform|cx|cy|r)$/.test(d)&&
|
||||
this.updateShadows(d,b)}if(this.doTransform)this.updateTransform(),this.doTransform=!1}c&&c();return g},updateShadows:function(a,b){for(var c=this.shadows,d=c.length;d--;)c[d].setAttribute(a,a==="height"?s(b-(c[d].cutHeight||0),0):a==="d"?this.d:b)},addClass:function(a){var b=this.element,c=K(b,"class")||"";c.indexOf(a)===-1&&K(b,"class",c+" "+a);return this},symbolAttr:function(a){var b=this;o("x,y,r,start,end,width,height,innerR,anchorX,anchorY".split(","),function(c){b[c]=p(a[c],b[c])});b.attr({d:b.renderer.symbols[b.symbolName](b.x,
|
||||
b.y,b.width,b.height,b)})},clip:function(a){return this.attr("clip-path",a?"url("+this.renderer.url+"#"+a.id+")":P)},crisp:function(a){var b,c={},d,e=a.strokeWidth||this.strokeWidth||0;d=w(e)%2/2;a.x=T(a.x||this.x||0)+d;a.y=T(a.y||this.y||0)+d;a.width=T((a.width||this.width||0)-2*d);a.height=T((a.height||this.height||0)-2*d);a.strokeWidth=e;for(b in a)this[b]!==a[b]&&(this[b]=c[b]=a[b]);return c},css:function(a){var b=this.styles,c={},d=this.element,e,f,g="";e=!b;if(a&&a.color)a.fill=a.color;if(b)for(f in a)a[f]!==
|
||||
b[f]&&(c[f]=a[f],e=!0);if(e){e=this.textWidth=a&&a.width&&d.nodeName.toLowerCase()==="text"&&G(a.width)||this.textWidth;b&&(a=t(b,c));this.styles=a;e&&(fa||!ca&&this.renderer.forExport)&&delete a.width;if(sa&&!ca)M(this.element,a);else{b=function(a,b){return"-"+b.toLowerCase()};for(f in a)g+=f.replace(/([A-Z])/g,b)+":"+a[f]+";";K(d,"style",g)}e&&this.added&&this.renderer.buildText(this)}return this},on:function(a,b){var c=this,d=c.element;ab&&a==="click"?(d.ontouchstart=function(a){c.touchEventFired=
|
||||
ya.now();a.preventDefault();b.call(d,a)},d.onclick=function(a){(za.indexOf("Android")===-1||ya.now()-(c.touchEventFired||0)>1100)&&b.call(d,a)}):d["on"+a]=b;return this},setRadialReference:function(a){var b=this.renderer.gradients[this.element.gradient];this.element.radialReference=a;b&&b.radAttr&&b.animate(this.renderer.getRadialAttr(a,b.radAttr));return this},translate:function(a,b){return this.attr({translateX:a,translateY:b})},invert:function(){this.inverted=!0;this.updateTransform();return this},
|
||||
updateTransform:function(){var a=this.translateX||0,b=this.translateY||0,c=this.scaleX,d=this.scaleY,e=this.inverted,f=this.rotation,g=this.element;e&&(a+=this.attr("width"),b+=this.attr("height"));a=["translate("+a+","+b+")"];e?a.push("rotate(90) scale(-1,1)"):f&&a.push("rotate("+f+" "+(g.getAttribute("x")||0)+" "+(g.getAttribute("y")||0)+")");(q(c)||q(d))&&a.push("scale("+p(c,1)+" "+p(d,1)+")");a.length&&g.setAttribute("transform",a.join(" "))},toFront:function(){var a=this.element;a.parentNode.appendChild(a);
|
||||
return this},align:function(a,b,c){var d,e,f,g,h={};e=this.renderer;f=e.alignedObjects;if(a){if(this.alignOptions=a,this.alignByTranslate=b,!c||Ba(c))this.alignTo=d=c||"renderer",ja(f,this),f.push(this),c=null}else a=this.alignOptions,b=this.alignByTranslate,d=this.alignTo;c=p(c,e[d],e);d=a.align;e=a.verticalAlign;f=(c.x||0)+(a.x||0);g=(c.y||0)+(a.y||0);if(d==="right"||d==="center")f+=(c.width-(a.width||0))/{right:1,center:2}[d];h[b?"translateX":"x"]=w(f);if(e==="bottom"||e==="middle")g+=(c.height-
|
||||
(a.height||0))/({bottom:1,middle:2}[e]||1);h[b?"translateY":"y"]=w(g);this[this.placed?"animate":"attr"](h);this.placed=!0;this.alignAttr=h;return this},getBBox:function(a){var b,c=this.renderer,d,e=this.rotation,f=this.element,g=this.styles,h=e*ga;d=this.textStr;var i,j=f.style,k,m;d!==x&&(m=["",e||0,g&&g.fontSize,f.style.width].join(","),m=d===""||Ob.test(d)?"num:"+d.toString().length+m:d+m);m&&!a&&(b=c.cache[m]);if(!b){if(f.namespaceURI===Ea||c.forExport){try{k=this.fakeTS&&function(a){o(f.querySelectorAll(".highcharts-text-shadow"),
|
||||
function(b){b.style.display=a})},Ka&&j.textShadow?(i=j.textShadow,j.textShadow=""):k&&k(P),b=f.getBBox?t({},f.getBBox()):{width:f.offsetWidth,height:f.offsetHeight},i?j.textShadow=i:k&&k("")}catch(n){}if(!b||b.width<0)b={width:0,height:0}}else b=this.htmlGetBBox();if(c.isSVG){a=b.width;d=b.height;if(sa&&g&&g.fontSize==="11px"&&d.toPrecision(3)==="16.9")b.height=d=14;if(e)b.width=O(d*aa(h))+O(a*W(h)),b.height=O(d*W(h))+O(a*aa(h))}m&&(c.cache[m]=b)}return b},show:function(a){return this.attr({visibility:a?
|
||||
"inherit":"visible"})},hide:function(){return this.attr({visibility:"hidden"})},fadeOut:function(a){var b=this;b.animate({opacity:0},{duration:a||150,complete:function(){b.attr({y:-9999})}})},add:function(a){var b=this.renderer,c=this.element,d;if(a)this.parentGroup=a;this.parentInverted=a&&a.inverted;this.textStr!==void 0&&b.buildText(this);this.added=!0;if(!a||a.handleZ||this.zIndex)d=this.zIndexSetter();d||(a?a.element:b.box).appendChild(c);if(this.onAdd)this.onAdd();return this},safeRemoveChild:function(a){var b=
|
||||
a.parentNode;b&&b.removeChild(a)},destroy:function(){var a=this,b=a.element||{},c=a.shadows,d=a.renderer.isSVG&&b.nodeName==="SPAN"&&a.parentGroup,e,f;b.onclick=b.onmouseout=b.onmouseover=b.onmousemove=b.point=null;cb(a);if(a.clipPath)a.clipPath=a.clipPath.destroy();if(a.stops){for(f=0;f<a.stops.length;f++)a.stops[f]=a.stops[f].destroy();a.stops=null}a.safeRemoveChild(b);for(c&&o(c,function(b){a.safeRemoveChild(b)});d&&d.div&&d.div.childNodes.length===0;)b=d.parentGroup,a.safeRemoveChild(d.div),delete d.div,
|
||||
d=b;a.alignTo&&ja(a.renderer.alignedObjects,a);for(e in a)delete a[e];return null},shadow:function(a,b,c){var d=[],e,f,g=this.element,h,i,j,k;if(a){i=p(a.width,3);j=(a.opacity||0.15)/i;k=this.parentInverted?"(-1,-1)":"("+p(a.offsetX,1)+", "+p(a.offsetY,1)+")";for(e=1;e<=i;e++){f=g.cloneNode(0);h=i*2+1-2*e;K(f,{isShadow:"true",stroke:a.color||"black","stroke-opacity":j*e,"stroke-width":h,transform:"translate"+k,fill:P});if(c)K(f,"height",s(K(f,"height")-h,0)),f.cutHeight=h;b?b.element.appendChild(f):
|
||||
g.parentNode.insertBefore(f,g);d.push(f)}this.shadows=d}return this},xGetter:function(a){this.element.nodeName==="circle"&&(a={x:"cx",y:"cy"}[a]||a);return this._defaultGetter(a)},_defaultGetter:function(a){a=p(this[a],this.element?this.element.getAttribute(a):null,0);/^[\-0-9\.]+$/.test(a)&&(a=parseFloat(a));return a},dSetter:function(a,b,c){a&&a.join&&(a=a.join(" "));/(NaN| {2}|^$)/.test(a)&&(a="M 0 0");c.setAttribute(b,a);this[b]=a},dashstyleSetter:function(a){var b;if(a=a&&a.toLowerCase()){a=
|
||||
a.replace("shortdashdotdot","3,1,1,1,1,1,").replace("shortdashdot","3,1,1,1").replace("shortdot","1,1,").replace("shortdash","3,1,").replace("longdash","8,3,").replace(/dot/g,"1,3,").replace("dash","4,3,").replace(/,$/,"").split(",");for(b=a.length;b--;)a[b]=G(a[b])*this["stroke-width"];a=a.join(",").replace("NaN","none");this.element.setAttribute("stroke-dasharray",a)}},alignSetter:function(a){this.element.setAttribute("text-anchor",{left:"start",center:"middle",right:"end"}[a])},opacitySetter:function(a,
|
||||
b,c){this[b]=a;c.setAttribute(b,a)},titleSetter:function(a){var b=this.element.getElementsByTagName("title")[0];b||(b=C.createElementNS(Ea,"title"),this.element.appendChild(b));b.appendChild(C.createTextNode(String(p(a),"").replace(/<[^>]*>/g,"")))},textSetter:function(a){if(a!==this.textStr)delete this.bBox,this.textStr=a,this.added&&this.renderer.buildText(this)},fillSetter:function(a,b,c){typeof a==="string"?c.setAttribute(b,a):a&&this.colorGradient(a,b,c)},visibilitySetter:function(a,b,c){a===
|
||||
"inherit"?c.removeAttribute(b):c.setAttribute(b,a)},zIndexSetter:function(a,b){var c=this.renderer,d=this.parentGroup,c=(d||c).element||c.box,e,f,g=this.element,h;e=this.added;var i;q(a)&&(g.setAttribute(b,a),a=+a,this[b]===a&&(e=!1),this[b]=a);if(e){if((a=this.zIndex)&&d)d.handleZ=!0;d=c.childNodes;for(i=0;i<d.length&&!h;i++)if(e=d[i],f=K(e,"zIndex"),e!==g&&(G(f)>a||!q(a)&&q(f)))c.insertBefore(g,e),h=!0;h||c.appendChild(g)}return h},_defaultSetter:function(a,b,c){c.setAttribute(b,a)}};Q.prototype.yGetter=
|
||||
Q.prototype.xGetter;Q.prototype.translateXSetter=Q.prototype.translateYSetter=Q.prototype.rotationSetter=Q.prototype.verticalAlignSetter=Q.prototype.scaleXSetter=Q.prototype.scaleYSetter=function(a,b){this[b]=a;this.doTransform=!0};Q.prototype["stroke-widthSetter"]=Q.prototype.strokeSetter=function(a,b,c){this[b]=a;if(this.stroke&&this["stroke-width"])this.strokeWidth=this["stroke-width"],Q.prototype.fillSetter.call(this,this.stroke,"stroke",c),c.setAttribute("stroke-width",this["stroke-width"]),
|
||||
this.hasStroke=!0;else if(b==="stroke-width"&&a===0&&this.hasStroke)c.removeAttribute("stroke"),this.hasStroke=!1};var Aa=function(){this.init.apply(this,arguments)};Aa.prototype={Element:Q,init:function(a,b,c,d,e,f){var g=location,h,d=this.createElement("svg").attr({version:"1.1"}).css(this.getStyle(d));h=d.element;a.appendChild(h);a.innerHTML.indexOf("xmlns")===-1&&K(h,"xmlns",Ea);this.isSVG=!0;this.box=h;this.boxWrapper=d;this.alignedObjects=[];this.url=(Ka||hb)&&C.getElementsByTagName("base").length?
|
||||
g.href.replace(/#.*?$/,"").replace(/([\('\)])/g,"\\$1").replace(/ /g,"%20"):"";this.createElement("desc").add().element.appendChild(C.createTextNode("Created with Highcharts 4.1.9"));this.defs=this.createElement("defs").add();this.allowHTML=f;this.forExport=e;this.gradients={};this.cache={};this.setSize(b,c,!1);var i;if(Ka&&a.getBoundingClientRect)this.subPixelFix=b=function(){M(a,{left:0,top:0});i=a.getBoundingClientRect();M(a,{left:ta(i.left)-i.left+"px",top:ta(i.top)-i.top+"px"})},b(),I(L,"resize",
|
||||
b)},getStyle:function(a){return this.style=t({fontFamily:'"Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, sans-serif',fontSize:"12px"},a)},isHidden:function(){return!this.boxWrapper.getBBox().width},destroy:function(){var a=this.defs;this.box=null;this.boxWrapper=this.boxWrapper.destroy();Pa(this.gradients||{});this.gradients=null;if(a)this.defs=a.destroy();this.subPixelFix&&Y(L,"resize",this.subPixelFix);return this.alignedObjects=null},createElement:function(a){var b=new this.Element;
|
||||
b.init(this,a);return b},draw:function(){},getRadialAttr:function(a,b){return{cx:a[0]-a[2]/2+b.cx*a[2],cy:a[1]-a[2]/2+b.cy*a[2],r:b.r*a[2]}},buildText:function(a){for(var b=a.element,c=this,d=c.forExport,e=p(a.textStr,"").toString(),f=e.indexOf("<")!==-1,g=b.childNodes,h,i,j=K(b,"x"),k=a.styles,m=a.textWidth,n=k&&k.lineHeight,l=k&&k.textShadow,u=k&&k.textOverflow==="ellipsis",r=g.length,Z=m&&!a.added&&this.box,A=function(a){return n?G(n):c.fontMetrics(/(px|em)$/.test(a&&a.style.fontSize)?a.style.fontSize:
|
||||
k&&k.fontSize||c.style.fontSize||12,a).h},v=function(a){return a.replace(/</g,"<").replace(/>/g,">")};r--;)b.removeChild(g[r]);!f&&!l&&!u&&e.indexOf(" ")===-1?b.appendChild(C.createTextNode(v(e))):(h=/<.*style="([^"]+)".*>/,i=/<.*href="(http[^"]+)".*>/,Z&&Z.appendChild(b),e=f?e.replace(/<(b|strong)>/g,'<span style="font-weight:bold">').replace(/<(i|em)>/g,'<span style="font-style:italic">').replace(/<a/g,"<span").replace(/<\/(b|strong|i|em|a)>/g,"</span>").split(/<br.*?>/g):[e],e[e.length-1]===
|
||||
""&&e.pop(),o(e,function(e,f){var g,n=0,e=e.replace(/<span/g,"|||<span").replace(/<\/span>/g,"</span>|||");g=e.split("|||");o(g,function(e){if(e!==""||g.length===1){var l={},r=C.createElementNS(Ea,"tspan"),p;h.test(e)&&(p=e.match(h)[1].replace(/(;| |^)color([ :])/,"$1fill$2"),K(r,"style",p));i.test(e)&&!d&&(K(r,"onclick",'location.href="'+e.match(i)[1]+'"'),M(r,{cursor:"pointer"}));e=v(e.replace(/<(.|\n)*?>/g,"")||" ");if(e!==" "){r.appendChild(C.createTextNode(e));if(n)l.dx=0;else if(f&&j!==null)l.x=
|
||||
j;K(r,l);b.appendChild(r);!n&&f&&(!ca&&d&&M(r,{display:"block"}),K(r,"dy",A(r)));if(m){for(var l=e.replace(/([^\^])-/g,"$1- ").split(" "),Z=g.length>1||f||l.length>1&&k.whiteSpace!=="nowrap",o,y,q,s=[],x=A(r),t=1,w=a.rotation,z=e,D=z.length;(Z||u)&&(l.length||s.length);)a.rotation=0,o=a.getBBox(!0),q=o.width,!ca&&c.forExport&&(q=c.measureSpanWidth(r.firstChild.data,a.styles)),o=q>m,y===void 0&&(y=o),u&&y?(D/=2,z===""||!o&&D<0.5?l=[]:(o&&(y=!0),z=e.substring(0,z.length+(o?-1:1)*ta(D)),l=[z+(m>3?"\u2026":
|
||||
"")],r.removeChild(r.firstChild))):!o||l.length===1?(l=s,s=[],l.length&&(t++,r=C.createElementNS(Ea,"tspan"),K(r,{dy:x,x:j}),p&&K(r,"style",p),b.appendChild(r)),q>m&&(m=q)):(r.removeChild(r.firstChild),s.unshift(l.pop())),l.length&&r.appendChild(C.createTextNode(l.join(" ").replace(/- /g,"-")));y&&a.attr("title",a.textStr);a.rotation=w}n++}}})}),Z&&Z.removeChild(b),l&&a.applyTextShadow&&a.applyTextShadow(l))},getContrast:function(a){a=na(a).rgba;return a[0]+a[1]+a[2]>384?"#000000":"#FFFFFF"},button:function(a,
|
||||
b,c,d,e,f,g,h,i){var j=this.label(a,b,c,i,null,null,null,null,"button"),k=0,m,n,l,u,r,p,a={x1:0,y1:0,x2:0,y2:1},e=D({"stroke-width":1,stroke:"#CCCCCC",fill:{linearGradient:a,stops:[[0,"#FEFEFE"],[1,"#F6F6F6"]]},r:2,padding:5,style:{color:"black"}},e);l=e.style;delete e.style;f=D(e,{stroke:"#68A",fill:{linearGradient:a,stops:[[0,"#FFF"],[1,"#ACF"]]}},f);u=f.style;delete f.style;g=D(e,{stroke:"#68A",fill:{linearGradient:a,stops:[[0,"#9BD"],[1,"#CDF"]]}},g);r=g.style;delete g.style;h=D(e,{style:{color:"#CCC"}},
|
||||
h);p=h.style;delete h.style;I(j.element,sa?"mouseover":"mouseenter",function(){k!==3&&j.attr(f).css(u)});I(j.element,sa?"mouseout":"mouseleave",function(){k!==3&&(m=[e,f,g][k],n=[l,u,r][k],j.attr(m).css(n))});j.setState=function(a){(j.state=k=a)?a===2?j.attr(g).css(r):a===3&&j.attr(h).css(p):j.attr(e).css(l)};return j.on("click",function(a){k!==3&&d.call(j,a)}).attr(e).css(t({cursor:"default"},l))},crispLine:function(a,b){a[1]===a[4]&&(a[1]=a[4]=w(a[1])-b%2/2);a[2]===a[5]&&(a[2]=a[5]=w(a[2])+b%2/
|
||||
2);return a},path:function(a){var b={fill:P};Ga(a)?b.d=a:da(a)&&t(b,a);return this.createElement("path").attr(b)},circle:function(a,b,c){a=da(a)?a:{x:a,y:b,r:c};b=this.createElement("circle");b.xSetter=function(a){this.element.setAttribute("cx",a)};b.ySetter=function(a){this.element.setAttribute("cy",a)};return b.attr(a)},arc:function(a,b,c,d,e,f){if(da(a))b=a.y,c=a.r,d=a.innerR,e=a.start,f=a.end,a=a.x;a=this.symbol("arc",a||0,b||0,c||0,c||0,{innerR:d||0,start:e||0,end:f||0});a.r=c;return a},rect:function(a,
|
||||
b,c,d,e,f){var e=da(a)?a.r:e,g=this.createElement("rect"),a=da(a)?a:a===x?{}:{x:a,y:b,width:s(c,0),height:s(d,0)};if(f!==x)a.strokeWidth=f,a=g.crisp(a);if(e)a.r=e;g.rSetter=function(a){K(this.element,{rx:a,ry:a})};return g.attr(a)},setSize:function(a,b,c){var d=this.alignedObjects,e=d.length;this.width=a;this.height=b;for(this.boxWrapper[p(c,!0)?"animate":"attr"]({width:a,height:b});e--;)d[e].align()},g:function(a){var b=this.createElement("g");return q(a)?b.attr({"class":"highcharts-"+a}):b},image:function(a,
|
||||
b,c,d,e){var f={preserveAspectRatio:P};arguments.length>1&&t(f,{x:b,y:c,width:d,height:e});f=this.createElement("image").attr(f);f.element.setAttributeNS?f.element.setAttributeNS("http://www.w3.org/1999/xlink","href",a):f.element.setAttribute("hc-svg-href",a);return f},symbol:function(a,b,c,d,e,f){var g,h=this.symbols[a],h=h&&h(w(b),w(c),d,e,f),i=/^url\((.*?)\)$/,j,k;if(h)g=this.path(h),t(g,{symbolName:a,x:b,y:c,width:d,height:e}),f&&t(g,f);else if(i.test(a))k=function(a,b){a.element&&(a.attr({width:b[0],
|
||||
height:b[1]}),a.alignByTranslate||a.translate(w((d-b[0])/2),w((e-b[1])/2)))},j=a.match(i)[1],a=Kb[j]||f&&f.width&&f.height&&[f.width,f.height],g=this.image(j).attr({x:b,y:c}),g.isImg=!0,a?k(g,a):(g.attr({width:0,height:0}),$("img",{onload:function(){this.width===0&&(M(this,{position:"absolute",top:"-999em"}),document.body.appendChild(this));k(g,Kb[j]=[this.width,this.height]);this.parentNode&&this.parentNode.removeChild(this)},src:j}));return g},symbols:{circle:function(a,b,c,d){var e=0.166*c;return["M",
|
||||
a+c/2,b,"C",a+c+e,b,a+c+e,b+d,a+c/2,b+d,"C",a-e,b+d,a-e,b,a+c/2,b,"Z"]},square:function(a,b,c,d){return["M",a,b,"L",a+c,b,a+c,b+d,a,b+d,"Z"]},triangle:function(a,b,c,d){return["M",a+c/2,b,"L",a+c,b+d,a,b+d,"Z"]},"triangle-down":function(a,b,c,d){return["M",a,b,"L",a+c,b,a+c/2,b+d,"Z"]},diamond:function(a,b,c,d){return["M",a+c/2,b,"L",a+c,b+d/2,a+c/2,b+d,a,b+d/2,"Z"]},arc:function(a,b,c,d,e){var f=e.start,c=e.r||c||d,g=e.end-0.001,d=e.innerR,h=e.open,i=W(f),j=aa(f),k=W(g),g=aa(g),e=e.end-f<ma?0:1;
|
||||
return["M",a+c*i,b+c*j,"A",c,c,0,e,1,a+c*k,b+c*g,h?"M":"L",a+d*k,b+d*g,"A",d,d,0,e,0,a+d*i,b+d*j,h?"":"Z"]},callout:function(a,b,c,d,e){var f=z(e&&e.r||0,c,d),g=f+6,h=e&&e.anchorX,e=e&&e.anchorY,i;i=["M",a+f,b,"L",a+c-f,b,"C",a+c,b,a+c,b,a+c,b+f,"L",a+c,b+d-f,"C",a+c,b+d,a+c,b+d,a+c-f,b+d,"L",a+f,b+d,"C",a,b+d,a,b+d,a,b+d-f,"L",a,b+f,"C",a,b,a,b,a+f,b];h&&h>c&&e>b+g&&e<b+d-g?i.splice(13,3,"L",a+c,e-6,a+c+6,e,a+c,e+6,a+c,b+d-f):h&&h<0&&e>b+g&&e<b+d-g?i.splice(33,3,"L",a,e+6,a-6,e,a,e-6,a,b+f):e&&e>
|
||||
d&&h>a+g&&h<a+c-g?i.splice(23,3,"L",h+6,b+d,h,b+d+6,h-6,b+d,a+f,b+d):e&&e<0&&h>a+g&&h<a+c-g&&i.splice(3,3,"L",h-6,b,h,b-6,h+6,b,c-f,b);return i}},clipRect:function(a,b,c,d){var e="highcharts-"+xb++,f=this.createElement("clipPath").attr({id:e}).add(this.defs),a=this.rect(a,b,c,d,0).add(f);a.id=e;a.clipPath=f;a.count=0;return a},text:function(a,b,c,d){var e=fa||!ca&&this.forExport,f={};if(d&&(this.allowHTML||!this.forExport))return this.html(a,b,c);f.x=Math.round(b||0);if(c)f.y=Math.round(c);if(a||
|
||||
a===0)f.text=a;a=this.createElement("text").attr(f);e&&a.css({position:"absolute"});if(!d)a.xSetter=function(a,b,c){var d=c.getElementsByTagName("tspan"),e,f=c.getAttribute(b),n;for(n=0;n<d.length;n++)e=d[n],e.getAttribute(b)===f&&e.setAttribute(b,a);c.setAttribute(b,a)};return a},fontMetrics:function(a,b){var c,d,a=a||this.style.fontSize;!a&&b&&L.getComputedStyle&&(b=b.element||b,a=(c=L.getComputedStyle(b,""))&&c.fontSize);a=/px/.test(a)?G(a):/em/.test(a)?parseFloat(a)*12:12;c=a<24?a+3:w(a*1.2);
|
||||
d=w(c*0.8);return{h:c,b:d,f:a}},rotCorr:function(a,b,c){var d=a;b&&c&&(d=s(d*W(b*ga),4));return{x:-a/3*aa(b*ga),y:d}},label:function(a,b,c,d,e,f,g,h,i){function j(){var a,b;a=u.element.style;p=(s===void 0||va===void 0||l.styles.textAlign)&&q(u.textStr)&&u.getBBox();l.width=(s||p.width||0)+2*v+y;l.height=(va||p.height||0)+2*v;B=v+n.fontMetrics(a&&a.fontSize,u).b;if(E){if(!r)a=w(-A*v)+C,b=(h?-B:0)+C,l.box=r=d?n.symbol(d,a,b,l.width,l.height,H):n.rect(a,b,l.width,l.height,0,H[Pb]),r.isImg||r.attr("fill",
|
||||
P),r.add(l);r.isImg||r.attr(t({width:w(l.width),height:w(l.height)},H));H=null}}function k(){var a=l.styles,a=a&&a.textAlign,b=y+v*(1-A),c;c=h?0:B;if(q(s)&&p&&(a==="center"||a==="right"))b+={center:0.5,right:1}[a]*(s-p.width);if(b!==u.x||c!==u.y)u.attr("x",b),c!==x&&u.attr("y",c);u.x=b;u.y=c}function m(a,b){r?r.attr(a,b):H[a]=b}var n=this,l=n.g(i),u=n.text("",0,0,g).attr({zIndex:1}),r,p,A=0,v=3,y=0,s,va,zb,z,C=0,H={},B,E;l.onAdd=function(){u.add(l);l.attr({text:a||a===0?a:"",x:b,y:c});r&&q(e)&&l.attr({anchorX:e,
|
||||
anchorY:f})};l.widthSetter=function(a){s=a};l.heightSetter=function(a){va=a};l.paddingSetter=function(a){if(q(a)&&a!==v)v=l.padding=a,k()};l.paddingLeftSetter=function(a){q(a)&&a!==y&&(y=a,k())};l.alignSetter=function(a){A={left:0,center:0.5,right:1}[a]};l.textSetter=function(a){a!==x&&u.textSetter(a);j();k()};l["stroke-widthSetter"]=function(a,b){a&&(E=!0);C=a%2/2;m(b,a)};l.strokeSetter=l.fillSetter=l.rSetter=function(a,b){b==="fill"&&a&&(E=!0);m(b,a)};l.anchorXSetter=function(a,b){e=a;m(b,w(a)-
|
||||
C-zb)};l.anchorYSetter=function(a,b){f=a;m(b,a-z)};l.xSetter=function(a){l.x=a;A&&(a-=A*((s||p.width)+v));zb=w(a);l.attr("translateX",zb)};l.ySetter=function(a){z=l.y=w(a);l.attr("translateY",z)};var G=l.css;return t(l,{css:function(a){if(a){var b={},a=D(a);o(l.textProps,function(c){a[c]!==x&&(b[c]=a[c],delete a[c])});u.css(b)}return G.call(l,a)},getBBox:function(){return{width:p.width+2*v,height:p.height+2*v,x:p.x-v,y:p.y-v}},shadow:function(a){r&&r.shadow(a);return l},destroy:function(){Y(l.element,
|
||||
"mouseenter");Y(l.element,"mouseleave");u&&(u=u.destroy());r&&(r=r.destroy());Q.prototype.destroy.call(l);l=n=j=k=m=null}})}};$a=Aa;t(Q.prototype,{htmlCss:function(a){var b=this.element;if(b=a&&b.tagName==="SPAN"&&a.width)delete a.width,this.textWidth=b,this.updateTransform();if(a&&a.textOverflow==="ellipsis")a.whiteSpace="nowrap",a.overflow="hidden";this.styles=t(this.styles,a);M(this.element,a);return this},htmlGetBBox:function(){var a=this.element;if(a.nodeName==="text")a.style.position="absolute";
|
||||
return{x:a.offsetLeft,y:a.offsetTop,width:a.offsetWidth,height:a.offsetHeight}},htmlUpdateTransform:function(){if(this.added){var a=this.renderer,b=this.element,c=this.translateX||0,d=this.translateY||0,e=this.x||0,f=this.y||0,g=this.textAlign||"left",h={left:0,center:0.5,right:1}[g],i=this.shadows,j=this.styles;M(b,{marginLeft:c,marginTop:d});i&&o(i,function(a){M(a,{marginLeft:c+1,marginTop:d+1})});this.inverted&&o(b.childNodes,function(c){a.invertChild(c,b)});if(b.tagName==="SPAN"){var k=this.rotation,
|
||||
m,n=G(this.textWidth),l=[k,g,b.innerHTML,this.textWidth,this.textAlign].join(",");if(l!==this.cTT){m=a.fontMetrics(b.style.fontSize).b;q(k)&&this.setSpanRotation(k,h,m);i=p(this.elemWidth,b.offsetWidth);if(i>n&&/[ \-]/.test(b.textContent||b.innerText))M(b,{width:n+"px",display:"block",whiteSpace:j&&j.whiteSpace||"normal"}),i=n;this.getSpanCorrection(i,m,h,k,g)}M(b,{left:e+(this.xCorr||0)+"px",top:f+(this.yCorr||0)+"px"});if(hb)m=b.offsetHeight;this.cTT=l}}else this.alignOnAdd=!0},setSpanRotation:function(a,
|
||||
b,c){var d={},e=sa?"-ms-transform":hb?"-webkit-transform":Ka?"MozTransform":Ib?"-o-transform":"";d[e]=d.transform="rotate("+a+"deg)";d[e+(Ka?"Origin":"-origin")]=d.transformOrigin=b*100+"% "+c+"px";M(this.element,d)},getSpanCorrection:function(a,b,c){this.xCorr=-a*c;this.yCorr=-b}});t(Aa.prototype,{html:function(a,b,c){var d=this.createElement("span"),e=d.element,f=d.renderer;d.textSetter=function(a){a!==e.innerHTML&&delete this.bBox;e.innerHTML=this.textStr=a;d.htmlUpdateTransform()};d.xSetter=d.ySetter=
|
||||
d.alignSetter=d.rotationSetter=function(a,b){b==="align"&&(b="textAlign");d[b]=a;d.htmlUpdateTransform()};d.attr({text:a,x:w(b),y:w(c)}).css({position:"absolute",fontFamily:this.style.fontFamily,fontSize:this.style.fontSize});e.style.whiteSpace="nowrap";d.css=d.htmlCss;if(f.isSVG)d.add=function(a){var b,c=f.box.parentNode,j=[];if(this.parentGroup=a){if(b=a.div,!b){for(;a;)j.push(a),a=a.parentGroup;o(j.reverse(),function(a){var d,e=K(a.element,"class");e&&(e={className:e});b=a.div=a.div||$(Ja,e,{position:"absolute",
|
||||
left:(a.translateX||0)+"px",top:(a.translateY||0)+"px"},b||c);d=b.style;t(a,{translateXSetter:function(b,c){d.left=b+"px";a[c]=b;a.doTransform=!0},translateYSetter:function(b,c){d.top=b+"px";a[c]=b;a.doTransform=!0}});o(["opacity","visibility"],function(b){Ta(a,b+"Setter",function(a,b,c,e){a.call(this,b,c,e);d[c]=b})})})}}else b=c;b.appendChild(e);d.added=!0;d.alignOnAdd&&d.htmlUpdateTransform();return d};return d}});if(!ca&&!fa){E={init:function(a,b){var c=["<",b,' filled="f" stroked="f"'],d=["position: ",
|
||||
"absolute",";"],e=b===Ja;(b==="shape"||e)&&d.push("left:0;top:0;width:1px;height:1px;");d.push("visibility: ",e?"hidden":"visible");c.push(' style="',d.join(""),'"/>');if(b)c=e||b==="span"||b==="img"?c.join(""):a.prepVML(c),this.element=$(c);this.renderer=a},add:function(a){var b=this.renderer,c=this.element,d=b.box,d=a?a.element||a:d;a&&a.inverted&&b.invertChild(c,d);d.appendChild(c);this.added=!0;this.alignOnAdd&&!this.deferUpdateTransform&&this.updateTransform();if(this.onAdd)this.onAdd();return this},
|
||||
updateTransform:Q.prototype.htmlUpdateTransform,setSpanRotation:function(){var a=this.rotation,b=W(a*ga),c=aa(a*ga);M(this.element,{filter:a?["progid:DXImageTransform.Microsoft.Matrix(M11=",b,", M12=",-c,", M21=",c,", M22=",b,", sizingMethod='auto expand')"].join(""):P})},getSpanCorrection:function(a,b,c,d,e){var f=d?W(d*ga):1,g=d?aa(d*ga):0,h=p(this.elemHeight,this.element.offsetHeight),i;this.xCorr=f<0&&-a;this.yCorr=g<0&&-h;i=f*g<0;this.xCorr+=g*b*(i?1-c:c);this.yCorr-=f*b*(d?i?c:1-c:1);e&&e!==
|
||||
"left"&&(this.xCorr-=a*c*(f<0?-1:1),d&&(this.yCorr-=h*c*(g<0?-1:1)),M(this.element,{textAlign:e}))},pathToVML:function(a){for(var b=a.length,c=[];b--;)if(qa(a[b]))c[b]=w(a[b]*10)-5;else if(a[b]==="Z")c[b]="x";else if(c[b]=a[b],a.isArc&&(a[b]==="wa"||a[b]==="at"))c[b+5]===c[b+7]&&(c[b+7]+=a[b+7]>a[b+5]?1:-1),c[b+6]===c[b+8]&&(c[b+8]+=a[b+8]>a[b+6]?1:-1);return c.join(" ")||"x"},clip:function(a){var b=this,c;a?(c=a.members,ja(c,b),c.push(b),b.destroyClip=function(){ja(c,b)},a=a.getCSS(b)):(b.destroyClip&&
|
||||
b.destroyClip(),a={clip:gb?"inherit":"rect(auto)"});return b.css(a)},css:Q.prototype.htmlCss,safeRemoveChild:function(a){a.parentNode&&Qa(a)},destroy:function(){this.destroyClip&&this.destroyClip();return Q.prototype.destroy.apply(this)},on:function(a,b){this.element["on"+a]=function(){var a=L.event;a.target=a.srcElement;b(a)};return this},cutOffPath:function(a,b){var c,a=a.split(/[ ,]/);c=a.length;if(c===9||c===11)a[c-4]=a[c-2]=G(a[c-2])-10*b;return a.join(" ")},shadow:function(a,b,c){var d=[],e,
|
||||
f=this.element,g=this.renderer,h,i=f.style,j,k=f.path,m,n,l,u;k&&typeof k.value!=="string"&&(k="x");n=k;if(a){l=p(a.width,3);u=(a.opacity||0.15)/l;for(e=1;e<=3;e++){m=l*2+1-2*e;c&&(n=this.cutOffPath(k.value,m+0.5));j=['<shape isShadow="true" strokeweight="',m,'" filled="false" path="',n,'" coordsize="10 10" style="',f.style.cssText,'" />'];h=$(g.prepVML(j),null,{left:G(i.left)+p(a.offsetX,1),top:G(i.top)+p(a.offsetY,1)});if(c)h.cutOff=m+1;j=['<stroke color="',a.color||"black",'" opacity="',u*e,'"/>'];
|
||||
$(g.prepVML(j),null,null,h);b?b.element.appendChild(h):f.parentNode.insertBefore(h,f);d.push(h)}this.shadows=d}return this},updateShadows:ua,setAttr:function(a,b){gb?this.element[a]=b:this.element.setAttribute(a,b)},classSetter:function(a){this.element.className=a},dashstyleSetter:function(a,b,c){(c.getElementsByTagName("stroke")[0]||$(this.renderer.prepVML(["<stroke/>"]),null,null,c))[b]=a||"solid";this[b]=a},dSetter:function(a,b,c){var d=this.shadows,a=a||[];this.d=a.join&&a.join(" ");c.path=a=
|
||||
this.pathToVML(a);if(d)for(c=d.length;c--;)d[c].path=d[c].cutOff?this.cutOffPath(a,d[c].cutOff):a;this.setAttr(b,a)},fillSetter:function(a,b,c){var d=c.nodeName;if(d==="SPAN")c.style.color=a;else if(d!=="IMG")c.filled=a!==P,this.setAttr("fillcolor",this.renderer.color(a,c,b,this))},opacitySetter:ua,rotationSetter:function(a,b,c){c=c.style;this[b]=c[b]=a;c.left=-w(aa(a*ga)+1)+"px";c.top=w(W(a*ga))+"px"},strokeSetter:function(a,b,c){this.setAttr("strokecolor",this.renderer.color(a,c,b))},"stroke-widthSetter":function(a,
|
||||
b,c){c.stroked=!!a;this[b]=a;qa(a)&&(a+="px");this.setAttr("strokeweight",a)},titleSetter:function(a,b){this.setAttr(b,a)},visibilitySetter:function(a,b,c){a==="inherit"&&(a="visible");this.shadows&&o(this.shadows,function(c){c.style[b]=a});c.nodeName==="DIV"&&(a=a==="hidden"?"-999em":0,gb||(c.style[b]=a?"visible":"hidden"),b="top");c.style[b]=a},xSetter:function(a,b,c){this[b]=a;b==="x"?b="left":b==="y"&&(b="top");this.updateClipping?(this[b]=a,this.updateClipping()):c.style[b]=a},zIndexSetter:function(a,
|
||||
b,c){c.style[b]=a}};B.VMLElement=E=ka(Q,E);E.prototype.ySetter=E.prototype.widthSetter=E.prototype.heightSetter=E.prototype.xSetter;var Ma={Element:E,isIE8:za.indexOf("MSIE 8.0")>-1,init:function(a,b,c,d){var e;this.alignedObjects=[];d=this.createElement(Ja).css(t(this.getStyle(d),{position:"relative"}));e=d.element;a.appendChild(d.element);this.isVML=!0;this.box=e;this.boxWrapper=d;this.cache={};this.setSize(b,c,!1);if(!C.namespaces.hcv){C.namespaces.add("hcv","urn:schemas-microsoft-com:vml");try{C.createStyleSheet().cssText=
|
||||
"hcv\\:fill, hcv\\:path, hcv\\:shape, hcv\\:stroke{ behavior:url(#default#VML); display: inline-block; } "}catch(f){C.styleSheets[0].cssText+="hcv\\:fill, hcv\\:path, hcv\\:shape, hcv\\:stroke{ behavior:url(#default#VML); display: inline-block; } "}}},isHidden:function(){return!this.box.offsetWidth},clipRect:function(a,b,c,d){var e=this.createElement(),f=da(a);return t(e,{members:[],count:0,left:(f?a.x:a)+1,top:(f?a.y:b)+1,width:(f?a.width:c)-1,height:(f?a.height:d)-1,getCSS:function(a){var b=a.element,
|
||||
c=b.nodeName,a=a.inverted,d=this.top-(c==="shape"?b.offsetTop:0),e=this.left,b=e+this.width,f=d+this.height,d={clip:"rect("+w(a?e:d)+"px,"+w(a?f:b)+"px,"+w(a?b:f)+"px,"+w(a?d:e)+"px)"};!a&&gb&&c==="DIV"&&t(d,{width:b+"px",height:f+"px"});return d},updateClipping:function(){o(e.members,function(a){a.element&&a.css(e.getCSS(a))})}})},color:function(a,b,c,d){var e=this,f,g=/^rgba/,h,i,j=P;a&&a.linearGradient?i="gradient":a&&a.radialGradient&&(i="pattern");if(i){var k,m,n=a.linearGradient||a.radialGradient,
|
||||
l,u,r,p,A,v="",a=a.stops,y,q=[],va=function(){h=['<fill colors="'+q.join(",")+'" opacity="',r,'" o:opacity2="',u,'" type="',i,'" ',v,'focus="100%" method="any" />'];$(e.prepVML(h),null,null,b)};l=a[0];y=a[a.length-1];l[0]>0&&a.unshift([0,l[1]]);y[0]<1&&a.push([1,y[1]]);o(a,function(a,b){g.test(a[1])?(f=na(a[1]),k=f.get("rgb"),m=f.get("a")):(k=a[1],m=1);q.push(a[0]*100+"% "+k);b?(r=m,p=k):(u=m,A=k)});if(c==="fill")if(i==="gradient")c=n.x1||n[0]||0,a=n.y1||n[1]||0,l=n.x2||n[2]||0,n=n.y2||n[3]||0,v=
|
||||
'angle="'+(90-V.atan((n-a)/(l-c))*180/ma)+'"',va();else{var j=n.r,s=j*2,x=j*2,t=n.cx,w=n.cy,z=b.radialReference,D,j=function(){z&&(D=d.getBBox(),t+=(z[0]-D.x)/D.width-0.5,w+=(z[1]-D.y)/D.height-0.5,s*=z[2]/D.width,x*=z[2]/D.height);v='src="'+S.global.VMLRadialGradientURL+'" size="'+s+","+x+'" origin="0.5,0.5" position="'+t+","+w+'" color2="'+A+'" ';va()};d.added?j():d.onAdd=j;j=p}else j=k}else if(g.test(a)&&b.tagName!=="IMG")f=na(a),h=["<",c,' opacity="',f.get("a"),'"/>'],$(this.prepVML(h),null,null,
|
||||
b),j=f.get("rgb");else{j=b.getElementsByTagName(c);if(j.length)j[0].opacity=1,j[0].type="solid";j=a}return j},prepVML:function(a){var b=this.isIE8,a=a.join("");b?(a=a.replace("/>",' xmlns="urn:schemas-microsoft-com:vml" />'),a=a.indexOf('style="')===-1?a.replace("/>",' style="display:inline-block;behavior:url(#default#VML);" />'):a.replace('style="','style="display:inline-block;behavior:url(#default#VML);')):a=a.replace("<","<hcv:");return a},text:Aa.prototype.html,path:function(a){var b={coordsize:"10 10"};
|
||||
Ga(a)?b.d=a:da(a)&&t(b,a);return this.createElement("shape").attr(b)},circle:function(a,b,c){var d=this.symbol("circle");if(da(a))c=a.r,b=a.y,a=a.x;d.isCircle=!0;d.r=c;return d.attr({x:a,y:b})},g:function(a){var b;a&&(b={className:"highcharts-"+a,"class":"highcharts-"+a});return this.createElement(Ja).attr(b)},image:function(a,b,c,d,e){var f=this.createElement("img").attr({src:a});arguments.length>1&&f.attr({x:b,y:c,width:d,height:e});return f},createElement:function(a){return a==="rect"?this.symbol(a):
|
||||
Aa.prototype.createElement.call(this,a)},invertChild:function(a,b){var c=this,d=b.style,e=a.tagName==="IMG"&&a.style;M(a,{flip:"x",left:G(d.width)-(e?G(e.top):1),top:G(d.height)-(e?G(e.left):1),rotation:-90});o(a.childNodes,function(b){c.invertChild(b,a)})},symbols:{arc:function(a,b,c,d,e){var f=e.start,g=e.end,h=e.r||c||d,c=e.innerR,d=W(f),i=aa(f),j=W(g),k=aa(g);if(g-f===0)return["x"];f=["wa",a-h,b-h,a+h,b+h,a+h*d,b+h*i,a+h*j,b+h*k];e.open&&!c&&f.push("e","M",a,b);f.push("at",a-c,b-c,a+c,b+c,a+c*
|
||||
j,b+c*k,a+c*d,b+c*i,"x","e");f.isArc=!0;return f},circle:function(a,b,c,d,e){e&&(c=d=2*e.r);e&&e.isCircle&&(a-=c/2,b-=d/2);return["wa",a,b,a+c,b+d,a+c,b+d/2,a+c,b+d/2,"e"]},rect:function(a,b,c,d,e){return Aa.prototype.symbols[!q(e)||!e.r?"square":"callout"].call(0,a,b,c,d,e)}}};B.VMLRenderer=E=function(){this.init.apply(this,arguments)};E.prototype=D(Aa.prototype,Ma);$a=E}Aa.prototype.measureSpanWidth=function(a,b){var c=C.createElement("span"),d;d=C.createTextNode(a);c.appendChild(d);M(c,b);this.box.appendChild(c);
|
||||
d=c.offsetWidth;Qa(c);return d};var Lb;if(fa)B.CanVGRenderer=E=function(){Ea="http://www.w3.org/1999/xhtml"},E.prototype.symbols={},Lb=function(){function a(){var a=b.length,d;for(d=0;d<a;d++)b[d]();b=[]}var b=[];return{push:function(c,d){b.length===0&&Qb(d,a);b.push(c)}}}(),$a=E;Sa.prototype={addLabel:function(){var a=this.axis,b=a.options,c=a.chart,d=a.categories,e=a.names,f=this.pos,g=b.labels,h=a.tickPositions,i=f===h[0],j=f===h[h.length-1],e=d?p(d[f],e[f],f):f,d=this.label,h=h.info,k;a.isDatetimeAxis&&
|
||||
h&&(k=b.dateTimeLabelFormats[h.higherRanks[f]||h.unitName]);this.isFirst=i;this.isLast=j;b=a.labelFormatter.call({axis:a,chart:c,isFirst:i,isLast:j,dateTimeLabelFormat:k,value:a.isLog?ea(ia(e)):e});q(d)?d&&d.attr({text:b}):(this.labelLength=(this.label=d=q(b)&&g.enabled?c.renderer.text(b,0,0,g.useHTML).css(D(g.style)).add(a.labelGroup):null)&&d.getBBox().width,this.rotation=0)},getLabelSize:function(){return this.label?this.label.getBBox()[this.axis.horiz?"height":"width"]:0},handleOverflow:function(a){var b=
|
||||
this.axis,c=a.x,d=b.chart.chartWidth,e=b.chart.spacing,f=p(b.labelLeft,z(b.pos,e[3])),e=p(b.labelRight,s(b.pos+b.len,d-e[1])),g=this.label,h=this.rotation,i={left:0,center:0.5,right:1}[b.labelAlign],j=g.getBBox().width,k=b.slotWidth,m=1,n,l={};if(h)h<0&&c-i*j<f?n=w(c/W(h*ga)-f):h>0&&c+i*j>e&&(n=w((d-c)/W(h*ga)));else if(d=c+(1-i)*j,c-i*j<f?k=a.x+k*(1-i)-f:d>e&&(k=e-a.x+k*i,m=-1),k=z(b.slotWidth,k),k<b.slotWidth&&b.labelAlign==="center"&&(a.x+=m*(b.slotWidth-k-i*(b.slotWidth-z(j,k)))),j>k||b.autoRotation&&
|
||||
g.styles.width)n=k;if(n){l.width=n;if(!b.options.labels.style.textOverflow)l.textOverflow="ellipsis";g.css(l)}},getPosition:function(a,b,c,d){var e=this.axis,f=e.chart,g=d&&f.oldChartHeight||f.chartHeight;return{x:a?e.translate(b+c,null,null,d)+e.transB:e.left+e.offset+(e.opposite?(d&&f.oldChartWidth||f.chartWidth)-e.right-e.left:0),y:a?g-e.bottom+e.offset-(e.opposite?e.height:0):g-e.translate(b+c,null,null,d)-e.transB}},getLabelPosition:function(a,b,c,d,e,f,g,h){var i=this.axis,j=i.transA,k=i.reversed,
|
||||
m=i.staggerLines,n=i.tickRotCorr||{x:0,y:0},c=p(e.y,n.y+(i.side===2?8:-(c.getBBox().height/2))),a=a+e.x+n.x-(f&&d?f*j*(k?-1:1):0),b=b+c-(f&&!d?f*j*(k?1:-1):0);m&&(b+=g/(h||1)%m*(i.labelOffset/m));return{x:a,y:w(b)}},getMarkPath:function(a,b,c,d,e,f){return f.crispLine(["M",a,b,"L",a+(e?0:-c),b+(e?c:0)],d)},render:function(a,b,c){var d=this.axis,e=d.options,f=d.chart.renderer,g=d.horiz,h=this.type,i=this.label,j=this.pos,k=e.labels,m=this.gridLine,n=h?h+"Grid":"grid",l=h?h+"Tick":"tick",u=e[n+"LineWidth"],
|
||||
r=e[n+"LineColor"],o=e[n+"LineDashStyle"],A=e[l+"Length"],n=p(e[l+"Width"],!h&&d.isXAxis?1:0),v=e[l+"Color"],y=e[l+"Position"],l=this.mark,q=k.step,va=!0,s=d.tickmarkOffset,t=this.getPosition(g,j,s,b),w=t.x,t=t.y,z=g&&w===d.pos+d.len||!g&&t===d.pos?-1:1,c=p(c,1);this.isActive=!0;if(u){j=d.getPlotLinePath(j+s,u*z,b,!0);if(m===x){m={stroke:r,"stroke-width":u};if(o)m.dashstyle=o;if(!h)m.zIndex=1;if(b)m.opacity=0;this.gridLine=m=u?f.path(j).attr(m).add(d.gridGroup):null}if(!b&&m&&j)m[this.isNew?"attr":
|
||||
"animate"]({d:j,opacity:c})}if(n&&A)y==="inside"&&(A=-A),d.opposite&&(A=-A),h=this.getMarkPath(w,t,A,n*z,g,f),l?l.animate({d:h,opacity:c}):this.mark=f.path(h).attr({stroke:v,"stroke-width":n,opacity:c}).add(d.axisGroup);if(i&&!isNaN(w))i.xy=t=this.getLabelPosition(w,t,i,g,k,s,a,q),this.isFirst&&!this.isLast&&!p(e.showFirstLabel,1)||this.isLast&&!this.isFirst&&!p(e.showLastLabel,1)?va=!1:g&&!d.isRadial&&!k.step&&!k.rotation&&!b&&c!==0&&this.handleOverflow(t),q&&a%q&&(va=!1),va&&!isNaN(t.y)?(t.opacity=
|
||||
c,i[this.isNew?"attr":"animate"](t),this.isNew=!1):i.attr("y",-9999)},destroy:function(){Pa(this,this.axis)}};B.PlotLineOrBand=function(a,b){this.axis=a;if(b)this.options=b,this.id=b.id};B.PlotLineOrBand.prototype={render:function(){var a=this,b=a.axis,c=b.horiz,d=a.options,e=d.label,f=a.label,g=d.width,h=d.to,i=d.from,j=q(i)&&q(h),k=d.value,m=d.dashStyle,n=a.svgElem,l=[],u,r=d.color,p=d.zIndex,o=d.events,v={},y=b.chart.renderer;b.isLog&&(i=Ca(i),h=Ca(h),k=Ca(k));if(g){if(l=b.getPlotLinePath(k,g),
|
||||
v={stroke:r,"stroke-width":g},m)v.dashstyle=m}else if(j){l=b.getPlotBandPath(i,h,d);if(r)v.fill=r;if(d.borderWidth)v.stroke=d.borderColor,v["stroke-width"]=d.borderWidth}else return;if(q(p))v.zIndex=p;if(n)if(l)n.animate({d:l},null,n.onGetPath);else{if(n.hide(),n.onGetPath=function(){n.show()},f)a.label=f=f.destroy()}else if(l&&l.length&&(a.svgElem=n=y.path(l).attr(v).add(),o))for(u in d=function(b){n.on(b,function(c){o[b].apply(a,[c])})},o)d(u);if(e&&q(e.text)&&l&&l.length&&b.width>0&&b.height>0){e=
|
||||
D({align:c&&j&&"center",x:c?!j&&4:10,verticalAlign:!c&&j&&"middle",y:c?j?16:10:j?6:-4,rotation:c&&!j&&90},e);if(!f){v={align:e.textAlign||e.align,rotation:e.rotation};if(q(p))v.zIndex=p;a.label=f=y.text(e.text,0,0,e.useHTML).attr(v).css(e.style).add()}b=[l[1],l[4],j?l[6]:l[1]];j=[l[2],l[5],j?l[7]:l[2]];l=Oa(b);c=Oa(j);f.align(e,!1,{x:l,y:c,width:Da(b)-l,height:Da(j)-c});f.show()}else f&&f.hide();return a},destroy:function(){ja(this.axis.plotLinesAndBands,this);delete this.axis;Pa(this)}};var ha=B.Axis=
|
||||
function(){this.init.apply(this,arguments)};ha.prototype={defaultOptions:{dateTimeLabelFormats:{millisecond:"%H:%M:%S.%L",second:"%H:%M:%S",minute:"%H:%M",hour:"%H:%M",day:"%e. %b",week:"%e. %b",month:"%b '%y",year:"%Y"},endOnTick:!1,gridLineColor:"#D8D8D8",labels:{enabled:!0,style:{color:"#606060",cursor:"default",fontSize:"11px"},x:0,y:15},lineColor:"#C0D0E0",lineWidth:1,minPadding:0.01,maxPadding:0.01,minorGridLineColor:"#E0E0E0",minorGridLineWidth:1,minorTickColor:"#A0A0A0",minorTickLength:2,
|
||||
minorTickPosition:"outside",startOfWeek:1,startOnTick:!1,tickColor:"#C0D0E0",tickLength:10,tickmarkPlacement:"between",tickPixelInterval:100,tickPosition:"outside",title:{align:"middle",style:{color:"#707070"}},type:"linear"},defaultYAxisOptions:{endOnTick:!0,gridLineWidth:1,tickPixelInterval:72,showLastLabel:!0,labels:{x:-8,y:3},lineWidth:0,maxPadding:0.05,minPadding:0.05,startOnTick:!0,title:{rotation:270,text:"Values"},stackLabels:{enabled:!1,formatter:function(){return B.numberFormat(this.total,
|
||||
-1)},style:D(ba.line.dataLabels.style,{color:"#000000"})}},defaultLeftAxisOptions:{labels:{x:-15,y:null},title:{rotation:270}},defaultRightAxisOptions:{labels:{x:15,y:null},title:{rotation:90}},defaultBottomAxisOptions:{labels:{autoRotation:[-45],x:0,y:null},title:{rotation:0}},defaultTopAxisOptions:{labels:{autoRotation:[-45],x:0,y:-15},title:{rotation:0}},init:function(a,b){var c=b.isX;this.chart=a;this.horiz=a.inverted?!c:c;this.coll=(this.isXAxis=c)?"xAxis":"yAxis";this.opposite=b.opposite;this.side=
|
||||
b.side||(this.horiz?this.opposite?0:2:this.opposite?1:3);this.setOptions(b);var d=this.options,e=d.type;this.labelFormatter=d.labels.formatter||this.defaultLabelFormatter;this.userOptions=b;this.minPixelPadding=0;this.reversed=d.reversed;this.visible=d.visible!==!1;this.zoomEnabled=d.zoomEnabled!==!1;this.categories=d.categories||e==="category";this.names=this.names||[];this.isLog=e==="logarithmic";this.isDatetimeAxis=e==="datetime";this.isLinked=q(d.linkedTo);this.ticks={};this.labelEdge=[];this.minorTicks=
|
||||
{};this.plotLinesAndBands=[];this.alternateBands={};this.len=0;this.minRange=this.userMinRange=d.minRange||d.maxZoom;this.range=d.range;this.offset=d.offset||0;this.stacks={};this.oldStacks={};this.stacksTouched=0;this.min=this.max=null;this.crosshair=p(d.crosshair,ra(a.options.tooltip.crosshairs)[c?0:1],!1);var f,d=this.options.events;La(this,a.axes)===-1&&(c&&!this.isColorAxis?a.axes.splice(a.xAxis.length,0,this):a.axes.push(this),a[this.coll].push(this));this.series=this.series||[];if(a.inverted&&
|
||||
c&&this.reversed===x)this.reversed=!0;this.removePlotLine=this.removePlotBand=this.removePlotBandOrLine;for(f in d)I(this,f,d[f]);if(this.isLog)this.val2lin=Ca,this.lin2val=ia},setOptions:function(a){this.options=D(this.defaultOptions,this.isXAxis?{}:this.defaultYAxisOptions,[this.defaultTopAxisOptions,this.defaultRightAxisOptions,this.defaultBottomAxisOptions,this.defaultLeftAxisOptions][this.side],D(S[this.coll],a))},defaultLabelFormatter:function(){var a=this.axis,b=this.value,c=a.categories,d=
|
||||
this.dateTimeLabelFormat,e=S.lang.numericSymbols,f=e&&e.length,g,h=a.options.labels.format,a=a.isLog?b:a.tickInterval;if(h)g=Ia(h,this);else if(c)g=b;else if(d)g=Na(d,b);else if(f&&a>=1E3)for(;f--&&g===x;)c=Math.pow(1E3,f+1),a>=c&&b*10%c===0&&e[f]!==null&&(g=B.numberFormat(b/c,-1)+e[f]);g===x&&(g=O(b)>=1E4?B.numberFormat(b,-1):B.numberFormat(b,-1,x,""));return g},getSeriesExtremes:function(){var a=this,b=a.chart;a.hasVisibleSeries=!1;a.dataMin=a.dataMax=a.threshold=null;a.softThreshold=!a.isXAxis;
|
||||
a.buildStacks&&a.buildStacks();o(a.series,function(c){if(c.visible||!b.options.chart.ignoreHiddenSeries){var d=c.options,e=d.threshold,f;a.hasVisibleSeries=!0;a.isLog&&e<=0&&(e=null);if(a.isXAxis){if(d=c.xData,d.length)a.dataMin=z(p(a.dataMin,d[0]),Oa(d)),a.dataMax=s(p(a.dataMax,d[0]),Da(d))}else{c.getExtremes();f=c.dataMax;c=c.dataMin;if(q(c)&&q(f))a.dataMin=z(p(a.dataMin,c),c),a.dataMax=s(p(a.dataMax,f),f);if(q(e))a.threshold=e;if(!d.softThreshold||a.isLog)a.softThreshold=!1}}})},translate:function(a,
|
||||
b,c,d,e,f){var g=this.linkedParent||this,h=1,i=0,j=d?g.oldTransA:g.transA,d=d?g.oldMin:g.min,k=g.minPixelPadding,e=(g.doPostTranslate||g.isLog&&e)&&g.lin2val;if(!j)j=g.transA;if(c)h*=-1,i=g.len;g.reversed&&(h*=-1,i-=h*(g.sector||g.len));b?(a=a*h+i,a-=k,a=a/j+d,e&&(a=g.lin2val(a))):(e&&(a=g.val2lin(a)),f==="between"&&(f=0.5),a=h*(a-d)*j+i+h*k+(qa(f)?j*f*g.pointRange:0));return a},toPixels:function(a,b){return this.translate(a,!1,!this.horiz,null,!0)+(b?0:this.pos)},toValue:function(a,b){return this.translate(a-
|
||||
(b?0:this.pos),!0,!this.horiz,null,!0)},getPlotLinePath:function(a,b,c,d,e){var f=this.chart,g=this.left,h=this.top,i,j,k=c&&f.oldChartHeight||f.chartHeight,m=c&&f.oldChartWidth||f.chartWidth,n;i=this.transB;var l=function(a,b,c){if(a<b||a>c)d?a=z(s(b,a),c):n=!0;return a},e=p(e,this.translate(a,null,null,c)),a=c=w(e+i);i=j=w(k-e-i);isNaN(e)?n=!0:this.horiz?(i=h,j=k-this.bottom,a=c=l(a,g,g+this.width)):(a=g,c=m-this.right,i=j=l(i,h,h+this.height));return n&&!d?null:f.renderer.crispLine(["M",a,i,"L",
|
||||
c,j],b||1)},getLinearTickPositions:function(a,b,c){var d,e=ea(T(b/a)*a),f=ea(ta(c/a)*a),g=[];if(b===c&&qa(b))return[b];for(b=e;b<=f;){g.push(b);b=ea(b+a);if(b===d)break;d=b}return g},getMinorTickPositions:function(){var a=this.options,b=this.tickPositions,c=this.minorTickInterval,d=[],e,f=this.pointRangePadding||0;e=this.min-f;var f=this.max+f,g=f-e;if(g&&g/c<this.len/3)if(this.isLog){f=b.length;for(e=1;e<f;e++)d=d.concat(this.getLogTickPositions(c,b[e-1],b[e],!0))}else if(this.isDatetimeAxis&&a.minorTickInterval===
|
||||
"auto")d=d.concat(this.getTimeTicks(this.normalizeTimeTickInterval(c),e,f,a.startOfWeek));else for(b=e+(b[0]-e)%c;b<=f;b+=c)d.push(b);d.length!==0&&this.trimTicks(d,a.startOnTick,a.endOnTick);return d},adjustForMinRange:function(){var a=this.options,b=this.min,c=this.max,d,e=this.dataMax-this.dataMin>=this.minRange,f,g,h,i,j,k;if(this.isXAxis&&this.minRange===x&&!this.isLog)q(a.min)||q(a.max)?this.minRange=null:(o(this.series,function(a){i=a.xData;for(g=j=a.xIncrement?1:i.length-1;g>0;g--)if(h=i[g]-
|
||||
i[g-1],f===x||h<f)f=h}),this.minRange=z(f*5,this.dataMax-this.dataMin));if(c-b<this.minRange){k=this.minRange;d=(k-c+b)/2;d=[b-d,p(a.min,b-d)];if(e)d[2]=this.dataMin;b=Da(d);c=[b+k,p(a.max,b+k)];if(e)c[2]=this.dataMax;c=Oa(c);c-b<k&&(d[0]=c-k,d[1]=p(a.min,c-k),b=Da(d))}this.min=b;this.max=c},setAxisTranslation:function(a){var b=this,c=b.max-b.min,d=b.axisPointRange||0,e,f=0,g=0,h=b.linkedParent,i=!!b.categories,j=b.transA,k=b.isXAxis;if(k||i||d)if(h?(f=h.minPointOffset,g=h.pointRangePadding):o(b.series,
|
||||
function(a){var c=i?1:k?a.pointRange:b.axisPointRange||0,h=a.options.pointPlacement,j=a.closestPointRange;d=s(d,c);b.single||(f=s(f,Ba(h)?0:c/2),g=s(g,h==="on"?0:c));!a.noSharedTooltip&&q(j)&&(e=q(e)?z(e,j):j)}),h=b.ordinalSlope&&e?b.ordinalSlope/e:1,b.minPointOffset=f*=h,b.pointRangePadding=g*=h,b.pointRange=z(d,c),k)b.closestPointRange=e;if(a)b.oldTransA=j;b.translationSlope=b.transA=j=b.len/(c+g||1);b.transB=b.horiz?b.left:b.bottom;b.minPixelPadding=j*f},minFromRange:function(){return this.max-
|
||||
this.range},setTickInterval:function(a){var b=this,c=b.chart,d=b.options,e=b.isLog,f=b.isDatetimeAxis,g=b.isXAxis,h=b.isLinked,i=d.maxPadding,j=d.minPadding,k=d.tickInterval,m=d.tickPixelInterval,n=b.categories,l=b.threshold,u=b.softThreshold,r,Z,A,v;!f&&!n&&!h&&this.getTickAmount();A=p(b.userMin,d.min);v=p(b.userMax,d.max);h?(b.linkedParent=c[b.coll][d.linkedTo],c=b.linkedParent.getExtremes(),b.min=p(c.min,c.dataMin),b.max=p(c.max,c.dataMax),d.type!==b.linkedParent.options.type&&la(11,1)):(!u&&q(l)&&
|
||||
(b.dataMin>=l?(r=l,j=0):b.dataMax<=l&&(Z=l,i=0)),b.min=p(A,r,b.dataMin),b.max=p(v,Z,b.dataMax));if(e)!a&&z(b.min,p(b.dataMin,b.min))<=0&&la(10,1),b.min=ea(Ca(b.min),15),b.max=ea(Ca(b.max),15);if(b.range&&q(b.max))b.userMin=b.min=A=s(b.min,b.minFromRange()),b.userMax=v=b.max,b.range=null;b.beforePadding&&b.beforePadding();b.adjustForMinRange();if(!n&&!b.axisPointRange&&!b.usePercentage&&!h&&q(b.min)&&q(b.max)&&(c=b.max-b.min))!q(A)&&j&&(b.min-=c*j),!q(v)&&i&&(b.max+=c*i);if(qa(d.floor))b.min=s(b.min,
|
||||
d.floor);if(qa(d.ceiling))b.max=z(b.max,d.ceiling);if(u&&q(b.dataMin))if(l=l||0,!q(A)&&b.min<l&&b.dataMin>=l)b.min=l;else if(!q(v)&&b.max>l&&b.dataMax<=l)b.max=l;b.tickInterval=b.min===b.max||b.min===void 0||b.max===void 0?1:h&&!k&&m===b.linkedParent.options.tickPixelInterval?k=b.linkedParent.tickInterval:p(k,this.tickAmount?(b.max-b.min)/s(this.tickAmount-1,1):void 0,n?1:(b.max-b.min)*m/s(b.len,m));g&&!a&&o(b.series,function(a){a.processData(b.min!==b.oldMin||b.max!==b.oldMax)});b.setAxisTranslation(!0);
|
||||
b.beforeSetTickPositions&&b.beforeSetTickPositions();if(b.postProcessTickInterval)b.tickInterval=b.postProcessTickInterval(b.tickInterval);if(b.pointRange)b.tickInterval=s(b.pointRange,b.tickInterval);a=p(d.minTickInterval,b.isDatetimeAxis&&b.closestPointRange);if(!k&&b.tickInterval<a)b.tickInterval=a;if(!f&&!e&&!k)b.tickInterval=pb(b.tickInterval,null,ob(b.tickInterval),p(d.allowDecimals,!(b.tickInterval>0.5&&b.tickInterval<5&&b.max>1E3&&b.max<9999)),!!this.tickAmount);if(!this.tickAmount&&this.len)b.tickInterval=
|
||||
b.unsquish();this.setTickPositions()},setTickPositions:function(){var a=this.options,b,c=a.tickPositions,d=a.tickPositioner,e=a.startOnTick,f=a.endOnTick,g;this.tickmarkOffset=this.categories&&a.tickmarkPlacement==="between"&&this.tickInterval===1?0.5:0;this.minorTickInterval=a.minorTickInterval==="auto"&&this.tickInterval?this.tickInterval/5:a.minorTickInterval;this.tickPositions=b=c&&c.slice();if(!b&&(b=this.isDatetimeAxis?this.getTimeTicks(this.normalizeTimeTickInterval(this.tickInterval,a.units),
|
||||
this.min,this.max,a.startOfWeek,this.ordinalPositions,this.closestPointRange,!0):this.isLog?this.getLogTickPositions(this.tickInterval,this.min,this.max):this.getLinearTickPositions(this.tickInterval,this.min,this.max),b.length>this.len&&(b=[b[0],b.pop()]),this.tickPositions=b,d&&(d=d.apply(this,[this.min,this.max]))))this.tickPositions=b=d;if(!this.isLinked)this.trimTicks(b,e,f),this.min===this.max&&q(this.min)&&!this.tickAmount&&(g=!0,this.min-=0.5,this.max+=0.5),this.single=g,!c&&!d&&this.adjustTickAmount()},
|
||||
trimTicks:function(a,b,c){var d=a[0],e=a[a.length-1],f=this.minPointOffset||0;b?this.min=d:this.min-f>d&&a.shift();c?this.max=e:this.max+f<e&&a.pop();a.length===0&&q(d)&&a.push((e+d)/2)},getTickAmount:function(){var a={},b,c=this.options,d=c.tickAmount,e=c.tickPixelInterval;!q(c.tickInterval)&&this.len<e&&!this.isRadial&&!this.isLog&&c.startOnTick&&c.endOnTick&&(d=2);!d&&this.chart.options.chart.alignTicks!==!1&&c.alignTicks!==!1&&(o(this.chart[this.coll],function(c){var d=c.options,e=c.horiz,d=[e?
|
||||
d.left:d.top,e?d.width:d.height,d.pane].join(",");c.series.length&&(a[d]?b=!0:a[d]=1)}),b&&(d=ta(this.len/e)+1));if(d<4)this.finalTickAmt=d,d=5;this.tickAmount=d},adjustTickAmount:function(){var a=this.tickInterval,b=this.tickPositions,c=this.tickAmount,d=this.finalTickAmt,e=b&&b.length;if(e<c){for(;b.length<c;)b.push(ea(b[b.length-1]+a));this.transA*=(e-1)/(c-1);this.max=b[b.length-1]}else e>c&&(this.tickInterval*=2,this.setTickPositions());if(q(d)){for(a=c=b.length;a--;)(d===3&&a%2===1||d<=2&&a>
|
||||
0&&a<c-1)&&b.splice(a,1);this.finalTickAmt=x}},setScale:function(){var a,b;this.oldMin=this.min;this.oldMax=this.max;this.oldAxisLength=this.len;this.setAxisSize();b=this.len!==this.oldAxisLength;o(this.series,function(b){if(b.isDirtyData||b.isDirty||b.xAxis.isDirty)a=!0});if(b||a||this.isLinked||this.forceRedraw||this.userMin!==this.oldUserMin||this.userMax!==this.oldUserMax){if(this.resetStacks&&this.resetStacks(),this.forceRedraw=!1,this.getSeriesExtremes(),this.setTickInterval(),this.oldUserMin=
|
||||
this.userMin,this.oldUserMax=this.userMax,!this.isDirty)this.isDirty=b||this.min!==this.oldMin||this.max!==this.oldMax}else this.cleanStacks&&this.cleanStacks()},setExtremes:function(a,b,c,d,e){var f=this,g=f.chart,c=p(c,!0);o(f.series,function(a){delete a.kdTree});e=t(e,{min:a,max:b});J(f,"setExtremes",e,function(){f.userMin=a;f.userMax=b;f.eventArgs=e;c&&g.redraw(d)})},zoom:function(a,b){var c=this.dataMin,d=this.dataMax,e=this.options,f=z(c,p(e.min,c)),e=s(d,p(e.max,d));this.allowZoomOutside||
|
||||
(q(c)&&a<=f&&(a=f),q(d)&&b>=e&&(b=e));this.displayBtn=a!==x||b!==x;this.setExtremes(a,b,!1,x,{trigger:"zoom"});return!0},setAxisSize:function(){var a=this.chart,b=this.options,c=b.offsetLeft||0,d=this.horiz,e=p(b.width,a.plotWidth-c+(b.offsetRight||0)),f=p(b.height,a.plotHeight),g=p(b.top,a.plotTop),b=p(b.left,a.plotLeft+c),c=/%$/;c.test(f)&&(f=parseFloat(f)/100*a.plotHeight);c.test(g)&&(g=parseFloat(g)/100*a.plotHeight+a.plotTop);this.left=b;this.top=g;this.width=e;this.height=f;this.bottom=a.chartHeight-
|
||||
f-g;this.right=a.chartWidth-e-b;this.len=s(d?e:f,0);this.pos=d?b:g},getExtremes:function(){var a=this.isLog;return{min:a?ea(ia(this.min)):this.min,max:a?ea(ia(this.max)):this.max,dataMin:this.dataMin,dataMax:this.dataMax,userMin:this.userMin,userMax:this.userMax}},getThreshold:function(a){var b=this.isLog,c=b?ia(this.min):this.min,b=b?ia(this.max):this.max;a===null?a=b<0?b:c:c>a?a=c:b<a&&(a=b);return this.translate(a,0,1,0,1)},autoLabelAlign:function(a){a=(p(a,0)-this.side*90+720)%360;return a>15&&
|
||||
a<165?"right":a>195&&a<345?"left":"center"},unsquish:function(){var a=this.ticks,b=this.options.labels,c=this.horiz,d=this.tickInterval,e=d,f=this.len/(((this.categories?1:0)+this.max-this.min)/d),g,h=b.rotation,i=this.chart.renderer.fontMetrics(b.style.fontSize,a[0]&&a[0].label),j,k=Number.MAX_VALUE,m,n=function(a){a/=f||1;a=a>1?ta(a):1;return a*d};c?(m=!b.staggerLines&&!b.step&&(q(h)?[h]:f<p(b.autoRotationLimit,80)&&b.autoRotation))&&o(m,function(a){var b;if(a===h||a&&a>=-90&&a<=90)j=n(O(i.h/aa(ga*
|
||||
a))),b=j+O(a/360),b<k&&(k=b,g=a,e=j)}):b.step||(e=n(i.h));this.autoRotation=m;this.labelRotation=p(g,h);return e},renderUnsquish:function(){var a=this.chart,b=a.renderer,c=this.tickPositions,d=this.ticks,e=this.options.labels,f=this.horiz,g=a.margin,h=this.categories?c.length:c.length-1,i=this.slotWidth=f&&!e.step&&!e.rotation&&(this.staggerLines||1)*a.plotWidth/h||!f&&(g[3]&&g[3]-a.spacing[3]||a.chartWidth*0.33),j=s(1,w(i-2*(e.padding||5))),k={},g=b.fontMetrics(e.style.fontSize,d[0]&&d[0].label),
|
||||
h=e.style.textOverflow,m,n=0;if(!Ba(e.rotation))k.rotation=e.rotation||0;if(this.autoRotation)o(c,function(a){if((a=d[a])&&a.labelLength>n)n=a.labelLength}),n>j&&n>g.h?k.rotation=this.labelRotation:this.labelRotation=0;else if(i&&(m={width:j+"px"},!h)){m.textOverflow="clip";for(i=c.length;!f&&i--;)if(j=c[i],j=d[j].label)if(j.styles.textOverflow==="ellipsis"&&j.css({textOverflow:"clip"}),j.getBBox().height>this.len/c.length-(g.h-g.f))j.specCss={textOverflow:"ellipsis"}}if(k.rotation&&(m={width:(n>
|
||||
a.chartHeight*0.5?a.chartHeight*0.33:a.chartHeight)+"px"},!h))m.textOverflow="ellipsis";this.labelAlign=k.align=e.align||this.autoLabelAlign(this.labelRotation);o(c,function(a){var b=(a=d[a])&&a.label;if(b)b.attr(k),m&&b.css(D(m,b.specCss)),delete b.specCss,a.rotation=k.rotation});this.tickRotCorr=b.rotCorr(g.b,this.labelRotation||0,this.side===2)},hasData:function(){return this.hasVisibleSeries||q(this.min)&&q(this.max)&&!!this.tickPositions},getOffset:function(){var a=this,b=a.chart,c=b.renderer,
|
||||
d=a.options,e=a.tickPositions,f=a.ticks,g=a.horiz,h=a.side,i=b.inverted?[1,0,3,2][h]:h,j,k,m=0,n,l=0,u=d.title,r=d.labels,Z=0,A=b.axisOffset,b=b.clipOffset,v=[-1,1,1,-1][h],y,t=a.axisParent;j=a.hasData();a.showAxis=k=j||p(d.showEmpty,!0);a.staggerLines=a.horiz&&r.staggerLines;if(!a.axisGroup)a.gridGroup=c.g("grid").attr({zIndex:d.gridZIndex||1}).add(t),a.axisGroup=c.g("axis").attr({zIndex:d.zIndex||2}).add(t),a.labelGroup=c.g("axis-labels").attr({zIndex:r.zIndex||7}).addClass("highcharts-"+a.coll.toLowerCase()+
|
||||
"-labels").add(t);if(j||a.isLinked){if(o(e,function(b){f[b]?f[b].addLabel():f[b]=new Sa(a,b)}),a.renderUnsquish(),o(e,function(b){if(h===0||h===2||{1:"left",3:"right"}[h]===a.labelAlign)Z=s(f[b].getLabelSize(),Z)}),a.staggerLines)Z*=a.staggerLines,a.labelOffset=Z}else for(y in f)f[y].destroy(),delete f[y];if(u&&u.text&&u.enabled!==!1){if(!a.axisTitle)a.axisTitle=c.text(u.text,0,0,u.useHTML).attr({zIndex:7,rotation:u.rotation||0,align:u.textAlign||{low:"left",middle:"center",high:"right"}[u.align]}).addClass("highcharts-"+
|
||||
this.coll.toLowerCase()+"-title").css(u.style).add(a.axisGroup),a.axisTitle.isNew=!0;if(k)m=a.axisTitle.getBBox()[g?"height":"width"],n=u.offset,l=q(n)?0:p(u.margin,g?5:10);a.axisTitle[k?"show":"hide"]()}a.offset=v*p(d.offset,A[h]);a.tickRotCorr=a.tickRotCorr||{x:0,y:0};c=h===2?a.tickRotCorr.y:0;g=Z+l+(Z&&v*(g?p(r.y,a.tickRotCorr.y+8):r.x)-c);a.axisTitleMargin=p(n,g);A[h]=s(A[h],a.axisTitleMargin+m+v*a.offset,g);d=d.offset?0:T(d.lineWidth/2)*2;b[i]=s(b[i],d)},getLinePath:function(a){var b=this.chart,
|
||||
c=this.opposite,d=this.offset,e=this.horiz,f=this.left+(c?this.width:0)+d,d=b.chartHeight-this.bottom-(c?this.height:0)+d;c&&(a*=-1);return b.renderer.crispLine(["M",e?this.left:f,e?d:this.top,"L",e?b.chartWidth-this.right:f,e?d:b.chartHeight-this.bottom],a)},getTitlePosition:function(){var a=this.horiz,b=this.left,c=this.top,d=this.len,e=this.options.title,f=a?b:c,g=this.opposite,h=this.offset,i=e.x||0,j=e.y||0,k=G(e.style.fontSize||12),d={low:f+(a?0:d),middle:f+d/2,high:f+(a?d:0)}[e.align],b=(a?
|
||||
c+this.height:b)+(a?1:-1)*(g?-1:1)*this.axisTitleMargin+(this.side===2?k:0);return{x:a?d+i:b+(g?this.width:0)+h+i,y:a?b+j-(g?this.height:0)+h:d+j}},render:function(){var a=this,b=a.chart,c=b.renderer,d=a.options,e=a.isLog,f=a.isLinked,g=a.tickPositions,h=a.axisTitle,i=a.ticks,j=a.minorTicks,k=a.alternateBands,m=d.stackLabels,n=d.alternateGridColor,l=a.tickmarkOffset,u=d.lineWidth,r,p=b.hasRendered&&q(a.oldMin)&&!isNaN(a.oldMin),A=a.showAxis,v=c.globalAnimation,y,s;a.labelEdge.length=0;a.overlap=!1;
|
||||
o([i,j,k],function(a){for(var b in a)a[b].isActive=!1});if(a.hasData()||f){a.minorTickInterval&&!a.categories&&o(a.getMinorTickPositions(),function(b){j[b]||(j[b]=new Sa(a,b,"minor"));p&&j[b].isNew&&j[b].render(null,!0);j[b].render(null,!1,1)});if(g.length&&(o(g,function(b,c){if(!f||b>=a.min&&b<=a.max)i[b]||(i[b]=new Sa(a,b)),p&&i[b].isNew&&i[b].render(c,!0,0.1),i[b].render(c)}),l&&(a.min===0||a.single)))i[-1]||(i[-1]=new Sa(a,-1,null,!0)),i[-1].render(-1);n&&o(g,function(b,c){s=g[c+1]!==x?g[c+1]+
|
||||
l:a.max-l;if(c%2===0&&b<a.max&&s<=a.max-l)k[b]||(k[b]=new B.PlotLineOrBand(a)),y=b+l,k[b].options={from:e?ia(y):y,to:e?ia(s):s,color:n},k[b].render(),k[b].isActive=!0});if(!a._addedPlotLB)o((d.plotLines||[]).concat(d.plotBands||[]),function(b){a.addPlotBandOrLine(b)}),a._addedPlotLB=!0}o([i,j,k],function(a){var c,d,e=[],f=v?v.duration||500:0,g=function(){for(d=e.length;d--;)a[e[d]]&&!a[e[d]].isActive&&(a[e[d]].destroy(),delete a[e[d]])};for(c in a)if(!a[c].isActive)a[c].render(c,!1,0),a[c].isActive=
|
||||
!1,e.push(c);a===k||!b.hasRendered||!f?g():f&&setTimeout(g,f)});if(u)r=a.getLinePath(u),a.axisLine?a.axisLine.animate({d:r}):a.axisLine=c.path(r).attr({stroke:d.lineColor,"stroke-width":u,zIndex:7}).add(a.axisGroup),a.axisLine[A?"show":"hide"]();if(h&&A)h[h.isNew?"attr":"animate"](a.getTitlePosition()),h.isNew=!1;m&&m.enabled&&a.renderStackTotals();a.isDirty=!1},redraw:function(){this.visible&&(this.render(),o(this.plotLinesAndBands,function(a){a.render()}));o(this.series,function(a){a.isDirty=!0})},
|
||||
destroy:function(a){var b=this,c=b.stacks,d,e=b.plotLinesAndBands;a||Y(b);for(d in c)Pa(c[d]),c[d]=null;o([b.ticks,b.minorTicks,b.alternateBands],function(a){Pa(a)});for(a=e.length;a--;)e[a].destroy();o("stackTotalGroup,axisLine,axisTitle,axisGroup,cross,gridGroup,labelGroup".split(","),function(a){b[a]&&(b[a]=b[a].destroy())});this.cross&&this.cross.destroy()},drawCrosshair:function(a,b){var c,d=this.crosshair,e=d.animation;if(!this.crosshair||(q(b)||!p(this.crosshair.snap,!0))===!1||b&&b.series&&
|
||||
b.series[this.coll]!==this)this.hideCrosshair();else if(p(d.snap,!0)?q(b)&&(c=this.isXAxis?b.plotX:this.len-b.plotY):c=this.horiz?a.chartX-this.pos:this.len-a.chartY+this.pos,c=this.isRadial?this.getPlotLinePath(this.isXAxis?b.x:p(b.stackY,b.y))||null:this.getPlotLinePath(null,null,null,null,c)||null,c===null)this.hideCrosshair();else if(this.cross)this.cross.attr({visibility:"visible"})[e?"animate":"attr"]({d:c},e);else{e=this.categories&&!this.isRadial;e={"stroke-width":d.width||(e?this.transA:
|
||||
1),stroke:d.color||(e?"rgba(155,200,255,0.2)":"#C0C0C0"),zIndex:d.zIndex||2};if(d.dashStyle)e.dashstyle=d.dashStyle;this.cross=this.chart.renderer.path(c).attr(e).add()}},hideCrosshair:function(){this.cross&&this.cross.hide()}};t(ha.prototype,{getPlotBandPath:function(a,b){var c=this.getPlotLinePath(b,null,null,!0),d=this.getPlotLinePath(a,null,null,!0);d&&c&&d.toString()!==c.toString()?d.push(c[4],c[5],c[1],c[2]):d=null;return d},addPlotBand:function(a){return this.addPlotBandOrLine(a,"plotBands")},
|
||||
addPlotLine:function(a){return this.addPlotBandOrLine(a,"plotLines")},addPlotBandOrLine:function(a,b){var c=(new B.PlotLineOrBand(this,a)).render(),d=this.userOptions;c&&(b&&(d[b]=d[b]||[],d[b].push(a)),this.plotLinesAndBands.push(c));return c},removePlotBandOrLine:function(a){for(var b=this.plotLinesAndBands,c=this.options,d=this.userOptions,e=b.length;e--;)b[e].id===a&&b[e].destroy();o([c.plotLines||[],d.plotLines||[],c.plotBands||[],d.plotBands||[]],function(b){for(e=b.length;e--;)b[e].id===a&&
|
||||
ja(b,b[e])})}});ha.prototype.getTimeTicks=function(a,b,c,d){var e=[],f={},g=S.global.useUTC,h,i=new ya(b-Wa(b)),j=a.unitRange,k=a.count;if(q(b)){i[Db](j>=F.second?0:k*T(i.getMilliseconds()/k));if(j>=F.second)i[Eb](j>=F.minute?0:k*T(i.getSeconds()/k));if(j>=F.minute)i[Fb](j>=F.hour?0:k*T(i[rb]()/k));if(j>=F.hour)i[Gb](j>=F.day?0:k*T(i[sb]()/k));if(j>=F.day)i[ub](j>=F.month?1:k*T(i[Xa]()/k));j>=F.month&&(i[vb](j>=F.year?0:k*T(i[Ya]()/k)),h=i[Za]());j>=F.year&&(h-=h%k,i[wb](h));if(j===F.week)i[ub](i[Xa]()-
|
||||
i[tb]()+p(d,1));b=1;if(nb||db)i=i.getTime(),i=new ya(i+Wa(i));h=i[Za]();for(var d=i.getTime(),m=i[Ya](),n=i[Xa](),l=(F.day+(g?Wa(i):i.getTimezoneOffset()*6E4))%F.day;d<c;)e.push(d),j===F.year?d=fb(h+b*k,0):j===F.month?d=fb(h,m+b*k):!g&&(j===F.day||j===F.week)?d=fb(h,m,n+b*k*(j===F.day?1:7)):d+=j*k,b++;e.push(d);o(kb(e,function(a){return j<=F.hour&&a%F.day===l}),function(a){f[a]="day"})}e.info=t(a,{higherRanks:f,totalRange:j*k});return e};ha.prototype.normalizeTimeTickInterval=function(a,b){var c=
|
||||
b||[["millisecond",[1,2,5,10,20,25,50,100,200,500]],["second",[1,2,5,10,15,30]],["minute",[1,2,5,10,15,30]],["hour",[1,2,3,4,6,8,12]],["day",[1,2]],["week",[1,2]],["month",[1,2,3,4,6]],["year",null]],d=c[c.length-1],e=F[d[0]],f=d[1],g;for(g=0;g<c.length;g++)if(d=c[g],e=F[d[0]],f=d[1],c[g+1]&&a<=(e*f[f.length-1]+F[c[g+1][0]])/2)break;e===F.year&&a<5*e&&(f=[1,2,5]);c=pb(a/e,f,d[0]==="year"?s(ob(a/e),1):1);return{unitRange:e,count:c,unitName:d[0]}};ha.prototype.getLogTickPositions=function(a,b,c,d){var e=
|
||||
this.options,f=this.len,g=[];if(!d)this._minorAutoInterval=null;if(a>=0.5)a=w(a),g=this.getLinearTickPositions(a,b,c);else if(a>=0.08)for(var f=T(b),h,i,j,k,m,e=a>0.3?[1,2,4]:a>0.15?[1,2,4,6,8]:[1,2,3,4,5,6,7,8,9];f<c+1&&!m;f++){i=e.length;for(h=0;h<i&&!m;h++)j=Ca(ia(f)*e[h]),j>b&&(!d||k<=c)&&k!==x&&g.push(k),k>c&&(m=!0),k=j}else if(b=ia(b),c=ia(c),a=e[d?"minorTickInterval":"tickInterval"],a=p(a==="auto"?null:a,this._minorAutoInterval,(c-b)*(e.tickPixelInterval/(d?5:1))/((d?f/this.tickPositions.length:
|
||||
f)||1)),a=pb(a,null,ob(a)),g=Ua(this.getLinearTickPositions(a,b,c),Ca),!d)this._minorAutoInterval=a/5;if(!d)this.tickInterval=a;return g};var Mb=B.Tooltip=function(){this.init.apply(this,arguments)};Mb.prototype={init:function(a,b){var c=b.borderWidth,d=b.style,e=G(d.padding);this.chart=a;this.options=b;this.crosshairs=[];this.now={x:0,y:0};this.isHidden=!0;this.label=a.renderer.label("",0,0,b.shape||"callout",null,null,b.useHTML,null,"tooltip").attr({padding:e,fill:b.backgroundColor,"stroke-width":c,
|
||||
r:b.borderRadius,zIndex:8}).css(d).css({padding:0}).add().attr({y:-9999});fa||this.label.shadow(b.shadow);this.shared=b.shared},destroy:function(){if(this.label)this.label=this.label.destroy();clearTimeout(this.hideTimer);clearTimeout(this.tooltipTimeout)},move:function(a,b,c,d){var e=this,f=e.now,g=e.options.animation!==!1&&!e.isHidden&&(O(a-f.x)>1||O(b-f.y)>1),h=e.followPointer||e.len>1;t(f,{x:g?(2*f.x+a)/3:a,y:g?(f.y+b)/2:b,anchorX:h?x:g?(2*f.anchorX+c)/3:c,anchorY:h?x:g?(f.anchorY+d)/2:d});e.label.attr(f);
|
||||
if(g)clearTimeout(this.tooltipTimeout),this.tooltipTimeout=setTimeout(function(){e&&e.move(a,b,c,d)},32)},hide:function(a){var b=this;clearTimeout(this.hideTimer);if(!this.isHidden)this.hideTimer=setTimeout(function(){b.label.fadeOut();b.isHidden=!0},p(a,this.options.hideDelay,500))},getAnchor:function(a,b){var c,d=this.chart,e=d.inverted,f=d.plotTop,g=d.plotLeft,h=0,i=0,j,k,a=ra(a);c=a[0].tooltipPos;this.followPointer&&b&&(b.chartX===x&&(b=d.pointer.normalize(b)),c=[b.chartX-d.plotLeft,b.chartY-
|
||||
f]);c||(o(a,function(a){j=a.series.yAxis;k=a.series.xAxis;h+=a.plotX+(!e&&k?k.left-g:0);i+=(a.plotLow?(a.plotLow+a.plotHigh)/2:a.plotY)+(!e&&j?j.top-f:0)}),h/=a.length,i/=a.length,c=[e?d.plotWidth-i:h,this.shared&&!e&&a.length>1&&b?b.chartY-f:e?d.plotHeight-h:i]);return Ua(c,w)},getPosition:function(a,b,c){var d=this.chart,e=this.distance,f={},g=c.h||0,h,i=["y",d.chartHeight,b,c.plotY+d.plotTop,d.plotTop,d.plotTop+d.plotHeight],j=["x",d.chartWidth,a,c.plotX+d.plotLeft,d.plotLeft,d.plotLeft+d.plotWidth],
|
||||
k=p(c.ttBelow,d.inverted&&!c.negative||!d.inverted&&c.negative),m=function(a,b,c,d,h,i){var j=c<d-e,n=d+e+c<b,m=d-e-c;d+=e;if(k&&n)f[a]=d;else if(!k&&j)f[a]=m;else if(j)f[a]=z(i-c,m-g<0?m:m-g);else if(n)f[a]=s(h,d+g+c>b?d:d+g);else return!1},n=function(a,b,c,d){if(d<e||d>b-e)return!1;else f[a]=d<c/2?1:d>b-c/2?b-c-2:d-c/2},l=function(a){var b=i;i=j;j=b;h=a},u=function(){m.apply(0,i)!==!1?n.apply(0,j)===!1&&!h&&(l(!0),u()):h?f.x=f.y=0:(l(!0),u())};(d.inverted||this.len>1)&&l();u();return f},defaultFormatter:function(a){var b=
|
||||
this.points||ra(this),c;c=[a.tooltipFooterHeaderFormatter(b[0])];c=c.concat(a.bodyFormatter(b));c.push(a.tooltipFooterHeaderFormatter(b[0],!0));return c.join("")},refresh:function(a,b){var c=this.chart,d=this.label,e=this.options,f,g,h,i={},j,k=[];j=e.formatter||this.defaultFormatter;var i=c.hoverPoints,m,n=this.shared;clearTimeout(this.hideTimer);this.followPointer=ra(a)[0].series.tooltipOptions.followPointer;h=this.getAnchor(a,b);f=h[0];g=h[1];n&&(!a.series||!a.series.noSharedTooltip)?(c.hoverPoints=
|
||||
a,i&&o(i,function(a){a.setState()}),o(a,function(a){a.setState("hover");k.push(a.getLabelConfig())}),i={x:a[0].category,y:a[0].y},i.points=k,this.len=k.length,a=a[0]):i=a.getLabelConfig();j=j.call(i,this);i=a.series;this.distance=p(i.tooltipOptions.distance,16);j===!1?this.hide():(this.isHidden&&(cb(d),d.attr("opacity",1).show()),d.attr({text:j}),m=e.borderColor||a.color||i.color||"#606060",d.attr({stroke:m}),this.updatePosition({plotX:f,plotY:g,negative:a.negative,ttBelow:a.ttBelow,h:h[2]||0}),this.isHidden=
|
||||
!1);J(c,"tooltipRefresh",{text:j,x:f+c.plotLeft,y:g+c.plotTop,borderColor:m})},updatePosition:function(a){var b=this.chart,c=this.label,c=(this.options.positioner||this.getPosition).call(this,c.width,c.height,a);this.move(w(c.x),w(c.y||0),a.plotX+b.plotLeft,a.plotY+b.plotTop)},getXDateFormat:function(a,b,c){var d,b=b.dateTimeLabelFormats,e=c&&c.closestPointRange,f,g={millisecond:15,second:12,minute:9,hour:6,day:3},h,i="millisecond";if(e){h=Na("%m-%d %H:%M:%S.%L",a.x);for(f in F){if(e===F.week&&+Na("%w",
|
||||
a.x)===c.options.startOfWeek&&h.substr(6)==="00:00:00.000"){f="week";break}else if(F[f]>e){f=i;break}else if(g[f]&&h.substr(g[f])!=="01-01 00:00:00.000".substr(g[f]))break;f!=="week"&&(i=f)}f&&(d=b[f])}else d=b.day;return d||b.year},tooltipFooterHeaderFormatter:function(a,b){var c=b?"footer":"header",d=a.series,e=d.tooltipOptions,f=e.xDateFormat,g=d.xAxis,h=g&&g.options.type==="datetime"&&qa(a.key),c=e[c+"Format"];h&&!f&&(f=this.getXDateFormat(a,e,g));h&&f&&(c=c.replace("{point.key}","{point.key:"+
|
||||
f+"}"));return Ia(c,{point:a,series:d})},bodyFormatter:function(a){return Ua(a,function(a){var c=a.series.tooltipOptions;return(c.pointFormatter||a.point.tooltipFormatter).call(a.point,c.pointFormat)})}};var oa;ab=C.documentElement.ontouchstart!==x;var Va=B.Pointer=function(a,b){this.init(a,b)};Va.prototype={init:function(a,b){var c=b.chart,d=c.events,e=fa?"":c.zoomType,c=a.inverted,f;this.options=b;this.chart=a;this.zoomX=f=/x/.test(e);this.zoomY=e=/y/.test(e);this.zoomHor=f&&!c||e&&c;this.zoomVert=
|
||||
e&&!c||f&&c;this.hasZoom=f||e;this.runChartClick=d&&!!d.click;this.pinchDown=[];this.lastValidTouch={};if(B.Tooltip&&b.tooltip.enabled)a.tooltip=new Mb(a,b.tooltip),this.followTouchMove=p(b.tooltip.followTouchMove,!0);this.setDOMEvents()},normalize:function(a,b){var c,d,a=a||window.event,a=Sb(a);if(!a.target)a.target=a.srcElement;d=a.touches?a.touches.length?a.touches.item(0):a.changedTouches[0]:a;if(!b)this.chartPosition=b=Rb(this.chart.container);d.pageX===x?(c=s(a.x,a.clientX-b.left),d=a.y):(c=
|
||||
d.pageX-b.left,d=d.pageY-b.top);return t(a,{chartX:w(c),chartY:w(d)})},getCoordinates:function(a){var b={xAxis:[],yAxis:[]};o(this.chart.axes,function(c){b[c.isXAxis?"xAxis":"yAxis"].push({axis:c,value:c.toValue(a[c.horiz?"chartX":"chartY"])})});return b},runPointActions:function(a){var b=this.chart,c=b.series,d=b.tooltip,e=d?d.shared:!1,f=b.hoverPoint,g=b.hoverSeries,h,i=Number.MAX_VALUE,j,k,m=[],n,l;if(!e&&!g)for(h=0;h<c.length;h++)if(c[h].directTouch||!c[h].options.stickyTracking)c=[];g&&(e?g.noSharedTooltip:
|
||||
g.directTouch)&&f?n=f:(o(c,function(b){j=b.noSharedTooltip&&e;k=!e&&b.directTouch;b.visible&&!j&&!k&&p(b.options.enableMouseTracking,!0)&&(l=b.searchPoint(a,!j&&b.kdDimensions===1))&&m.push(l)}),o(m,function(a){if(a&&typeof a.dist==="number"&&a.dist<i)i=a.dist,n=a}));if(n&&(n!==this.prevKDPoint||d&&d.isHidden)){if(e&&!n.series.noSharedTooltip){for(h=m.length;h--;)(m[h].clientX!==n.clientX||m[h].series.noSharedTooltip)&&m.splice(h,1);m.length&&d&&d.refresh(m,a);o(m,function(b){b.onMouseOver(a,b!==
|
||||
(g&&g.directTouch&&f||n))})}else if(d&&d.refresh(n,a),!g||!g.directTouch)n.onMouseOver(a);this.prevKDPoint=n}else c=g&&g.tooltipOptions.followPointer,d&&c&&!d.isHidden&&(c=d.getAnchor([{}],a),d.updatePosition({plotX:c[0],plotY:c[1]}));if(d&&!this._onDocumentMouseMove)this._onDocumentMouseMove=function(a){if(X[oa])X[oa].pointer.onDocumentMouseMove(a)},I(C,"mousemove",this._onDocumentMouseMove);o(b.axes,function(b){b.drawCrosshair(a,p(n,f))})},reset:function(a,b){var c=this.chart,d=c.hoverSeries,e=
|
||||
c.hoverPoint,f=c.hoverPoints,g=c.tooltip,h=g&&g.shared?f:e;(a=a&&g&&h)&&ra(h)[0].plotX===x&&(a=!1);if(a)g.refresh(h),e&&(e.setState(e.state,!0),o(c.axes,function(a){p(a.options.crosshair&&a.options.crosshair.snap,!0)?a.drawCrosshair(null,e):a.hideCrosshair()}));else{if(e)e.onMouseOut();f&&o(f,function(a){a.setState()});if(d)d.onMouseOut();g&&g.hide(b);if(this._onDocumentMouseMove)Y(C,"mousemove",this._onDocumentMouseMove),this._onDocumentMouseMove=null;o(c.axes,function(a){a.hideCrosshair()});this.hoverX=
|
||||
c.hoverPoints=c.hoverPoint=null}},scaleGroups:function(a,b){var c=this.chart,d;o(c.series,function(e){d=a||e.getPlotBox();e.xAxis&&e.xAxis.zoomEnabled&&(e.group.attr(d),e.markerGroup&&(e.markerGroup.attr(d),e.markerGroup.clip(b?c.clipRect:null)),e.dataLabelsGroup&&e.dataLabelsGroup.attr(d))});c.clipRect.attr(b||c.clipBox)},dragStart:function(a){var b=this.chart;b.mouseIsDown=a.type;b.cancelClick=!1;b.mouseDownX=this.mouseDownX=a.chartX;b.mouseDownY=this.mouseDownY=a.chartY},drag:function(a){var b=
|
||||
this.chart,c=b.options.chart,d=a.chartX,e=a.chartY,f=this.zoomHor,g=this.zoomVert,h=b.plotLeft,i=b.plotTop,j=b.plotWidth,k=b.plotHeight,m,n=this.selectionMarker,l=this.mouseDownX,u=this.mouseDownY,r=c.panKey&&a[c.panKey+"Key"];if(!n||!n.touch)if(d<h?d=h:d>h+j&&(d=h+j),e<i?e=i:e>i+k&&(e=i+k),this.hasDragged=Math.sqrt(Math.pow(l-d,2)+Math.pow(u-e,2)),this.hasDragged>10){m=b.isInsidePlot(l-h,u-i);if(b.hasCartesianSeries&&(this.zoomX||this.zoomY)&&m&&!r&&!n)this.selectionMarker=n=b.renderer.rect(h,i,
|
||||
f?1:j,g?1:k,0).attr({fill:c.selectionMarkerFill||"rgba(69,114,167,0.25)",zIndex:7}).add();n&&f&&(d-=l,n.attr({width:O(d),x:(d>0?0:d)+l}));n&&g&&(d=e-u,n.attr({height:O(d),y:(d>0?0:d)+u}));m&&!n&&c.panning&&b.pan(a,c.panning)}},drop:function(a){var b=this,c=this.chart,d=this.hasPinched;if(this.selectionMarker){var e={xAxis:[],yAxis:[],originalEvent:a.originalEvent||a},f=this.selectionMarker,g=f.attr?f.attr("x"):f.x,h=f.attr?f.attr("y"):f.y,i=f.attr?f.attr("width"):f.width,j=f.attr?f.attr("height"):
|
||||
f.height,k;if(this.hasDragged||d)o(c.axes,function(c){if(c.zoomEnabled&&q(c.min)&&(d||b[{xAxis:"zoomX",yAxis:"zoomY"}[c.coll]])){var f=c.horiz,l=a.type==="touchend"?c.minPixelPadding:0,u=c.toValue((f?g:h)+l),f=c.toValue((f?g+i:h+j)-l);e[c.coll].push({axis:c,min:z(u,f),max:s(u,f)});k=!0}}),k&&J(c,"selection",e,function(a){c.zoom(t(a,d?{animation:!1}:null))});this.selectionMarker=this.selectionMarker.destroy();d&&this.scaleGroups()}if(c)M(c.container,{cursor:c._cursor}),c.cancelClick=this.hasDragged>
|
||||
10,c.mouseIsDown=this.hasDragged=this.hasPinched=!1,this.pinchDown=[]},onContainerMouseDown:function(a){a=this.normalize(a);a.preventDefault&&a.preventDefault();this.dragStart(a)},onDocumentMouseUp:function(a){X[oa]&&X[oa].pointer.drop(a)},onDocumentMouseMove:function(a){var b=this.chart,c=this.chartPosition,a=this.normalize(a,c);c&&!this.inClass(a.target,"highcharts-tracker")&&!b.isInsidePlot(a.chartX-b.plotLeft,a.chartY-b.plotTop)&&this.reset()},onContainerMouseLeave:function(){var a=X[oa];if(a)a.pointer.reset(),
|
||||
a.pointer.chartPosition=null},onContainerMouseMove:function(a){var b=this.chart;oa=b.index;a=this.normalize(a);a.returnValue=!1;b.mouseIsDown==="mousedown"&&this.drag(a);(this.inClass(a.target,"highcharts-tracker")||b.isInsidePlot(a.chartX-b.plotLeft,a.chartY-b.plotTop))&&!b.openMenu&&this.runPointActions(a)},inClass:function(a,b){for(var c;a;){if(c=K(a,"class"))if(c.indexOf(b)!==-1)return!0;else if(c.indexOf("highcharts-container")!==-1)return!1;a=a.parentNode}},onTrackerMouseOut:function(a){var b=
|
||||
this.chart.hoverSeries,a=a.relatedTarget||a.toElement;if(b&&!b.options.stickyTracking&&!this.inClass(a,"highcharts-tooltip")&&!this.inClass(a,"highcharts-series-"+b.index))b.onMouseOut()},onContainerClick:function(a){var b=this.chart,c=b.hoverPoint,d=b.plotLeft,e=b.plotTop,a=this.normalize(a);a.originalEvent=a;b.cancelClick||(c&&this.inClass(a.target,"highcharts-tracker")?(J(c.series,"click",t(a,{point:c})),b.hoverPoint&&c.firePointEvent("click",a)):(t(a,this.getCoordinates(a)),b.isInsidePlot(a.chartX-
|
||||
d,a.chartY-e)&&J(b,"click",a)))},setDOMEvents:function(){var a=this,b=a.chart.container;b.onmousedown=function(b){a.onContainerMouseDown(b)};b.onmousemove=function(b){a.onContainerMouseMove(b)};b.onclick=function(b){a.onContainerClick(b)};I(b,"mouseleave",a.onContainerMouseLeave);bb===1&&I(C,"mouseup",a.onDocumentMouseUp);if(ab)b.ontouchstart=function(b){a.onContainerTouchStart(b)},b.ontouchmove=function(b){a.onContainerTouchMove(b)},bb===1&&I(C,"touchend",a.onDocumentTouchEnd)},destroy:function(){var a;
|
||||
Y(this.chart.container,"mouseleave",this.onContainerMouseLeave);bb||(Y(C,"mouseup",this.onDocumentMouseUp),Y(C,"touchend",this.onDocumentTouchEnd));clearInterval(this.tooltipTimeout);for(a in this)this[a]=null}};t(B.Pointer.prototype,{pinchTranslate:function(a,b,c,d,e,f){(this.zoomHor||this.pinchHor)&&this.pinchTranslateDirection(!0,a,b,c,d,e,f);(this.zoomVert||this.pinchVert)&&this.pinchTranslateDirection(!1,a,b,c,d,e,f)},pinchTranslateDirection:function(a,b,c,d,e,f,g,h){var i=this.chart,j=a?"x":
|
||||
"y",k=a?"X":"Y",m="chart"+k,n=a?"width":"height",l=i["plot"+(a?"Left":"Top")],u,r,p=h||1,o=i.inverted,v=i.bounds[a?"h":"v"],s=b.length===1,q=b[0][m],t=c[0][m],x=!s&&b[1][m],w=!s&&c[1][m],z,c=function(){!s&&O(q-x)>20&&(p=h||O(t-w)/O(q-x));r=(l-t)/p+q;u=i["plot"+(a?"Width":"Height")]/p};c();b=r;b<v.min?(b=v.min,z=!0):b+u>v.max&&(b=v.max-u,z=!0);z?(t-=0.8*(t-g[j][0]),s||(w-=0.8*(w-g[j][1])),c()):g[j]=[t,w];o||(f[j]=r-l,f[n]=u);f=o?1/p:p;e[n]=u;e[j]=b;d[o?a?"scaleY":"scaleX":"scale"+k]=p;d["translate"+
|
||||
k]=f*l+(t-f*q)},pinch:function(a){var b=this,c=b.chart,d=b.pinchDown,e=a.touches,f=e.length,g=b.lastValidTouch,h=b.hasZoom,i=b.selectionMarker,j={},k=f===1&&(b.inClass(a.target,"highcharts-tracker")&&c.runTrackerClick||b.runChartClick),m={};if(f>1)b.initiated=!0;h&&b.initiated&&!k&&a.preventDefault();Ua(e,function(a){return b.normalize(a)});if(a.type==="touchstart")o(e,function(a,b){d[b]={chartX:a.chartX,chartY:a.chartY}}),g.x=[d[0].chartX,d[1]&&d[1].chartX],g.y=[d[0].chartY,d[1]&&d[1].chartY],o(c.axes,
|
||||
function(a){if(a.zoomEnabled){var b=c.bounds[a.horiz?"h":"v"],d=a.minPixelPadding,e=a.toPixels(p(a.options.min,a.dataMin)),f=a.toPixels(p(a.options.max,a.dataMax)),g=z(e,f),e=s(e,f);b.min=z(a.pos,g-d);b.max=s(a.pos+a.len,e+d)}}),b.res=!0;else if(d.length){if(!i)b.selectionMarker=i=t({destroy:ua,touch:!0},c.plotBox);b.pinchTranslate(d,e,j,i,m,g);b.hasPinched=h;b.scaleGroups(j,m);if(!h&&b.followTouchMove&&f===1)this.runPointActions(b.normalize(a));else if(b.res)b.res=!1,this.reset(!1,0)}},touch:function(a,
|
||||
b){var c=this.chart;oa=c.index;a.touches.length===1?(a=this.normalize(a),c.isInsidePlot(a.chartX-c.plotLeft,a.chartY-c.plotTop)&&!c.openMenu?(b&&this.runPointActions(a),this.pinch(a)):b&&this.reset()):a.touches.length===2&&this.pinch(a)},onContainerTouchStart:function(a){this.touch(a,!0)},onContainerTouchMove:function(a){this.touch(a)},onDocumentTouchEnd:function(a){X[oa]&&X[oa].pointer.drop(a)}});if(L.PointerEvent||L.MSPointerEvent){var wa={},Ab=!!L.PointerEvent,Wb=function(){var a,b=[];b.item=function(a){return this[a]};
|
||||
for(a in wa)wa.hasOwnProperty(a)&&b.push({pageX:wa[a].pageX,pageY:wa[a].pageY,target:wa[a].target});return b},Bb=function(a,b,c,d){a=a.originalEvent||a;if((a.pointerType==="touch"||a.pointerType===a.MSPOINTER_TYPE_TOUCH)&&X[oa])d(a),d=X[oa].pointer,d[b]({type:c,target:a.currentTarget,preventDefault:ua,touches:Wb()})};t(Va.prototype,{onContainerPointerDown:function(a){Bb(a,"onContainerTouchStart","touchstart",function(a){wa[a.pointerId]={pageX:a.pageX,pageY:a.pageY,target:a.currentTarget}})},onContainerPointerMove:function(a){Bb(a,
|
||||
"onContainerTouchMove","touchmove",function(a){wa[a.pointerId]={pageX:a.pageX,pageY:a.pageY};if(!wa[a.pointerId].target)wa[a.pointerId].target=a.currentTarget})},onDocumentPointerUp:function(a){Bb(a,"onDocumentTouchEnd","touchend",function(a){delete wa[a.pointerId]})},batchMSEvents:function(a){a(this.chart.container,Ab?"pointerdown":"MSPointerDown",this.onContainerPointerDown);a(this.chart.container,Ab?"pointermove":"MSPointerMove",this.onContainerPointerMove);a(C,Ab?"pointerup":"MSPointerUp",this.onDocumentPointerUp)}});
|
||||
Ta(Va.prototype,"init",function(a,b,c){a.call(this,b,c);this.hasZoom&&M(b.container,{"-ms-touch-action":P,"touch-action":P})});Ta(Va.prototype,"setDOMEvents",function(a){a.apply(this);(this.hasZoom||this.followTouchMove)&&this.batchMSEvents(I)});Ta(Va.prototype,"destroy",function(a){this.batchMSEvents(Y);a.call(this)})}var mb=B.Legend=function(a,b){this.init(a,b)};mb.prototype={init:function(a,b){var c=this,d=b.itemStyle,e=b.itemMarginTop||0;this.options=b;if(b.enabled)c.itemStyle=d,c.itemHiddenStyle=
|
||||
D(d,b.itemHiddenStyle),c.itemMarginTop=e,c.padding=d=p(b.padding,8),c.initialItemX=d,c.initialItemY=d-5,c.maxItemWidth=0,c.chart=a,c.itemHeight=0,c.symbolWidth=p(b.symbolWidth,16),c.pages=[],c.render(),I(c.chart,"endResize",function(){c.positionCheckboxes()})},colorizeItem:function(a,b){var c=this.options,d=a.legendItem,e=a.legendLine,f=a.legendSymbol,g=this.itemHiddenStyle.color,c=b?c.itemStyle.color:g,h=b?a.legendColor||a.color||"#CCC":g,g=a.options&&a.options.marker,i={fill:h},j;d&&d.css({fill:c,
|
||||
color:c});e&&e.attr({stroke:h});if(f){if(g&&f.isMarker)for(j in i.stroke=h,g=a.convertAttribs(g),g)d=g[j],d!==x&&(i[j]=d);f.attr(i)}},positionItem:function(a){var b=this.options,c=b.symbolPadding,b=!b.rtl,d=a._legendItemPos,e=d[0],d=d[1],f=a.checkbox;(a=a.legendGroup)&&a.element&&a.translate(b?e:this.legendWidth-e-2*c-4,d);if(f)f.x=e,f.y=d},destroyItem:function(a){var b=a.checkbox;o(["legendItem","legendLine","legendSymbol","legendGroup"],function(b){a[b]&&(a[b]=a[b].destroy())});b&&Qa(a.checkbox)},
|
||||
destroy:function(){var a=this.group,b=this.box;if(b)this.box=b.destroy();if(a)this.group=a.destroy()},positionCheckboxes:function(a){var b=this.group.alignAttr,c,d=this.clipHeight||this.legendHeight;if(b)c=b.translateY,o(this.allItems,function(e){var f=e.checkbox,g;f&&(g=c+f.y+(a||0)+3,M(f,{left:b.translateX+e.checkboxOffset+f.x-20+"px",top:g+"px",display:g>c-6&&g<c+d-6?"":P}))})},renderTitle:function(){var a=this.padding,b=this.options.title,c=0;if(b.text){if(!this.title)this.title=this.chart.renderer.label(b.text,
|
||||
a-3,a-4,null,null,null,null,null,"legend-title").attr({zIndex:1}).css(b.style).add(this.group);a=this.title.getBBox();c=a.height;this.offsetWidth=a.width;this.contentGroup.attr({translateY:c})}this.titleHeight=c},setText:function(a){var b=this.options;a.legendItem.attr({text:b.labelFormat?Ia(b.labelFormat,a):b.labelFormatter.call(a)})},renderItem:function(a){var b=this.chart,c=b.renderer,d=this.options,e=d.layout==="horizontal",f=this.symbolWidth,g=d.symbolPadding,h=this.itemStyle,i=this.itemHiddenStyle,
|
||||
j=this.padding,k=e?p(d.itemDistance,20):0,m=!d.rtl,n=d.width,l=d.itemMarginBottom||0,u=this.itemMarginTop,r=this.initialItemX,o=a.legendItem,A=a.series&&a.series.drawLegendSymbol?a.series:a,v=A.options,v=this.createCheckboxForItem&&v&&v.showCheckbox,q=d.useHTML;if(!o){a.legendGroup=c.g("legend-item").attr({zIndex:1}).add(this.scrollGroup);a.legendItem=o=c.text("",m?f+g:-g,this.baseline||0,q).css(D(a.visible?h:i)).attr({align:m?"left":"right",zIndex:2}).add(a.legendGroup);if(!this.baseline)this.fontMetrics=
|
||||
c.fontMetrics(h.fontSize,o),this.baseline=this.fontMetrics.f+3+u,o.attr("y",this.baseline);A.drawLegendSymbol(this,a);this.setItemEvents&&this.setItemEvents(a,o,q,h,i);this.colorizeItem(a,a.visible);v&&this.createCheckboxForItem(a)}this.setText(a);c=o.getBBox();f=a.checkboxOffset=d.itemWidth||a.legendItemWidth||f+g+c.width+k+(v?20:0);this.itemHeight=g=w(a.legendItemHeight||c.height);if(e&&this.itemX-r+f>(n||b.chartWidth-2*j-r-d.x))this.itemX=r,this.itemY+=u+this.lastLineHeight+l,this.lastLineHeight=
|
||||
0;this.maxItemWidth=s(this.maxItemWidth,f);this.lastItemY=u+this.itemY+l;this.lastLineHeight=s(g,this.lastLineHeight);a._legendItemPos=[this.itemX,this.itemY];e?this.itemX+=f:(this.itemY+=u+g+l,this.lastLineHeight=g);this.offsetWidth=n||s((e?this.itemX-r-k:f)+j,this.offsetWidth)},getAllItems:function(){var a=[];o(this.chart.series,function(b){var c=b.options;if(p(c.showInLegend,!q(c.linkedTo)?x:!1,!0))a=a.concat(b.legendItems||(c.legendType==="point"?b.data:b))});return a},adjustMargins:function(a,
|
||||
b){var c=this.chart,d=this.options,e=d.align.charAt(0)+d.verticalAlign.charAt(0)+d.layout.charAt(0);this.display&&!d.floating&&o([/(lth|ct|rth)/,/(rtv|rm|rbv)/,/(rbh|cb|lbh)/,/(lbv|lm|ltv)/],function(f,g){f.test(e)&&!q(a[g])&&(c[ib[g]]=s(c[ib[g]],c.legend[(g+1)%2?"legendHeight":"legendWidth"]+[1,-1,-1,1][g]*d[g%2?"x":"y"]+p(d.margin,12)+b[g]))})},render:function(){var a=this,b=a.chart,c=b.renderer,d=a.group,e,f,g,h,i=a.box,j=a.options,k=a.padding,m=j.borderWidth,n=j.backgroundColor;a.itemX=a.initialItemX;
|
||||
a.itemY=a.initialItemY;a.offsetWidth=0;a.lastItemY=0;if(!d)a.group=d=c.g("legend").attr({zIndex:7}).add(),a.contentGroup=c.g().attr({zIndex:1}).add(d),a.scrollGroup=c.g().add(a.contentGroup);a.renderTitle();e=a.getAllItems();qb(e,function(a,b){return(a.options&&a.options.legendIndex||0)-(b.options&&b.options.legendIndex||0)});j.reversed&&e.reverse();a.allItems=e;a.display=f=!!e.length;a.lastLineHeight=0;o(e,function(b){a.renderItem(b)});g=(j.width||a.offsetWidth)+k;h=a.lastItemY+a.lastLineHeight+
|
||||
a.titleHeight;h=a.handleOverflow(h);h+=k;if(m||n){if(i){if(g>0&&h>0)i[i.isNew?"attr":"animate"](i.crisp({width:g,height:h})),i.isNew=!1}else a.box=i=c.rect(0,0,g,h,j.borderRadius,m||0).attr({stroke:j.borderColor,"stroke-width":m||0,fill:n||P}).add(d).shadow(j.shadow),i.isNew=!0;i[f?"show":"hide"]()}a.legendWidth=g;a.legendHeight=h;o(e,function(b){a.positionItem(b)});f&&d.align(t({width:g,height:h},j),!0,"spacingBox");b.isResizing||this.positionCheckboxes()},handleOverflow:function(a){var b=this,c=
|
||||
this.chart,d=c.renderer,e=this.options,f=e.y,f=c.spacingBox.height+(e.verticalAlign==="top"?-f:f)-this.padding,g=e.maxHeight,h,i=this.clipRect,j=e.navigation,k=p(j.animation,!0),m=j.arrowSize||12,n=this.nav,l=this.pages,u=this.padding,r,q=this.allItems,A=function(a){i.attr({height:a});if(b.contentGroup.div)b.contentGroup.div.style.clip="rect("+u+"px,9999px,"+(u+a)+"px,0)"};e.layout==="horizontal"&&(f/=2);g&&(f=z(f,g));l.length=0;if(a>f){this.clipHeight=h=s(f-20-this.titleHeight-u,0);this.currentPage=
|
||||
p(this.currentPage,1);this.fullHeight=a;o(q,function(a,b){var c=a._legendItemPos[1],d=w(a.legendItem.getBBox().height),e=l.length;if(!e||c-l[e-1]>h&&(r||c)!==l[e-1])l.push(r||c),e++;b===q.length-1&&c+d-l[e-1]>h&&l.push(c);c!==r&&(r=c)});if(!i)i=b.clipRect=d.clipRect(0,u,9999,0),b.contentGroup.clip(i);A(h);if(!n)this.nav=n=d.g().attr({zIndex:1}).add(this.group),this.up=d.symbol("triangle",0,0,m,m).on("click",function(){b.scroll(-1,k)}).add(n),this.pager=d.text("",15,10).css(j.style).add(n),this.down=
|
||||
d.symbol("triangle-down",0,0,m,m).on("click",function(){b.scroll(1,k)}).add(n);b.scroll(0);a=f}else if(n)A(c.chartHeight),n.hide(),this.scrollGroup.attr({translateY:1}),this.clipHeight=0;return a},scroll:function(a,b){var c=this.pages,d=c.length,e=this.currentPage+a,f=this.clipHeight,g=this.options.navigation,h=g.activeColor,g=g.inactiveColor,i=this.pager,j=this.padding;e>d&&(e=d);if(e>0)b!==x&&Ra(b,this.chart),this.nav.attr({translateX:j,translateY:f+this.padding+7+this.titleHeight,visibility:"visible"}),
|
||||
this.up.attr({fill:e===1?g:h}).css({cursor:e===1?"default":"pointer"}),i.attr({text:e+"/"+d}),this.down.attr({x:18+this.pager.getBBox().width,fill:e===d?g:h}).css({cursor:e===d?"default":"pointer"}),c=-c[e-1]+this.initialItemY,this.scrollGroup.animate({translateY:c}),this.currentPage=e,this.positionCheckboxes(c)}};Ma=B.LegendSymbolMixin={drawRectangle:function(a,b){var c=a.options.symbolHeight||a.fontMetrics.f;b.legendSymbol=this.chart.renderer.rect(0,a.baseline-c+1,a.symbolWidth,c,a.options.symbolRadius||
|
||||
0).attr({zIndex:3}).add(b.legendGroup)},drawLineMarker:function(a){var b=this.options,c=b.marker,d;d=a.symbolWidth;var e=this.chart.renderer,f=this.legendGroup,a=a.baseline-w(a.fontMetrics.b*0.3),g;if(b.lineWidth){g={"stroke-width":b.lineWidth};if(b.dashStyle)g.dashstyle=b.dashStyle;this.legendLine=e.path(["M",0,a,"L",d,a]).attr(g).add(f)}if(c&&c.enabled!==!1)b=c.radius,this.legendSymbol=d=e.symbol(this.symbol,d/2-b,a-b,2*b,2*b).add(f),d.isMarker=!0}};(/Trident\/7\.0/.test(za)||Ka)&&Ta(mb.prototype,
|
||||
"positionItem",function(a,b){var c=this,d=function(){b._legendItemPos&&a.call(c,b)};d();setTimeout(d)});E=B.Chart=function(){this.init.apply(this,arguments)};E.prototype={callbacks:[],init:function(a,b){var c,d=a.series;a.series=null;c=D(S,a);c.series=a.series=d;this.userOptions=a;d=c.chart;this.margin=this.splashArray("margin",d);this.spacing=this.splashArray("spacing",d);var e=d.events;this.bounds={h:{},v:{}};this.callback=b;this.isResizing=0;this.options=c;this.axes=[];this.series=[];this.hasCartesianSeries=
|
||||
d.showAxes;var f=this,g;f.index=X.length;X.push(f);bb++;d.reflow!==!1&&I(f,"load",function(){f.initReflow()});if(e)for(g in e)I(f,g,e[g]);f.xAxis=[];f.yAxis=[];f.animation=fa?!1:p(d.animation,!0);f.pointCount=f.colorCounter=f.symbolCounter=0;f.firstRender()},initSeries:function(a){var b=this.options.chart;(b=N[a.type||b.type||b.defaultSeriesType])||la(17,!0);b=new b;b.init(this,a);return b},isInsidePlot:function(a,b,c){var d=c?b:a,a=c?a:b;return d>=0&&d<=this.plotWidth&&a>=0&&a<=this.plotHeight},
|
||||
redraw:function(a){var b=this.axes,c=this.series,d=this.pointer,e=this.legend,f=this.isDirtyLegend,g,h,i=this.hasCartesianSeries,j=this.isDirtyBox,k=c.length,m=k,n=this.renderer,l=n.isHidden(),p=[];Ra(a,this);l&&this.cloneRenderTo();for(this.layOutTitles();m--;)if(a=c[m],a.options.stacking&&(g=!0,a.isDirty)){h=!0;break}if(h)for(m=k;m--;)if(a=c[m],a.options.stacking)a.isDirty=!0;o(c,function(a){a.isDirty&&a.options.legendType==="point"&&(a.updateTotals&&a.updateTotals(),f=!0)});if(f&&e.options.enabled)e.render(),
|
||||
this.isDirtyLegend=!1;g&&this.getStacks();if(i&&!this.isResizing)this.maxTicks=null,o(b,function(a){a.setScale()});this.getMargins();i&&(o(b,function(a){a.isDirty&&(j=!0)}),o(b,function(a){var b=a.min+","+a.max;if(a.extKey!==b)a.extKey=b,p.push(function(){J(a,"afterSetExtremes",t(a.eventArgs,a.getExtremes()));delete a.eventArgs});(j||g)&&a.redraw()}));j&&this.drawChartBox();o(c,function(a){a.isDirty&&a.visible&&(!a.isCartesian||a.xAxis)&&a.redraw()});d&&d.reset(!0);n.draw();J(this,"redraw");l&&this.cloneRenderTo(!0);
|
||||
o(p,function(a){a.call()})},get:function(a){var b=this.axes,c=this.series,d,e;for(d=0;d<b.length;d++)if(b[d].options.id===a)return b[d];for(d=0;d<c.length;d++)if(c[d].options.id===a)return c[d];for(d=0;d<c.length;d++){e=c[d].points||[];for(b=0;b<e.length;b++)if(e[b].id===a)return e[b]}return null},getAxes:function(){var a=this,b=this.options,c=b.xAxis=ra(b.xAxis||{}),b=b.yAxis=ra(b.yAxis||{});o(c,function(a,b){a.index=b;a.isX=!0});o(b,function(a,b){a.index=b});c=c.concat(b);o(c,function(b){new ha(a,
|
||||
b)})},getSelectedPoints:function(){var a=[];o(this.series,function(b){a=a.concat(kb(b.points||[],function(a){return a.selected}))});return a},getSelectedSeries:function(){return kb(this.series,function(a){return a.selected})},setTitle:function(a,b,c){var g;var d=this,e=d.options,f;f=e.title=D(e.title,a);g=e.subtitle=D(e.subtitle,b),e=g;o([["title",a,f],["subtitle",b,e]],function(a){var b=a[0],c=d[b],e=a[1],a=a[2];c&&e&&(d[b]=c=c.destroy());a&&a.text&&!c&&(d[b]=d.renderer.text(a.text,0,0,a.useHTML).attr({align:a.align,
|
||||
"class":"highcharts-"+b,zIndex:a.zIndex||4}).css(a.style).add())});d.layOutTitles(c)},layOutTitles:function(a){var b=0,c=this.title,d=this.subtitle,e=this.options,f=e.title,e=e.subtitle,g=this.renderer,h=this.spacingBox.width-44;if(c&&(c.css({width:(f.width||h)+"px"}).align(t({y:g.fontMetrics(f.style.fontSize,c).b-3},f),!1,"spacingBox"),!f.floating&&!f.verticalAlign))b=c.getBBox().height;d&&(d.css({width:(e.width||h)+"px"}).align(t({y:b+(f.margin-13)+g.fontMetrics(e.style.fontSize,c).b},e),!1,"spacingBox"),
|
||||
!e.floating&&!e.verticalAlign&&(b=ta(b+d.getBBox().height)));c=this.titleOffset!==b;this.titleOffset=b;if(!this.isDirtyBox&&c)this.isDirtyBox=c,this.hasRendered&&p(a,!0)&&this.isDirtyBox&&this.redraw()},getChartSize:function(){var a=this.options.chart,b=a.width,a=a.height,c=this.renderToClone||this.renderTo;if(!q(b))this.containerWidth=jb(c,"width");if(!q(a))this.containerHeight=jb(c,"height");this.chartWidth=s(0,b||this.containerWidth||600);this.chartHeight=s(0,p(a,this.containerHeight>19?this.containerHeight:
|
||||
400))},cloneRenderTo:function(a){var b=this.renderToClone,c=this.container;a?b&&(this.renderTo.appendChild(c),Qa(b),delete this.renderToClone):(c&&c.parentNode===this.renderTo&&this.renderTo.removeChild(c),this.renderToClone=b=this.renderTo.cloneNode(0),M(b,{position:"absolute",top:"-9999px",display:"block"}),b.style.setProperty&&b.style.setProperty("display","block","important"),C.body.appendChild(b),c&&b.appendChild(c))},getContainer:function(){var a,b=this.options,c=b.chart,d,e,f;this.renderTo=
|
||||
a=c.renderTo;f="highcharts-"+xb++;if(Ba(a))this.renderTo=a=C.getElementById(a);a||la(13,!0);d=G(K(a,"data-highcharts-chart"));!isNaN(d)&&X[d]&&X[d].hasRendered&&X[d].destroy();K(a,"data-highcharts-chart",this.index);a.innerHTML="";!c.skipClone&&!a.offsetWidth&&this.cloneRenderTo();this.getChartSize();d=this.chartWidth;e=this.chartHeight;this.container=a=$(Ja,{className:"highcharts-container"+(c.className?" "+c.className:""),id:f},t({position:"relative",overflow:"hidden",width:d+"px",height:e+"px",
|
||||
textAlign:"left",lineHeight:"normal",zIndex:0,"-webkit-tap-highlight-color":"rgba(0,0,0,0)"},c.style),this.renderToClone||a);this._cursor=a.style.cursor;this.renderer=new (B[c.renderer]||$a)(a,d,e,c.style,c.forExport,b.exporting&&b.exporting.allowHTML);fa&&this.renderer.create(this,a,d,e);this.renderer.chartIndex=this.index},getMargins:function(a){var b=this.spacing,c=this.margin,d=this.titleOffset;this.resetMargins();if(d&&!q(c[0]))this.plotTop=s(this.plotTop,d+this.options.title.margin+b[0]);this.legend.adjustMargins(c,
|
||||
b);this.extraBottomMargin&&(this.marginBottom+=this.extraBottomMargin);this.extraTopMargin&&(this.plotTop+=this.extraTopMargin);a||this.getAxisMargins()},getAxisMargins:function(){var a=this,b=a.axisOffset=[0,0,0,0],c=a.margin;a.hasCartesianSeries&&o(a.axes,function(a){a.visible&&a.getOffset()});o(ib,function(d,e){q(c[e])||(a[d]+=b[e])});a.setChartSize()},reflow:function(a){var b=this,c=b.options.chart,d=b.renderTo,e=c.width||jb(d,"width"),f=c.height||jb(d,"height"),c=a?a.target:L,d=function(){if(b.container)b.setSize(e,
|
||||
f,!1),b.hasUserSize=null};if(!b.hasUserSize&&!b.isPrinting&&e&&f&&(c===L||c===C)){if(e!==b.containerWidth||f!==b.containerHeight)clearTimeout(b.reflowTimeout),a?b.reflowTimeout=setTimeout(d,100):d();b.containerWidth=e;b.containerHeight=f}},initReflow:function(){var a=this,b=function(b){a.reflow(b)};I(L,"resize",b);I(a,"destroy",function(){Y(L,"resize",b)})},setSize:function(a,b,c){var d=this,e,f,g,h=d.renderer;d.isResizing+=1;g=function(){d&&J(d,"endResize",null,function(){d.isResizing-=1})};Ra(c,
|
||||
d);d.oldChartHeight=d.chartHeight;d.oldChartWidth=d.chartWidth;if(q(a))d.chartWidth=e=s(0,w(a)),d.hasUserSize=!!e;if(q(b))d.chartHeight=f=s(0,w(b));a=h.globalAnimation;(a?lb:M)(d.container,{width:e+"px",height:f+"px"},a);d.setChartSize(!0);h.setSize(e,f,c);d.maxTicks=null;o(d.axes,function(a){a.isDirty=!0;a.setScale()});o(d.series,function(a){a.isDirty=!0});d.isDirtyLegend=!0;d.isDirtyBox=!0;d.layOutTitles();d.getMargins();d.redraw(c);d.oldChartHeight=null;J(d,"resize");a=h.globalAnimation;a===!1?
|
||||
g():setTimeout(g,a&&a.duration||500)},setChartSize:function(a){var b=this.inverted,c=this.renderer,d=this.chartWidth,e=this.chartHeight,f=this.options.chart,g=this.spacing,h=this.clipOffset,i,j,k,m;this.plotLeft=i=w(this.plotLeft);this.plotTop=j=w(this.plotTop);this.plotWidth=k=s(0,w(d-i-this.marginRight));this.plotHeight=m=s(0,w(e-j-this.marginBottom));this.plotSizeX=b?m:k;this.plotSizeY=b?k:m;this.plotBorderWidth=f.plotBorderWidth||0;this.spacingBox=c.spacingBox={x:g[3],y:g[0],width:d-g[3]-g[1],
|
||||
height:e-g[0]-g[2]};this.plotBox=c.plotBox={x:i,y:j,width:k,height:m};d=2*T(this.plotBorderWidth/2);b=ta(s(d,h[3])/2);c=ta(s(d,h[0])/2);this.clipBox={x:b,y:c,width:T(this.plotSizeX-s(d,h[1])/2-b),height:s(0,T(this.plotSizeY-s(d,h[2])/2-c))};a||o(this.axes,function(a){a.setAxisSize();a.setAxisTranslation()})},resetMargins:function(){var a=this;o(ib,function(b,c){a[b]=p(a.margin[c],a.spacing[c])});a.axisOffset=[0,0,0,0];a.clipOffset=[0,0,0,0]},drawChartBox:function(){var a=this.options.chart,b=this.renderer,
|
||||
c=this.chartWidth,d=this.chartHeight,e=this.chartBackground,f=this.plotBackground,g=this.plotBorder,h=this.plotBGImage,i=a.borderWidth||0,j=a.backgroundColor,k=a.plotBackgroundColor,m=a.plotBackgroundImage,n=a.plotBorderWidth||0,l,p=this.plotLeft,o=this.plotTop,q=this.plotWidth,s=this.plotHeight,v=this.plotBox,t=this.clipRect,x=this.clipBox;l=i+(a.shadow?8:0);if(i||j)if(e)e.animate(e.crisp({width:c-l,height:d-l}));else{e={fill:j||P};if(i)e.stroke=a.borderColor,e["stroke-width"]=i;this.chartBackground=
|
||||
b.rect(l/2,l/2,c-l,d-l,a.borderRadius,i).attr(e).addClass("highcharts-background").add().shadow(a.shadow)}if(k)f?f.animate(v):this.plotBackground=b.rect(p,o,q,s,0).attr({fill:k}).add().shadow(a.plotShadow);if(m)h?h.animate(v):this.plotBGImage=b.image(m,p,o,q,s).add();t?t.animate({width:x.width,height:x.height}):this.clipRect=b.clipRect(x);if(n)g?g.animate(g.crisp({x:p,y:o,width:q,height:s,strokeWidth:-n})):this.plotBorder=b.rect(p,o,q,s,0,-n).attr({stroke:a.plotBorderColor,"stroke-width":n,fill:P,
|
||||
zIndex:1}).add();this.isDirtyBox=!1},propFromSeries:function(){var a=this,b=a.options.chart,c,d=a.options.series,e,f;o(["inverted","angular","polar"],function(g){c=N[b.type||b.defaultSeriesType];f=a[g]||b[g]||c&&c.prototype[g];for(e=d&&d.length;!f&&e--;)(c=N[d[e].type])&&c.prototype[g]&&(f=!0);a[g]=f})},linkSeries:function(){var a=this,b=a.series;o(b,function(a){a.linkedSeries.length=0});o(b,function(b){var d=b.options.linkedTo;if(Ba(d)&&(d=d===":previous"?a.series[b.index-1]:a.get(d)))d.linkedSeries.push(b),
|
||||
b.linkedParent=d,b.visible=p(b.options.visible,d.options.visible,b.visible)})},renderSeries:function(){o(this.series,function(a){a.translate();a.render()})},renderLabels:function(){var a=this,b=a.options.labels;b.items&&o(b.items,function(c){var d=t(b.style,c.style),e=G(d.left)+a.plotLeft,f=G(d.top)+a.plotTop+12;delete d.left;delete d.top;a.renderer.text(c.html,e,f).attr({zIndex:2}).css(d).add()})},render:function(){var a=this.axes,b=this.renderer,c=this.options,d,e,f,g;this.setTitle();this.legend=
|
||||
new mb(this,c.legend);this.getStacks&&this.getStacks();this.getMargins(!0);this.setChartSize();d=this.plotWidth;e=this.plotHeight-=13;o(a,function(a){a.setScale()});this.getAxisMargins();f=d/this.plotWidth>1.1;g=e/this.plotHeight>1.1;if(f||g)this.maxTicks=null,o(a,function(a){(a.horiz&&f||!a.horiz&&g)&&a.setTickInterval(!0)}),this.getMargins();this.drawChartBox();this.hasCartesianSeries&&o(a,function(a){a.visible&&a.render()});if(!this.seriesGroup)this.seriesGroup=b.g("series-group").attr({zIndex:3}).add();
|
||||
this.renderSeries();this.renderLabels();this.showCredits(c.credits);this.hasRendered=!0},showCredits:function(a){if(a.enabled&&!this.credits)this.credits=this.renderer.text(a.text,0,0).on("click",function(){if(a.href)location.href=a.href}).attr({align:a.position.align,zIndex:8}).css(a.style).add().align(a.position)},destroy:function(){var a=this,b=a.axes,c=a.series,d=a.container,e,f=d&&d.parentNode;J(a,"destroy");X[a.index]=x;bb--;a.renderTo.removeAttribute("data-highcharts-chart");Y(a);for(e=b.length;e--;)b[e]=
|
||||
b[e].destroy();for(e=c.length;e--;)c[e]=c[e].destroy();o("title,subtitle,chartBackground,plotBackground,plotBGImage,plotBorder,seriesGroup,clipRect,credits,pointer,scroller,rangeSelector,legend,resetZoomButton,tooltip,renderer".split(","),function(b){var c=a[b];c&&c.destroy&&(a[b]=c.destroy())});if(d)d.innerHTML="",Y(d),f&&Qa(d);for(e in a)delete a[e]},isReadyToRender:function(){var a=this;return!ca&&L==L.top&&C.readyState!=="complete"||fa&&!L.canvg?(fa?Lb.push(function(){a.firstRender()},a.options.global.canvasToolsURL):
|
||||
C.attachEvent("onreadystatechange",function(){C.detachEvent("onreadystatechange",a.firstRender);C.readyState==="complete"&&a.firstRender()}),!1):!0},firstRender:function(){var a=this,b=a.options,c=a.callback;if(a.isReadyToRender()){a.getContainer();J(a,"init");a.resetMargins();a.setChartSize();a.propFromSeries();a.getAxes();o(b.series||[],function(b){a.initSeries(b)});a.linkSeries();J(a,"beforeRender");if(B.Pointer)a.pointer=new Va(a,b);a.render();a.renderer.draw();c&&c.apply(a,[a]);o(a.callbacks,
|
||||
function(b){a.index!==x&&b.apply(a,[a])});J(a,"load");a.cloneRenderTo(!0)}},splashArray:function(a,b){var c=b[a],c=da(c)?c:[c,c,c,c];return[p(b[a+"Top"],c[0]),p(b[a+"Right"],c[1]),p(b[a+"Bottom"],c[2]),p(b[a+"Left"],c[3])]}};var Xb=B.CenteredSeriesMixin={getCenter:function(){var a=this.options,b=this.chart,c=2*(a.slicedOffset||0),d=b.plotWidth-2*c,b=b.plotHeight-2*c,e=a.center,e=[p(e[0],"50%"),p(e[1],"50%"),a.size||"100%",a.innerSize||0],f=z(d,b),g,h;for(g=0;g<4;++g)h=e[g],a=g<2||g===2&&/%$/.test(h),
|
||||
e[g]=(/%$/.test(h)?[d,b,f,e[2]][g]*parseFloat(h)/100:parseFloat(h))+(a?c:0);e[3]>e[2]&&(e[3]=e[2]);return e}},Fa=function(){};Fa.prototype={init:function(a,b,c){this.series=a;this.color=a.color;this.applyOptions(b,c);this.pointAttr={};if(a.options.colorByPoint&&(b=a.options.colors||a.chart.options.colors,this.color=this.color||b[a.colorCounter++],a.colorCounter===b.length))a.colorCounter=0;a.chart.pointCount++;return this},applyOptions:function(a,b){var c=this.series,d=c.options.pointValKey||c.pointValKey,
|
||||
a=Fa.prototype.optionsToObject.call(this,a);t(this,a);this.options=this.options?t(this.options,a):a;if(d)this.y=this[d];if(this.x===x&&c)this.x=b===x?c.autoIncrement():b;return this},optionsToObject:function(a){var b={},c=this.series,d=c.options.keys,e=d||c.pointArrayMap||["y"],f=e.length,g=0,h=0;if(typeof a==="number"||a===null)b[e[0]]=a;else if(Ga(a)){if(!d&&a.length>f){c=typeof a[0];if(c==="string")b.name=a[0];else if(c==="number")b.x=a[0];g++}for(;h<f;){if(!d||a[g]!==void 0)b[e[h]]=a[g];g++;h++}}else if(typeof a===
|
||||
"object"){b=a;if(a.dataLabels)c._hasPointLabels=!0;if(a.marker)c._hasPointMarkers=!0}return b},destroy:function(){var a=this.series.chart,b=a.hoverPoints,c;a.pointCount--;if(b&&(this.setState(),ja(b,this),!b.length))a.hoverPoints=null;if(this===a.hoverPoint)this.onMouseOut();if(this.graphic||this.dataLabel)Y(this),this.destroyElements();this.legendItem&&a.legend.destroyItem(this);for(c in this)this[c]=null},destroyElements:function(){for(var a=["graphic","dataLabel","dataLabelUpper","connector","shadowGroup"],
|
||||
b,c=6;c--;)b=a[c],this[b]&&(this[b]=this[b].destroy())},getLabelConfig:function(){return{x:this.category,y:this.y,color:this.color,key:this.name||this.category,series:this.series,point:this,percentage:this.percentage,total:this.total||this.stackTotal}},tooltipFormatter:function(a){var b=this.series,c=b.tooltipOptions,d=p(c.valueDecimals,""),e=c.valuePrefix||"",f=c.valueSuffix||"";o(b.pointArrayMap||["y"],function(b){b="{point."+b;if(e||f)a=a.replace(b+"}",e+b+"}"+f);a=a.replace(b+"}",b+":,."+d+"f}")});
|
||||
return Ia(a,{point:this,series:this.series})},firePointEvent:function(a,b,c){var d=this,e=this.series.options;(e.point.events[a]||d.options&&d.options.events&&d.options.events[a])&&this.importEvents();a==="click"&&e.allowPointSelect&&(c=function(a){d.select&&d.select(null,a.ctrlKey||a.metaKey||a.shiftKey)});J(this,a,b,c)},visible:!0};var R=B.Series=function(){};R.prototype={isCartesian:!0,type:"line",pointClass:Fa,sorted:!0,requireSorting:!0,pointAttrToOptions:{stroke:"lineColor","stroke-width":"lineWidth",
|
||||
fill:"fillColor",r:"radius"},directTouch:!1,axisTypes:["xAxis","yAxis"],colorCounter:0,parallelArrays:["x","y"],init:function(a,b){var c=this,d,e,f=a.series,g=function(a,b){return p(a.options.index,a._i)-p(b.options.index,b._i)};c.chart=a;c.options=b=c.setOptions(b);c.linkedSeries=[];c.bindAxes();t(c,{name:b.name,state:"",pointAttr:{},visible:b.visible!==!1,selected:b.selected===!0});if(fa)b.animation=!1;e=b.events;for(d in e)I(c,d,e[d]);if(e&&e.click||b.point&&b.point.events&&b.point.events.click||
|
||||
b.allowPointSelect)a.runTrackerClick=!0;c.getColor();c.getSymbol();o(c.parallelArrays,function(a){c[a+"Data"]=[]});c.setData(b.data,!1);if(c.isCartesian)a.hasCartesianSeries=!0;f.push(c);c._i=f.length-1;qb(f,g);this.yAxis&&qb(this.yAxis.series,g);o(f,function(a,b){a.index=b;a.name=a.name||"Series "+(b+1)})},bindAxes:function(){var a=this,b=a.options,c=a.chart,d;o(a.axisTypes||[],function(e){o(c[e],function(c){d=c.options;if(b[e]===d.index||b[e]!==x&&b[e]===d.id||b[e]===x&&d.index===0)c.series.push(a),
|
||||
a[e]=c,c.isDirty=!0});!a[e]&&a.optionalAxis!==e&&la(18,!0)})},updateParallelArrays:function(a,b){var c=a.series,d=arguments;o(c.parallelArrays,typeof b==="number"?function(d){var f=d==="y"&&c.toYData?c.toYData(a):a[d];c[d+"Data"][b]=f}:function(a){Array.prototype[b].apply(c[a+"Data"],Array.prototype.slice.call(d,2))})},autoIncrement:function(){var a=this.options,b=this.xIncrement,c,d=a.pointIntervalUnit,b=p(b,a.pointStart,0);this.pointInterval=c=p(this.pointInterval,a.pointInterval,1);if(d==="month"||
|
||||
d==="year")a=new ya(b),a=d==="month"?+a[vb](a[Ya]()+c):+a[wb](a[Za]()+c),c=a-b;this.xIncrement=b+c;return b},getSegments:function(){var a=-1,b=[],c,d=this.points,e=d.length;if(e)if(this.options.connectNulls){for(c=e;c--;)d[c].y===null&&d.splice(c,1);d.length&&(b=[d])}else o(d,function(c,g){c.y===null?(g>a+1&&b.push(d.slice(a+1,g)),a=g):g===e-1&&b.push(d.slice(a+1,g+1))});this.segments=b},setOptions:function(a){var b=this.chart,c=b.options.plotOptions,b=b.userOptions||{},d=b.plotOptions||{},e=c[this.type];
|
||||
this.userOptions=a;c=D(e,c.series,a);this.tooltipOptions=D(S.tooltip,S.plotOptions[this.type].tooltip,b.tooltip,d.series&&d.series.tooltip,d[this.type]&&d[this.type].tooltip,a.tooltip);e.marker===null&&delete c.marker;this.zoneAxis=c.zoneAxis;a=this.zones=(c.zones||[]).slice();if((c.negativeColor||c.negativeFillColor)&&!c.zones)a.push({value:c[this.zoneAxis+"Threshold"]||c.threshold||0,color:c.negativeColor,fillColor:c.negativeFillColor});a.length&&q(a[a.length-1].value)&&a.push({color:this.color,
|
||||
fillColor:this.fillColor});return c},getCyclic:function(a,b,c){var d=this.userOptions,e="_"+a+"Index",f=a+"Counter";b||(q(d[e])?b=d[e]:(d[e]=b=this.chart[f]%c.length,this.chart[f]+=1),b=c[b]);this[a]=b},getColor:function(){this.options.colorByPoint?this.options.color=null:this.getCyclic("color",this.options.color||ba[this.type].color,this.chart.options.colors)},getSymbol:function(){var a=this.options.marker;this.getCyclic("symbol",a.symbol,this.chart.options.symbols);if(/^url/.test(this.symbol))a.radius=
|
||||
0},drawLegendSymbol:Ma.drawLineMarker,setData:function(a,b,c,d){var e=this,f=e.points,g=f&&f.length||0,h,i=e.options,j=e.chart,k=null,m=e.xAxis,n=m&&!!m.categories,l=i.turboThreshold,u=this.xData,r=this.yData,s=(h=e.pointArrayMap)&&h.length,a=a||[];h=a.length;b=p(b,!0);if(d!==!1&&h&&g===h&&!e.cropped&&!e.hasGroupedData&&e.visible)o(a,function(a,b){f[b].update&&f[b].update(a,!1,null,!1)});else{e.xIncrement=null;e.pointRange=n?1:i.pointRange;e.colorCounter=0;o(this.parallelArrays,function(a){e[a+"Data"].length=
|
||||
0});if(l&&h>l){for(c=0;k===null&&c<h;)k=a[c],c++;if(qa(k)){n=p(i.pointStart,0);k=p(i.pointInterval,1);for(c=0;c<h;c++)u[c]=n,r[c]=a[c],n+=k;e.xIncrement=n}else if(Ga(k))if(s)for(c=0;c<h;c++)k=a[c],u[c]=k[0],r[c]=k.slice(1,s+1);else for(c=0;c<h;c++)k=a[c],u[c]=k[0],r[c]=k[1];else la(12)}else for(c=0;c<h;c++)if(a[c]!==x&&(k={series:e},e.pointClass.prototype.applyOptions.apply(k,[a[c]]),e.updateParallelArrays(k,c),n&&q(k.name)))m.names[k.x]=k.name;Ba(r[0])&&la(14,!0);e.data=[];e.options.data=a;for(c=
|
||||
g;c--;)f[c]&&f[c].destroy&&f[c].destroy();if(m)m.minRange=m.userMinRange;e.isDirty=e.isDirtyData=j.isDirtyBox=!0;c=!1}i.legendType==="point"&&(this.processData(),this.generatePoints());b&&j.redraw(c)},processData:function(a){var b=this.xData,c=this.yData,d=b.length,e;e=0;var f,g,h=this.xAxis,i,j=this.options;i=j.cropThreshold;var k=this.getExtremesFromAll||j.getExtremesFromAll,m=this.isCartesian,n,l;if(m&&!this.isDirty&&!h.isDirty&&!this.yAxis.isDirty&&!a)return!1;if(h)a=h.getExtremes(),n=a.min,l=
|
||||
a.max;if(m&&this.sorted&&!k&&(!i||d>i||this.forceCrop))if(b[d-1]<n||b[0]>l)b=[],c=[];else if(b[0]<n||b[d-1]>l)e=this.cropData(this.xData,this.yData,n,l),b=e.xData,c=e.yData,e=e.start,f=!0;for(i=b.length-1;i>=0;i--)d=b[i]-b[i-1],d>0&&(g===x||d<g)?g=d:d<0&&this.requireSorting&&la(15);this.cropped=f;this.cropStart=e;this.processedXData=b;this.processedYData=c;if(j.pointRange===null)this.pointRange=g||1;this.closestPointRange=g},cropData:function(a,b,c,d){var e=a.length,f=0,g=e,h=p(this.cropShoulder,
|
||||
1),i;for(i=0;i<e;i++)if(a[i]>=c){f=s(0,i-h);break}for(;i<e;i++)if(a[i]>d){g=i+h;break}return{xData:a.slice(f,g),yData:b.slice(f,g),start:f,end:g}},generatePoints:function(){var a=this.options.data,b=this.data,c,d=this.processedXData,e=this.processedYData,f=this.pointClass,g=d.length,h=this.cropStart||0,i,j=this.hasGroupedData,k,m=[],n;if(!b&&!j)b=[],b.length=a.length,b=this.data=b;for(n=0;n<g;n++)i=h+n,j?m[n]=(new f).init(this,[d[n]].concat(ra(e[n]))):(b[i]?k=b[i]:a[i]!==x&&(b[i]=k=(new f).init(this,
|
||||
a[i],d[n])),m[n]=k),m[n].index=i;if(b&&(g!==(c=b.length)||j))for(n=0;n<c;n++)if(n===h&&!j&&(n+=g),b[n])b[n].destroyElements(),b[n].plotX=x;this.data=b;this.points=m},getExtremes:function(a){var b=this.yAxis,c=this.processedXData,d,e=[],f=0;d=this.xAxis.getExtremes();var g=d.min,h=d.max,i,j,k,m,a=a||this.stackedYData||this.processedYData;d=a.length;for(m=0;m<d;m++)if(j=c[m],k=a[m],i=k!==null&&k!==x&&(!b.isLog||k.length||k>0),j=this.getExtremesFromAll||this.options.getExtremesFromAll||this.cropped||
|
||||
(c[m+1]||j)>=g&&(c[m-1]||j)<=h,i&&j)if(i=k.length)for(;i--;)k[i]!==null&&(e[f++]=k[i]);else e[f++]=k;this.dataMin=Oa(e);this.dataMax=Da(e)},translate:function(){this.processedXData||this.processData();this.generatePoints();for(var a=this.options,b=a.stacking,c=this.xAxis,d=c.categories,e=this.yAxis,f=this.points,g=f.length,h=!!this.modifyValue,i=a.pointPlacement,j=i==="between"||qa(i),k=a.threshold,m=a.startFromThreshold?k:0,n,l,u,o,t=Number.MAX_VALUE,a=0;a<g;a++){var A=f[a],v=A.x,y=A.y;l=A.low;var w=
|
||||
b&&e.stacks[(this.negStacks&&y<(m?0:k)?"-":"")+this.stackKey];if(e.isLog&&y!==null&&y<=0)A.y=y=null,la(10);A.plotX=n=z(s(-1E5,c.translate(v,0,0,0,1,i,this.type==="flags")),1E5);if(b&&this.visible&&w&&w[v])o=this.getStackIndicator(o,v,this.index),w=w[v],y=w.points[o.key],l=y[0],y=y[1],l===m&&(l=p(k,e.min)),e.isLog&&l<=0&&(l=null),A.total=A.stackTotal=w.total,A.percentage=w.total&&A.y/w.total*100,A.stackY=y,w.setOffset(this.pointXOffset||0,this.barW||0);A.yBottom=q(l)?e.translate(l,0,1,0,1):null;h&&
|
||||
(y=this.modifyValue(y,A));A.plotY=l=typeof y==="number"&&y!==Infinity?z(s(-1E5,e.translate(y,0,1,0,1)),1E5):x;A.isInside=l!==x&&l>=0&&l<=e.len&&n>=0&&n<=c.len;A.clientX=j?c.translate(v,0,0,0,1):n;A.negative=A.y<(k||0);A.category=d&&d[A.x]!==x?d[A.x]:A.x;a&&(t=z(t,O(n-u)));u=n}this.closestPointRangePx=t;this.getSegments()},setClip:function(a){var b=this.chart,c=this.options,d=b.renderer,e=b.inverted,f=this.clipBox,g=f||b.clipBox,h=this.sharedClipKey||["_sharedClip",a&&a.duration,a&&a.easing,g.height,
|
||||
c.xAxis,c.yAxis].join(","),i=b[h],j=b[h+"m"];if(!i){if(a)g.width=0,b[h+"m"]=j=d.clipRect(-99,e?-b.plotLeft:-b.plotTop,99,e?b.chartWidth:b.chartHeight);b[h]=i=d.clipRect(g)}a&&(i.count+=1);if(c.clip!==!1)this.group.clip(a||f?i:b.clipRect),this.markerGroup.clip(j),this.sharedClipKey=h;a||(i.count-=1,i.count<=0&&h&&b[h]&&(f||(b[h]=b[h].destroy()),b[h+"m"]&&(b[h+"m"]=b[h+"m"].destroy())))},animate:function(a){var b=this.chart,c=this.options.animation,d;if(c&&!da(c))c=ba[this.type].animation;a?this.setClip(c):
|
||||
(d=this.sharedClipKey,(a=b[d])&&a.animate({width:b.plotSizeX},c),b[d+"m"]&&b[d+"m"].animate({width:b.plotSizeX+99},c),this.animate=null)},afterAnimate:function(){this.setClip();J(this,"afterAnimate")},drawPoints:function(){var a,b=this.points,c=this.chart,d,e,f,g,h,i,j,k,m=this.options.marker,n=this.pointAttr[""],l,o,r,s=this.markerGroup,q=p(m.enabled,this.xAxis.isRadial,this.closestPointRangePx>2*m.radius);if(m.enabled!==!1||this._hasPointMarkers)for(f=b.length;f--;)if(g=b[f],d=T(g.plotX),e=g.plotY,
|
||||
k=g.graphic,l=g.marker||{},o=!!g.marker,a=q&&l.enabled===x||l.enabled,r=g.isInside,a&&e!==x&&!isNaN(e)&&g.y!==null)if(a=g.pointAttr[g.selected?"select":""]||n,h=a.r,i=p(l.symbol,this.symbol),j=i.indexOf("url")===0,k)k[r?"show":"hide"](!0).animate(t({x:d-h,y:e-h},k.symbolName?{width:2*h,height:2*h}:{}));else{if(r&&(h>0||j))g.graphic=c.renderer.symbol(i,d-h,e-h,2*h,2*h,o?l:m).attr(a).add(s)}else if(k)g.graphic=k.destroy()},convertAttribs:function(a,b,c,d){var e=this.pointAttrToOptions,f,g,h={},a=a||
|
||||
{},b=b||{},c=c||{},d=d||{};for(f in e)g=e[f],h[f]=p(a[g],b[f],c[f],d[f]);return h},getAttribs:function(){var a=this,b=a.options,c=ba[a.type].marker?b.marker:b,d=c.states,e=d.hover,f,g=a.color,h=a.options.negativeColor;f={stroke:g,fill:g};var i=a.points||[],j,k,m=[],n=a.pointAttrToOptions;j=a.hasPointSpecificOptions;var l=c.lineColor,u=c.fillColor;k=b.turboThreshold;var r=a.zones,s=a.zoneAxis||"y",A;b.marker?(e.radius=e.radius||c.radius+e.radiusPlus,e.lineWidth=e.lineWidth||c.lineWidth+e.lineWidthPlus):
|
||||
(e.color=e.color||na(e.color||g).brighten(e.brightness).get(),e.negativeColor=e.negativeColor||na(e.negativeColor||h).brighten(e.brightness).get());m[""]=a.convertAttribs(c,f);o(["hover","select"],function(b){m[b]=a.convertAttribs(d[b],m[""])});a.pointAttr=m;g=i.length;if(!k||g<k||j)for(;g--;){k=i[g];if((c=k.options&&k.options.marker||k.options)&&c.enabled===!1)c.radius=0;if(r.length){j=0;for(f=r[j];k[s]>=f.value;)f=r[++j];k.color=k.fillColor=p(f.color,a.color)}j=b.colorByPoint||k.color;if(k.options)for(A in n)q(c[n[A]])&&
|
||||
(j=!0);if(j){c=c||{};j=[];d=c.states||{};f=d.hover=d.hover||{};if(!b.marker||k.negative&&!f.fillColor&&!e.fillColor)f[a.pointAttrToOptions.fill]=f.color||!k.options.color&&e[k.negative&&h?"negativeColor":"color"]||na(k.color).brighten(f.brightness||e.brightness).get();f={color:k.color};if(!u)f.fillColor=k.color;if(!l)f.lineColor=k.color;c.hasOwnProperty("color")&&!c.color&&delete c.color;j[""]=a.convertAttribs(t(f,c),m[""]);j.hover=a.convertAttribs(d.hover,m.hover,j[""]);j.select=a.convertAttribs(d.select,
|
||||
m.select,j[""])}else j=m;k.pointAttr=j}},destroy:function(){var a=this,b=a.chart,c=/AppleWebKit\/533/.test(za),d,e=a.data||[],f,g,h;J(a,"destroy");Y(a);o(a.axisTypes||[],function(b){if(h=a[b])ja(h.series,a),h.isDirty=h.forceRedraw=!0});a.legendItem&&a.chart.legend.destroyItem(a);for(d=e.length;d--;)(f=e[d])&&f.destroy&&f.destroy();a.points=null;clearTimeout(a.animationTimeout);for(g in a)a[g]instanceof Q&&!a[g].survive&&(d=c&&g==="group"?"hide":"destroy",a[g][d]());if(b.hoverSeries===a)b.hoverSeries=
|
||||
null;ja(b.series,a);for(g in a)delete a[g]},getSegmentPath:function(a){var b=this,c=[],d=b.options.step;o(a,function(e,f){var g=e.plotX,h=e.plotY,i;b.getPointSpline?c.push.apply(c,b.getPointSpline(a,e,f)):(c.push(f?"L":"M"),d&&f&&(i=a[f-1],d==="right"?c.push(i.plotX,h,"L"):d==="center"?c.push((i.plotX+g)/2,i.plotY,"L",(i.plotX+g)/2,h,"L"):c.push(g,i.plotY,"L")),c.push(e.plotX,e.plotY))});return c},getGraphPath:function(){var a=this,b=[],c,d=[];o(a.segments,function(e){c=a.getSegmentPath(e);e.length>
|
||||
1?b=b.concat(c):d.push(e[0])});a.singlePoints=d;return a.graphPath=b},drawGraph:function(){var a=this,b=this.options,c=[["graph",b.lineColor||this.color,b.dashStyle]],d=b.lineWidth,e=b.linecap!=="square",f=this.getGraphPath(),g=this.fillGraph&&this.color||P;o(this.zones,function(d,e){c.push(["zoneGraph"+e,d.color||a.color,d.dashStyle||b.dashStyle])});o(c,function(c,i){var j=c[0],k=a[j];if(k)k.animate({d:f});else if((d||g)&&f.length)k={stroke:c[1],"stroke-width":d,fill:g,zIndex:1},c[2]?k.dashstyle=
|
||||
c[2]:e&&(k["stroke-linecap"]=k["stroke-linejoin"]="round"),a[j]=a.chart.renderer.path(f).attr(k).add(a.group).shadow(i<2&&b.shadow)})},applyZones:function(){var a=this,b=this.chart,c=b.renderer,d=this.zones,e,f,g=this.clips||[],h,i=this.graph,j=this.area,k=s(b.chartWidth,b.chartHeight),m=this[(this.zoneAxis||"y")+"Axis"],n,l=m.reversed,u=b.inverted,r=m.horiz,q,t,v,y=!1;if(d.length&&(i||j)&&m.min!==x)i&&i.hide(),j&&j.hide(),n=m.getExtremes(),o(d,function(d,o){e=l?r?b.plotWidth:0:r?0:m.toPixels(n.min);
|
||||
e=z(s(p(f,e),0),k);f=z(s(w(m.toPixels(p(d.value,n.max),!0)),0),k);y&&(e=f=m.toPixels(n.max));q=Math.abs(e-f);t=z(e,f);v=s(e,f);if(m.isXAxis){if(h={x:u?v:t,y:0,width:q,height:k},!r)h.x=b.plotHeight-h.x}else if(h={x:0,y:u?v:t,width:k,height:q},r)h.y=b.plotWidth-h.y;b.inverted&&c.isVML&&(h=m.isXAxis?{x:0,y:l?t:v,height:h.width,width:b.chartWidth}:{x:h.y-b.plotLeft-b.spacingBox.x,y:0,width:h.height,height:b.chartHeight});g[o]?g[o].animate(h):(g[o]=c.clipRect(h),i&&a["zoneGraph"+o].clip(g[o]),j&&a["zoneArea"+
|
||||
o].clip(g[o]));y=d.value>n.max}),this.clips=g},invertGroups:function(){function a(){var a={width:b.yAxis.len,height:b.xAxis.len};o(["group","markerGroup"],function(c){b[c]&&b[c].attr(a).invert()})}var b=this,c=b.chart;if(b.xAxis)I(c,"resize",a),I(b,"destroy",function(){Y(c,"resize",a)}),a(),b.invertGroups=a},plotGroup:function(a,b,c,d,e){var f=this[a],g=!f;g&&(this[a]=f=this.chart.renderer.g(b).attr({visibility:c,zIndex:d||0.1}).add(e),f.addClass("highcharts-series-"+this.index));f[g?"attr":"animate"](this.getPlotBox());
|
||||
return f},getPlotBox:function(){var a=this.chart,b=this.xAxis,c=this.yAxis;if(a.inverted)b=c,c=this.xAxis;return{translateX:b?b.left:a.plotLeft,translateY:c?c.top:a.plotTop,scaleX:1,scaleY:1}},render:function(){var a=this,b=a.chart,c,d=a.options,e=(c=d.animation)&&!!a.animate&&b.renderer.isSVG&&p(c.duration,500)||0,f=a.visible?"visible":"hidden",g=d.zIndex,h=a.hasRendered,i=b.seriesGroup;c=a.plotGroup("group","series",f,g,i);a.markerGroup=a.plotGroup("markerGroup","markers",f,g,i);e&&a.animate(!0);
|
||||
a.getAttribs();c.inverted=a.isCartesian?b.inverted:!1;a.drawGraph&&(a.drawGraph(),a.applyZones());o(a.points,function(a){a.redraw&&a.redraw()});a.drawDataLabels&&a.drawDataLabels();a.visible&&a.drawPoints();a.drawTracker&&a.options.enableMouseTracking!==!1&&a.drawTracker();b.inverted&&a.invertGroups();d.clip!==!1&&!a.sharedClipKey&&!h&&c.clip(b.clipRect);e&&a.animate();if(!h)e?a.animationTimeout=setTimeout(function(){a.afterAnimate()},e):a.afterAnimate();a.isDirty=a.isDirtyData=!1;a.hasRendered=!0},
|
||||
redraw:function(){var a=this.chart,b=this.isDirtyData,c=this.isDirty,d=this.group,e=this.xAxis,f=this.yAxis;d&&(a.inverted&&d.attr({width:a.plotWidth,height:a.plotHeight}),d.animate({translateX:p(e&&e.left,a.plotLeft),translateY:p(f&&f.top,a.plotTop)}));this.translate();this.render();b&&J(this,"updatedData");(c||b)&&delete this.kdTree},kdDimensions:1,kdAxisArray:["clientX","plotY"],searchPoint:function(a,b){var c=this.xAxis,d=this.yAxis,e=this.chart.inverted;return this.searchKDTree({clientX:e?c.len-
|
||||
a.chartY+c.pos:a.chartX-c.pos,plotY:e?d.len-a.chartX+d.pos:a.chartY-d.pos},b)},buildKDTree:function(){function a(b,d,g){var h,i;if(i=b&&b.length)return h=c.kdAxisArray[d%g],b.sort(function(a,b){return a[h]-b[h]}),i=Math.floor(i/2),{point:b[i],left:a(b.slice(0,i),d+1,g),right:a(b.slice(i+1),d+1,g)}}function b(){var b=kb(c.points||[],function(a){return a.y!==null});c.kdTree=a(b,d,d)}var c=this,d=c.kdDimensions;delete c.kdTree;c.options.kdSync?b():setTimeout(b)},searchKDTree:function(a,b){function c(a,
|
||||
b,j,k){var m=b.point,n=d.kdAxisArray[j%k],l,p,o=m;p=q(a[e])&&q(m[e])?Math.pow(a[e]-m[e],2):null;l=q(a[f])&&q(m[f])?Math.pow(a[f]-m[f],2):null;l=(p||0)+(l||0);m.dist=q(l)?Math.sqrt(l):Number.MAX_VALUE;m.distX=q(p)?Math.sqrt(p):Number.MAX_VALUE;n=a[n]-m[n];l=n<0?"left":"right";p=n<0?"right":"left";b[l]&&(l=c(a,b[l],j+1,k),o=l[g]<o[g]?l:m);b[p]&&Math.sqrt(n*n)<o[g]&&(a=c(a,b[p],j+1,k),o=a[g]<o[g]?a:o);return o}var d=this,e=this.kdAxisArray[0],f=this.kdAxisArray[1],g=b?"distX":"dist";this.kdTree||this.buildKDTree();
|
||||
if(this.kdTree)return c(a,this.kdTree,this.kdDimensions,this.kdDimensions)}};Hb.prototype={destroy:function(){Pa(this,this.axis)},render:function(a){var b=this.options,c=b.format,c=c?Ia(c,this):b.formatter.call(this);this.label?this.label.attr({text:c,visibility:"hidden"}):this.label=this.axis.chart.renderer.text(c,null,null,b.useHTML).css(b.style).attr({align:this.textAlign,rotation:b.rotation,visibility:"hidden"}).add(a)},setOffset:function(a,b){var c=this.axis,d=c.chart,e=d.inverted,f=c.reversed,
|
||||
f=this.isNegative&&!f||!this.isNegative&&f,g=c.translate(c.usePercentage?100:this.total,0,0,0,1),c=c.translate(0),c=O(g-c),h=d.xAxis[0].translate(this.x)+a,i=d.plotHeight,f={x:e?f?g:g-c:h,y:e?i-h-b:f?i-g-c:i-g,width:e?c:b,height:e?b:c};if(e=this.label)e.align(this.alignOptions,null,f),f=e.alignAttr,e[this.options.crop===!1||d.isInsidePlot(f.x,f.y)?"show":"hide"](!0)}};E.prototype.getStacks=function(){var a=this;o(a.yAxis,function(a){if(a.stacks&&a.hasVisibleSeries)a.oldStacks=a.stacks});o(a.series,
|
||||
function(b){if(b.options.stacking&&(b.visible===!0||a.options.chart.ignoreHiddenSeries===!1))b.stackKey=b.type+p(b.options.stack,"")})};ha.prototype.buildStacks=function(){var a=this.series,b=p(this.options.reversedStacks,!0),c=a.length;if(!this.isXAxis){for(this.usePercentage=!1;c--;)a[b?c:a.length-c-1].setStackedPoints();if(this.usePercentage)for(c=0;c<a.length;c++)a[c].setPercentStacks()}};ha.prototype.renderStackTotals=function(){var a=this.chart,b=a.renderer,c=this.stacks,d,e,f=this.stackTotalGroup;
|
||||
if(!f)this.stackTotalGroup=f=b.g("stack-labels").attr({visibility:"visible",zIndex:6}).add();f.translate(a.plotLeft,a.plotTop);for(d in c)for(e in a=c[d],a)a[e].render(f)};ha.prototype.resetStacks=function(){var a=this.stacks,b,c;if(!this.isXAxis)for(b in a)for(c in a[b])a[b][c].touched<this.stacksTouched?(a[b][c].destroy(),delete a[b][c]):(a[b][c].total=null,a[b][c].cum=0)};ha.prototype.cleanStacks=function(){var a,b,c;if(!this.isXAxis){if(this.oldStacks)a=this.stacks=this.oldStacks;for(b in a)for(c in a[b])a[b][c].cum=
|
||||
a[b][c].total}};R.prototype.setStackedPoints=function(){if(this.options.stacking&&!(this.visible!==!0&&this.chart.options.chart.ignoreHiddenSeries!==!1)){var a=this.processedXData,b=this.processedYData,c=[],d=b.length,e=this.options,f=e.threshold,g=e.startFromThreshold?f:0,h=e.stack,e=e.stacking,i=this.stackKey,j="-"+i,k=this.negStacks,m=this.yAxis,n=m.stacks,l=m.oldStacks,o,r,q,t,v,w,x;m.stacksTouched+=1;for(v=0;v<d;v++){w=a[v];x=b[v];o=this.getStackIndicator(o,w,this.index);t=o.key;q=(r=k&&x<(g?
|
||||
0:f))?j:i;n[q]||(n[q]={});if(!n[q][w])l[q]&&l[q][w]?(n[q][w]=l[q][w],n[q][w].total=null):n[q][w]=new Hb(m,m.options.stackLabels,r,w,h);q=n[q][w];q.points[t]=[p(q.cum,g)];q.touched=m.stacksTouched;e==="percent"?(r=r?i:j,k&&n[r]&&n[r][w]?(r=n[r][w],q.total=r.total=s(r.total,q.total)+O(x)||0):q.total=ea(q.total+(O(x)||0))):q.total=ea(q.total+(x||0));q.cum=p(q.cum,g)+(x||0);q.points[t].push(q.cum);c[v]=q.cum}if(e==="percent")m.usePercentage=!0;this.stackedYData=c;m.oldStacks={}}};R.prototype.setPercentStacks=
|
||||
function(){var a=this,b=a.stackKey,c=a.yAxis.stacks,d=a.processedXData,e;o([b,"-"+b],function(b){var f;for(var g=d.length,h,i;g--;)if(h=d[g],e=a.getStackIndicator(e,h,a.index),f=(i=c[b]&&c[b][h])&&i.points[e.key],h=f)i=i.total?100/i.total:0,h[0]=ea(h[0]*i),h[1]=ea(h[1]*i),a.stackedYData[g]=h[1]})};R.prototype.getStackIndicator=function(a,b,c){!q(a)||a.x!==b?a={x:b,index:0}:a.index++;a.key=[c,b,a.index].join(",");return a};t(E.prototype,{addSeries:function(a,b,c){var d,e=this;a&&(b=p(b,!0),J(e,"addSeries",
|
||||
{options:a},function(){d=e.initSeries(a);e.isDirtyLegend=!0;e.linkSeries();b&&e.redraw(c)}));return d},addAxis:function(a,b,c,d){var e=b?"xAxis":"yAxis",f=this.options;new ha(this,D(a,{index:this[e].length,isX:b}));f[e]=ra(f[e]||{});f[e].push(a);p(c,!0)&&this.redraw(d)},showLoading:function(a){var b=this,c=b.options,d=b.loadingDiv,e=c.loading,f=function(){d&&M(d,{left:b.plotLeft+"px",top:b.plotTop+"px",width:b.plotWidth+"px",height:b.plotHeight+"px"})};if(!d)b.loadingDiv=d=$(Ja,{className:"highcharts-loading"},
|
||||
t(e.style,{zIndex:10,display:P}),b.container),b.loadingSpan=$("span",null,e.labelStyle,d),I(b,"redraw",f);b.loadingSpan.innerHTML=a||c.lang.loading;if(!b.loadingShown)M(d,{opacity:0,display:""}),lb(d,{opacity:e.style.opacity},{duration:e.showDuration||0}),b.loadingShown=!0;f()},hideLoading:function(){var a=this.options,b=this.loadingDiv;b&&lb(b,{opacity:0},{duration:a.loading.hideDuration||100,complete:function(){M(b,{display:P})}});this.loadingShown=!1}});t(Fa.prototype,{update:function(a,b,c,d){function e(){f.applyOptions(a);
|
||||
if(f.y===null&&h)f.graphic=h.destroy();if(da(a)&&!Ga(a))f.redraw=function(){if(h&&h.element&&a&&a.marker&&a.marker.symbol)f.graphic=h.destroy();if(a&&a.dataLabels&&f.dataLabel)f.dataLabel=f.dataLabel.destroy();f.redraw=null};i=f.index;g.updateParallelArrays(f,i);if(m&&f.name)m[f.x]=f.name;k.data[i]=f.options;g.isDirty=g.isDirtyData=!0;if(!g.fixedBox&&g.hasCartesianSeries)j.isDirtyBox=!0;if(k.legendType==="point")j.isDirtyLegend=!0;b&&j.redraw(c)}var f=this,g=f.series,h=f.graphic,i,j=g.chart,k=g.options,
|
||||
m=g.xAxis&&g.xAxis.names,b=p(b,!0);d===!1?e():f.firePointEvent("update",{options:a},e)},remove:function(a,b){this.series.removePoint(La(this,this.series.data),a,b)}});t(R.prototype,{addPoint:function(a,b,c,d){var e=this,f=e.options,g=e.data,h=e.graph,i=e.area,j=e.chart,k=e.xAxis&&e.xAxis.names,m=h&&h.shift||0,n=["graph","area"],h=f.data,l,u=e.xData;Ra(d,j);if(c){for(d=e.zones.length;d--;)n.push("zoneGraph"+d,"zoneArea"+d);o(n,function(a){if(e[a])e[a].shift=m+(f.step?2:1)})}if(i)i.isArea=!0;b=p(b,
|
||||
!0);i={series:e};e.pointClass.prototype.applyOptions.apply(i,[a]);n=i.x;d=u.length;if(e.requireSorting&&n<u[d-1])for(l=!0;d&&u[d-1]>n;)d--;e.updateParallelArrays(i,"splice",d,0,0);e.updateParallelArrays(i,d);if(k&&i.name)k[n]=i.name;h.splice(d,0,a);l&&(e.data.splice(d,0,null),e.processData());f.legendType==="point"&&e.generatePoints();c&&(g[0]&&g[0].remove?g[0].remove(!1):(g.shift(),e.updateParallelArrays(i,"shift"),h.shift()));e.isDirty=!0;e.isDirtyData=!0;b&&(e.getAttribs(),j.redraw())},removePoint:function(a,
|
||||
b,c){var d=this,e=d.data,f=e[a],g=d.points,h=d.chart,i=function(){e.length===g.length&&g.splice(a,1);e.splice(a,1);d.options.data.splice(a,1);d.updateParallelArrays(f||{series:d},"splice",a,1);f&&f.destroy();d.isDirty=!0;d.isDirtyData=!0;b&&h.redraw()};Ra(c,h);b=p(b,!0);f?f.firePointEvent("remove",null,i):i()},remove:function(a,b){var c=this,d=c.chart,a=p(a,!0);if(!c.isRemoving)c.isRemoving=!0,J(c,"remove",null,function(){c.destroy();d.isDirtyLegend=d.isDirtyBox=!0;d.linkSeries();a&&d.redraw(b)});
|
||||
c.isRemoving=!1},update:function(a,b){var c=this,d=this.chart,e=this.userOptions,f=this.type,g=N[f].prototype,h=["group","markerGroup","dataLabelsGroup"],i;if(a.type&&a.type!==f||a.zIndex!==void 0)h.length=0;o(h,function(a){h[a]=c[a];delete c[a]});a=D(e,{animation:!1,index:this.index,pointStart:this.xData[0]},{data:this.options.data},a);this.remove(!1);for(i in g)this[i]=x;t(this,N[a.type||f].prototype);o(h,function(a){c[a]=h[a]});this.init(d,a);d.linkSeries();p(b,!0)&&d.redraw(!1)}});t(ha.prototype,
|
||||
{update:function(a,b){var c=this.chart,a=c.options[this.coll][this.options.index]=D(this.userOptions,a);this.destroy(!0);this._addedPlotLB=this.chart._labelPanes=x;this.init(c,t(a,{events:x}));c.isDirtyBox=!0;p(b,!0)&&c.redraw()},remove:function(a){for(var b=this.chart,c=this.coll,d=this.series,e=d.length;e--;)d[e]&&d[e].remove(!1);ja(b.axes,this);ja(b[c],this);b.options[c].splice(this.options.index,1);o(b[c],function(a,b){a.options.index=b});this.destroy();b.isDirtyBox=!0;p(a,!0)&&b.redraw()},setTitle:function(a,
|
||||
b){this.update({title:a},b)},setCategories:function(a,b){this.update({categories:a},b)}});var xa=ka(R);N.line=xa;ba.area=D(U,{softThreshold:!1,threshold:0});var pa=ka(R,{type:"area",getSegments:function(){var a=this,b=[],c=[],d=[],e=this.xAxis,f=this.yAxis,g=f.stacks[this.stackKey],h={},i,j,k=this.points,m=this.options.connectNulls,n,l,p;if(this.options.stacking&&!this.cropped){for(l=0;l<k.length;l++)h[k[l].x]=k[l];for(p in g)g[p].total!==null&&d.push(+p);d.sort(function(a,b){return a-b});o(d,function(b){var d=
|
||||
null,k;if(!m||h[b]&&h[b].y!==null)if(h[b])c.push(h[b]);else{for(l=a.index;l<=f.series.length;l++)if(n=a.getStackIndicator(null,b,l),k=g[b].points[n.key]){d=k[1];break}i=e.translate(b);j=f.getThreshold(d);c.push({y:null,plotX:i,clientX:i,plotY:j,yBottom:j,onMouseOver:ua})}});c.length&&b.push(c)}else R.prototype.getSegments.call(this),b=this.segments;this.segments=b},getSegmentPath:function(a){var b=R.prototype.getSegmentPath.call(this,a),c=[].concat(b),d,e=this.options;d=b.length;var f=this.yAxis.getThreshold(e.threshold),
|
||||
g;d===3&&c.push("L",b[1],b[2]);if(e.stacking&&!this.closedStacks)for(d=a.length-1;d>=0;d--)g=p(a[d].yBottom,f),d<a.length-1&&e.step&&c.push(a[d+1].plotX,g),c.push(a[d].plotX,g);else this.closeSegment(c,a,f);this.areaPath=this.areaPath.concat(c);return b},closeSegment:function(a,b,c){a.push("L",b[b.length-1].plotX,c,"L",b[0].plotX,c)},drawGraph:function(){this.areaPath=[];R.prototype.drawGraph.apply(this);var a=this,b=this.areaPath,c=this.options,d=[["area",this.color,c.fillColor]];o(this.zones,function(b,
|
||||
f){d.push(["zoneArea"+f,b.color||a.color,b.fillColor||c.fillColor])});o(d,function(d){var f=d[0],g=a[f];g?g.animate({d:b}):a[f]=a.chart.renderer.path(b).attr({fill:p(d[2],na(d[1]).setOpacity(p(c.fillOpacity,0.75)).get()),zIndex:0}).add(a.group)})},drawLegendSymbol:Ma.drawRectangle});N.area=pa;ba.spline=D(U);xa=ka(R,{type:"spline",getPointSpline:function(a,b,c){var d=b.plotX,e=b.plotY,f=a[c-1],g=a[c+1],h,i,j,k;if(f&&g){a=f.plotY;j=g.plotX;var g=g.plotY,m;h=(1.5*d+f.plotX)/2.5;i=(1.5*e+a)/2.5;j=(1.5*
|
||||
d+j)/2.5;k=(1.5*e+g)/2.5;m=(k-i)*(j-d)/(j-h)+e-k;i+=m;k+=m;i>a&&i>e?(i=s(a,e),k=2*e-i):i<a&&i<e&&(i=z(a,e),k=2*e-i);k>g&&k>e?(k=s(g,e),i=2*e-k):k<g&&k<e&&(k=z(g,e),i=2*e-k);b.rightContX=j;b.rightContY=k}c?(b=["C",f.rightContX||f.plotX,f.rightContY||f.plotY,h||d,i||e,d,e],f.rightContX=f.rightContY=null):b=["M",d,e];return b}});N.spline=xa;ba.areaspline=D(ba.area);pa=pa.prototype;xa=ka(xa,{type:"areaspline",closedStacks:!0,getSegmentPath:pa.getSegmentPath,closeSegment:pa.closeSegment,drawGraph:pa.drawGraph,
|
||||
drawLegendSymbol:Ma.drawRectangle});N.areaspline=xa;ba.column=D(U,{borderColor:"#FFFFFF",borderRadius:0,groupPadding:0.2,marker:null,pointPadding:0.1,minPointLength:0,cropThreshold:50,pointRange:null,states:{hover:{brightness:0.1,shadow:!1,halo:!1},select:{color:"#C0C0C0",borderColor:"#000000",shadow:!1}},dataLabels:{align:null,verticalAlign:null,y:null},softThreshold:!1,startFromThreshold:!0,stickyTracking:!1,tooltip:{distance:6},threshold:0});xa=ka(R,{type:"column",pointAttrToOptions:{stroke:"borderColor",
|
||||
fill:"color",r:"borderRadius"},cropShoulder:0,directTouch:!0,trackerGroups:["group","dataLabelsGroup"],negStacks:!0,init:function(){R.prototype.init.apply(this,arguments);var a=this,b=a.chart;b.hasRendered&&o(b.series,function(b){if(b.type===a.type)b.isDirty=!0})},getColumnMetrics:function(){var a=this,b=a.options,c=a.xAxis,d=a.yAxis,e=c.reversed,f,g={},h,i=0;b.grouping===!1?i=1:o(a.chart.series,function(b){var c=b.options,e=b.yAxis;if(b.type===a.type&&b.visible&&d.len===e.len&&d.pos===e.pos)c.stacking?
|
||||
(f=b.stackKey,g[f]===x&&(g[f]=i++),h=g[f]):c.grouping!==!1&&(h=i++),b.columnIndex=h});var j=z(O(c.transA)*(c.ordinalSlope||b.pointRange||c.closestPointRange||c.tickInterval||1),c.len),k=j*b.groupPadding,m=(j-2*k)/i,b=z(b.maxPointWidth||c.len,p(b.pointWidth,m*(1-2*b.pointPadding)));return a.columnMetrics={width:b,offset:(m-b)/2+(k+((e?i-(a.columnIndex||0):a.columnIndex)||0)*m-j/2)*(e?-1:1)}},crispCol:function(a,b,c,d){var e=this.chart,f=this.borderWidth,g=-(f%2?0.5:0),f=f%2?0.5:1;e.inverted&&e.renderer.isVML&&
|
||||
(f+=1);c=Math.round(a+c)+g;a=Math.round(a)+g;c-=a;g=O(b)<=0.5;d=Math.round(b+d)+f;b=Math.round(b)+f;d-=b;g&&(b-=1,d+=1);return{x:a,y:b,width:c,height:d}},translate:function(){var a=this,b=a.chart,c=a.options,d=a.borderWidth=p(c.borderWidth,a.closestPointRange*a.xAxis.transA<2?0:1),e=a.yAxis,f=a.translatedThreshold=e.getThreshold(c.threshold),g=p(c.minPointLength,5),h=a.getColumnMetrics(),i=h.width,j=a.barW=s(i,1+2*d),k=a.pointXOffset=h.offset;b.inverted&&(f-=0.5);c.pointPadding&&(j=ta(j));R.prototype.translate.apply(a);
|
||||
o(a.points,function(c){var d=z(p(c.yBottom,f),9E4),h=999+O(d),h=z(s(-h,c.plotY),e.len+h),o=c.plotX+k,q=j,t=z(h,d),w,v=s(h,d)-t;O(v)<g&&g&&(v=g,w=!e.reversed&&!c.negative||e.reversed&&c.negative,t=O(t-f)>g?d-g:f-(w?g:0));c.barX=o;c.pointWidth=i;c.tooltipPos=b.inverted?[e.len+e.pos-b.plotLeft-h,a.xAxis.len-o-q/2,v]:[o+q/2,h+e.pos-b.plotTop,v];c.shapeType="rect";c.shapeArgs=a.crispCol(o,t,q,v)})},getSymbol:ua,drawLegendSymbol:Ma.drawRectangle,drawGraph:ua,drawPoints:function(){var a=this,b=this.chart,
|
||||
c=a.options,d=b.renderer,e=c.animationLimit||250,f,g;o(a.points,function(h){var i=h.plotY,j=h.graphic;if(i!==x&&!isNaN(i)&&h.y!==null)f=h.shapeArgs,i=q(a.borderWidth)?{"stroke-width":a.borderWidth}:{},g=h.pointAttr[h.selected?"select":""]||a.pointAttr[""],j?(cb(j),j.attr(i)[b.pointCount<e?"animate":"attr"](D(f))):h.graphic=d[h.shapeType](f).attr(i).attr(g).add(h.group||a.group).shadow(c.shadow,null,c.stacking&&!c.borderRadius);else if(j)h.graphic=j.destroy()})},animate:function(a){var b=this.yAxis,
|
||||
c=this.options,d=this.chart.inverted,e={};if(ca)a?(e.scaleY=0.001,a=z(b.pos+b.len,s(b.pos,b.toPixels(c.threshold))),d?e.translateX=a-b.len:e.translateY=a,this.group.attr(e)):(e.scaleY=1,e[d?"translateX":"translateY"]=b.pos,this.group.animate(e,this.options.animation),this.animate=null)},remove:function(){var a=this,b=a.chart;b.hasRendered&&o(b.series,function(b){if(b.type===a.type)b.isDirty=!0});R.prototype.remove.apply(a,arguments)}});N.column=xa;ba.bar=D(ba.column);pa=ka(xa,{type:"bar",inverted:!0});
|
||||
N.bar=pa;ba.scatter=D(U,{lineWidth:0,marker:{enabled:!0},tooltip:{headerFormat:'<span style="color:{point.color}">\u25cf</span> <span style="font-size: 10px;"> {series.name}</span><br/>',pointFormat:"x: <b>{point.x}</b><br/>y: <b>{point.y}</b><br/>"}});pa=ka(R,{type:"scatter",sorted:!1,requireSorting:!1,noSharedTooltip:!0,trackerGroups:["group","markerGroup","dataLabelsGroup"],takeOrdinalPosition:!1,kdDimensions:2,drawGraph:function(){this.options.lineWidth&&R.prototype.drawGraph.call(this)}});N.scatter=
|
||||
pa;ba.pie=D(U,{borderColor:"#FFFFFF",borderWidth:1,center:[null,null],clip:!1,colorByPoint:!0,dataLabels:{distance:30,enabled:!0,formatter:function(){return this.y===null?void 0:this.point.name},x:0},ignoreHiddenPoint:!0,legendType:"point",marker:null,size:null,showInLegend:!1,slicedOffset:10,states:{hover:{brightness:0.1,shadow:!1}},stickyTracking:!1,tooltip:{followPointer:!0}});U={type:"pie",isCartesian:!1,pointClass:ka(Fa,{init:function(){Fa.prototype.init.apply(this,arguments);var a=this,b;a.name=
|
||||
p(a.name,"Slice");b=function(b){a.slice(b.type==="select")};I(a,"select",b);I(a,"unselect",b);return a},setVisible:function(a,b){var c=this,d=c.series,e=d.chart,f=d.options.ignoreHiddenPoint,b=p(b,f);if(a!==c.visible){c.visible=c.options.visible=a=a===x?!c.visible:a;d.options.data[La(c,d.data)]=c.options;o(["graphic","dataLabel","connector","shadowGroup"],function(b){if(c[b])c[b][a?"show":"hide"](!0)});c.legendItem&&e.legend.colorizeItem(c,a);!a&&c.state==="hover"&&c.setState("");if(f)d.isDirty=!0;
|
||||
b&&e.redraw()}},slice:function(a,b,c){var d=this.series;Ra(c,d.chart);p(b,!0);this.sliced=this.options.sliced=a=q(a)?a:!this.sliced;d.options.data[La(this,d.data)]=this.options;a=a?this.slicedTranslation:{translateX:0,translateY:0};this.graphic.animate(a);this.shadowGroup&&this.shadowGroup.animate(a)},haloPath:function(a){var b=this.shapeArgs,c=this.series.chart;return this.sliced||!this.visible?[]:this.series.chart.renderer.symbols.arc(c.plotLeft+b.x,c.plotTop+b.y,b.r+a,b.r+a,{innerR:this.shapeArgs.r,
|
||||
start:b.start,end:b.end})}}),requireSorting:!1,directTouch:!0,noSharedTooltip:!0,trackerGroups:["group","dataLabelsGroup"],axisTypes:[],pointAttrToOptions:{stroke:"borderColor","stroke-width":"borderWidth",fill:"color"},animate:function(a){var b=this,c=b.points,d=b.startAngleRad;if(!a)o(c,function(a){var c=a.graphic,g=a.shapeArgs;c&&(c.attr({r:a.startR||b.center[3]/2,start:d,end:d}),c.animate({r:g.r,start:g.start,end:g.end},b.options.animation))}),b.animate=null},updateTotals:function(){var a,b=0,
|
||||
c=this.points,d=c.length,e,f=this.options.ignoreHiddenPoint;for(a=0;a<d;a++)e=c[a],b+=f&&!e.visible?0:e.y;this.total=b;for(a=0;a<d;a++)e=c[a],e.percentage=b>0&&(e.visible||!f)?e.y/b*100:0,e.total=b},generatePoints:function(){R.prototype.generatePoints.call(this);this.updateTotals()},translate:function(a){this.generatePoints();var b=0,c=this.options,d=c.slicedOffset,e=d+c.borderWidth,f,g,h,i=c.startAngle||0,j=this.startAngleRad=ma/180*(i-90),i=(this.endAngleRad=ma/180*(p(c.endAngle,i+360)-90))-j,k=
|
||||
this.points,m=c.dataLabels.distance,c=c.ignoreHiddenPoint,n,l=k.length,o;if(!a)this.center=a=this.getCenter();this.getX=function(b,c){h=V.asin(z((b-a[1])/(a[2]/2+m),1));return a[0]+(c?-1:1)*W(h)*(a[2]/2+m)};for(n=0;n<l;n++){o=k[n];f=j+b*i;if(!c||o.visible)b+=o.percentage/100;g=j+b*i;o.shapeType="arc";o.shapeArgs={x:a[0],y:a[1],r:a[2]/2,innerR:a[3]/2,start:w(f*1E3)/1E3,end:w(g*1E3)/1E3};h=(g+f)/2;h>1.5*ma?h-=2*ma:h<-ma/2&&(h+=2*ma);o.slicedTranslation={translateX:w(W(h)*d),translateY:w(aa(h)*d)};f=
|
||||
W(h)*a[2]/2;g=aa(h)*a[2]/2;o.tooltipPos=[a[0]+f*0.7,a[1]+g*0.7];o.half=h<-ma/2||h>ma/2?1:0;o.angle=h;e=z(e,m/2);o.labelPos=[a[0]+f+W(h)*m,a[1]+g+aa(h)*m,a[0]+f+W(h)*e,a[1]+g+aa(h)*e,a[0]+f,a[1]+g,m<0?"center":o.half?"right":"left",h]}},drawGraph:null,drawPoints:function(){var a=this,b=a.chart.renderer,c,d,e=a.options.shadow,f,g,h;if(e&&!a.shadowGroup)a.shadowGroup=b.g("shadow").add(a.group);o(a.points,function(i){if(i.y!==null){d=i.graphic;g=i.shapeArgs;f=i.shadowGroup;if(e&&!f)f=i.shadowGroup=b.g("shadow").add(a.shadowGroup);
|
||||
c=i.sliced?i.slicedTranslation:{translateX:0,translateY:0};f&&f.attr(c);if(d)d.setRadialReference(a.center).animate(t(g,c));else{h={"stroke-linejoin":"round"};if(!i.visible)h.visibility="hidden";i.graphic=d=b[i.shapeType](g).setRadialReference(a.center).attr(i.pointAttr[i.selected?"select":""]).attr(h).attr(c).add(a.group).shadow(e,f)}}})},searchPoint:ua,sortByAngle:function(a,b){a.sort(function(a,d){return a.angle!==void 0&&(d.angle-a.angle)*b})},drawLegendSymbol:Ma.drawRectangle,getCenter:Xb.getCenter,
|
||||
getSymbol:ua};U=ka(R,U);N.pie=U;R.prototype.drawDataLabels=function(){var a=this,b=a.options,c=b.cursor,d=b.dataLabels,e=a.points,f,g,h=a.hasRendered||0,i,j,k=a.chart.renderer;if(d.enabled||a._hasPointLabels)a.dlProcessOptions&&a.dlProcessOptions(d),j=a.plotGroup("dataLabelsGroup","data-labels",d.defer?"hidden":"visible",d.zIndex||6),p(d.defer,!0)&&(j.attr({opacity:+h}),h||I(a,"afterAnimate",function(){a.visible&&j.show();j[b.animation?"animate":"attr"]({opacity:1},{duration:200})})),g=d,o(e,function(e){var h,
|
||||
l=e.dataLabel,o,r,s=e.connector,w=!0,v,y={};f=e.dlOptions||e.options&&e.options.dataLabels;h=p(f&&f.enabled,g.enabled);if(l&&!h)e.dataLabel=l.destroy();else if(h){d=D(g,f);v=d.style;h=d.rotation;o=e.getLabelConfig();i=d.format?Ia(d.format,o):d.formatter.call(o,d);v.color=p(d.color,v.color,a.color,"black");if(l)if(q(i))l.attr({text:i}),w=!1;else{if(e.dataLabel=l=l.destroy(),s)e.connector=s.destroy()}else if(q(i)){l={fill:d.backgroundColor,stroke:d.borderColor,"stroke-width":d.borderWidth,r:d.borderRadius||
|
||||
0,rotation:h,padding:d.padding,zIndex:1};if(v.color==="contrast")y.color=d.inside||d.distance<0||b.stacking?k.getContrast(e.color||a.color):"#000000";if(c)y.cursor=c;for(r in l)l[r]===x&&delete l[r];l=e.dataLabel=k[h?"text":"label"](i,0,-999,d.shape,null,null,d.useHTML).attr(l).css(t(v,y)).add(j).shadow(d.shadow)}l&&a.alignDataLabel(e,l,d,null,w)}})};R.prototype.alignDataLabel=function(a,b,c,d,e){var f=this.chart,g=f.inverted,h=p(a.plotX,-999),i=p(a.plotY,-999),j=b.getBBox(),k=f.renderer.fontMetrics(c.style.fontSize).b,
|
||||
m=this.visible&&(a.series.forceDL||f.isInsidePlot(h,w(i),g)||d&&f.isInsidePlot(h,g?d.x+1:d.y+d.height-1,g));if(m)d=t({x:g?f.plotWidth-i:h,y:w(g?f.plotHeight-h:i),width:0,height:0},d),t(c,{width:j.width,height:j.height}),c.rotation?(a=f.renderer.rotCorr(k,c.rotation),b[e?"attr":"animate"]({x:d.x+c.x+d.width/2+a.x,y:d.y+c.y+d.height/2}).attr({align:c.align})):(b.align(c,null,d),g=b.alignAttr,p(c.overflow,"justify")==="justify"?this.justifyDataLabel(b,c,g,j,d,e):p(c.crop,!0)&&(m=f.isInsidePlot(g.x,g.y)&&
|
||||
f.isInsidePlot(g.x+j.width,g.y+j.height)),c.shape&&b.attr({anchorX:a.plotX,anchorY:a.plotY}));if(!m)cb(b),b.attr({y:-999}),b.placed=!1};R.prototype.justifyDataLabel=function(a,b,c,d,e,f){var g=this.chart,h=b.align,i=b.verticalAlign,j,k,m=a.box?0:a.padding||0;j=c.x+m;if(j<0)h==="right"?b.align="left":b.x=-j,k=!0;j=c.x+d.width-m;if(j>g.plotWidth)h==="left"?b.align="right":b.x=g.plotWidth-j,k=!0;j=c.y+m;if(j<0)i==="bottom"?b.verticalAlign="top":b.y=-j,k=!0;j=c.y+d.height-m;if(j>g.plotHeight)i==="top"?
|
||||
b.verticalAlign="bottom":b.y=g.plotHeight-j,k=!0;if(k)a.placed=!f,a.align(b,null,e)};if(N.pie)N.pie.prototype.drawDataLabels=function(){var a=this,b=a.data,c,d=a.chart,e=a.options.dataLabels,f=p(e.connectorPadding,10),g=p(e.connectorWidth,1),h=d.plotWidth,i=d.plotHeight,j,k,m=p(e.softConnector,!0),n=e.distance,l=a.center,q=l[2]/2,r=l[1],t=n>0,x,v,y,D=[[],[]],C,B,E,G,H,F=[0,0,0,0],M=function(a,b){return b.y-a.y};if(a.visible&&(e.enabled||a._hasPointLabels)){R.prototype.drawDataLabels.apply(a);o(b,
|
||||
function(a){a.dataLabel&&a.visible&&D[a.half].push(a)});for(G=2;G--;){var J=[],N=[],I=D[G],L=I.length,K;if(L){a.sortByAngle(I,G-0.5);for(H=b=0;!b&&I[H];)b=I[H]&&I[H].dataLabel&&(I[H].dataLabel.getBBox().height||21),H++;if(n>0){v=z(r+q+n,d.plotHeight);for(H=s(0,r-q-n);H<=v;H+=b)J.push(H);v=J.length;if(L>v){c=[].concat(I);c.sort(M);for(H=L;H--;)c[H].rank=H;for(H=L;H--;)I[H].rank>=v&&I.splice(H,1);L=I.length}for(H=0;H<L;H++){c=I[H];y=c.labelPos;c=9999;var Q,P;for(P=0;P<v;P++)Q=O(J[P]-y[1]),Q<c&&(c=Q,
|
||||
K=P);if(K<H&&J[H]!==null)K=H;else for(v<L-H+K&&J[H]!==null&&(K=v-L+H);J[K]===null;)K++;N.push({i:K,y:J[K]});J[K]=null}N.sort(M)}for(H=0;H<L;H++){c=I[H];y=c.labelPos;x=c.dataLabel;E=c.visible===!1?"hidden":"inherit";c=y[1];if(n>0){if(v=N.pop(),K=v.i,B=v.y,c>B&&J[K+1]!==null||c<B&&J[K-1]!==null)B=z(s(0,c),d.plotHeight)}else B=c;C=e.justify?l[0]+(G?-1:1)*(q+n):a.getX(B===r-q-n||B===r+q+n?c:B,G);x._attr={visibility:E,align:y[6]};x._pos={x:C+e.x+({left:f,right:-f}[y[6]]||0),y:B+e.y-10};x.connX=C;x.connY=
|
||||
B;if(this.options.size===null)v=x.width,C-v<f?F[3]=s(w(v-C+f),F[3]):C+v>h-f&&(F[1]=s(w(C+v-h+f),F[1])),B-b/2<0?F[0]=s(w(-B+b/2),F[0]):B+b/2>i&&(F[2]=s(w(B+b/2-i),F[2]))}}}if(Da(F)===0||this.verifyDataLabelOverflow(F))this.placeDataLabels(),t&&g&&o(this.points,function(b){j=b.connector;y=b.labelPos;if((x=b.dataLabel)&&x._pos&&b.visible)E=x._attr.visibility,C=x.connX,B=x.connY,k=m?["M",C+(y[6]==="left"?5:-5),B,"C",C,B,2*y[2]-y[4],2*y[3]-y[5],y[2],y[3],"L",y[4],y[5]]:["M",C+(y[6]==="left"?5:-5),B,"L",
|
||||
y[2],y[3],"L",y[4],y[5]],j?(j.animate({d:k}),j.attr("visibility",E)):b.connector=j=a.chart.renderer.path(k).attr({"stroke-width":g,stroke:e.connectorColor||b.color||"#606060",visibility:E}).add(a.dataLabelsGroup);else if(j)b.connector=j.destroy()})}},N.pie.prototype.placeDataLabels=function(){o(this.points,function(a){var b=a.dataLabel;if(b&&a.visible)(a=b._pos)?(b.attr(b._attr),b[b.moved?"animate":"attr"](a),b.moved=!0):b&&b.attr({y:-999})})},N.pie.prototype.alignDataLabel=ua,N.pie.prototype.verifyDataLabelOverflow=
|
||||
function(a){var b=this.center,c=this.options,d=c.center,e=c.minSize||80,f=e,g;d[0]!==null?f=s(b[2]-s(a[1],a[3]),e):(f=s(b[2]-a[1]-a[3],e),b[0]+=(a[3]-a[1])/2);d[1]!==null?f=s(z(f,b[2]-s(a[0],a[2])),e):(f=s(z(f,b[2]-a[0]-a[2]),e),b[1]+=(a[0]-a[2])/2);f<b[2]?(b[2]=f,b[3]=Math.min(/%$/.test(c.innerSize||0)?f*parseFloat(c.innerSize||0)/100:parseFloat(c.innerSize||0),f),this.translate(b),o(this.points,function(a){if(a.dataLabel)a.dataLabel._pos=null}),this.drawDataLabels&&this.drawDataLabels()):g=!0;return g};
|
||||
if(N.column)N.column.prototype.alignDataLabel=function(a,b,c,d,e){var f=this.chart.inverted,g=a.series,h=a.dlBox||a.shapeArgs,i=p(a.below,a.plotY>p(this.translatedThreshold,g.yAxis.len)),j=p(c.inside,!!this.options.stacking);if(h&&(d=D(h),f&&(d={x:g.yAxis.len-d.y-d.height,y:g.xAxis.len-d.x-d.width,width:d.height,height:d.width}),!j))f?(d.x+=i?0:d.width,d.width=0):(d.y+=i?d.height:0,d.height=0);c.align=p(c.align,!f||j?"center":i?"right":"left");c.verticalAlign=p(c.verticalAlign,f||j?"middle":i?"top":
|
||||
"bottom");R.prototype.alignDataLabel.call(this,a,b,c,d,e)};(function(a){var b=a.Chart,c=a.each,d=a.pick,e=HighchartsAdapter.addEvent;b.prototype.callbacks.push(function(a){function b(){var e=[];c(a.series,function(a){var b=a.options.dataLabels,f=a.dataLabelCollections||["dataLabel"];(b.enabled||a._hasPointLabels)&&!b.allowOverlap&&a.visible&&c(f,function(b){c(a.points,function(a){if(a[b])a[b].labelrank=d(a.labelrank,a.shapeArgs&&a.shapeArgs.height),e.push(a[b])})})});a.hideOverlappingLabels(e)}b();
|
||||
e(a,"redraw",b)});b.prototype.hideOverlappingLabels=function(a){var b=a.length,d,e,j,k,m,n,l;for(e=0;e<b;e++)if(d=a[e])d.oldOpacity=d.opacity,d.newOpacity=1;a.sort(function(a,b){return(b.labelrank||0)-(a.labelrank||0)});for(e=0;e<b;e++){j=a[e];for(d=e+1;d<b;++d)if(k=a[d],j&&k&&j.placed&&k.placed&&j.newOpacity!==0&&k.newOpacity!==0&&(m=j.alignAttr,n=k.alignAttr,l=2*(j.box?0:j.padding),m=!(n.x>m.x+(j.width-l)||n.x+(k.width-l)<m.x||n.y>m.y+(j.height-l)||n.y+(k.height-l)<m.y)))(j.labelrank<k.labelrank?
|
||||
j:k).newOpacity=0}c(a,function(a){var b,c;if(a){c=a.newOpacity;if(a.oldOpacity!==c&&a.placed)c?a.show(!0):b=function(){a.hide()},a.alignAttr.opacity=c,a[a.isOld?"animate":"attr"](a.alignAttr,null,b);a.isOld=!0}})}})(B);U=B.TrackerMixin={drawTrackerPoint:function(){var a=this,b=a.chart,c=b.pointer,d=a.options.cursor,e=d&&{cursor:d},f=function(a){for(var c=a.target,d;c&&!d;)d=c.point,c=c.parentNode;if(d!==x&&d!==b.hoverPoint)d.onMouseOver(a)};o(a.points,function(a){if(a.graphic)a.graphic.element.point=
|
||||
a;if(a.dataLabel)a.dataLabel.element.point=a});if(!a._hasTracking)o(a.trackerGroups,function(b){if(a[b]&&(a[b].addClass("highcharts-tracker").on("mouseover",f).on("mouseout",function(a){c.onTrackerMouseOut(a)}).css(e),ab))a[b].on("touchstart",f)}),a._hasTracking=!0},drawTrackerGraph:function(){var a=this,b=a.options,c=b.trackByArea,d=[].concat(c?a.areaPath:a.graphPath),e=d.length,f=a.chart,g=f.pointer,h=f.renderer,i=f.options.tooltip.snap,j=a.tracker,k=b.cursor,m=k&&{cursor:k},k=a.singlePoints,n,
|
||||
l=function(){if(f.hoverSeries!==a)a.onMouseOver()},p="rgba(192,192,192,"+(ca?1.0E-4:0.002)+")";if(e&&!c)for(n=e+1;n--;)d[n]==="M"&&d.splice(n+1,0,d[n+1]-i,d[n+2],"L"),(n&&d[n]==="M"||n===e)&&d.splice(n,0,"L",d[n-2]+i,d[n-1]);for(n=0;n<k.length;n++)e=k[n],d.push("M",e.plotX-i,e.plotY,"L",e.plotX+i,e.plotY);j?j.attr({d:d}):(a.tracker=h.path(d).attr({"stroke-linejoin":"round",visibility:a.visible?"visible":"hidden",stroke:p,fill:c?p:P,"stroke-width":b.lineWidth+(c?0:2*i),zIndex:2}).add(a.group),o([a.tracker,
|
||||
a.markerGroup],function(a){a.addClass("highcharts-tracker").on("mouseover",l).on("mouseout",function(a){g.onTrackerMouseOut(a)}).css(m);if(ab)a.on("touchstart",l)}))}};if(N.column)xa.prototype.drawTracker=U.drawTrackerPoint;if(N.pie)N.pie.prototype.drawTracker=U.drawTrackerPoint;if(N.scatter)pa.prototype.drawTracker=U.drawTrackerPoint;t(mb.prototype,{setItemEvents:function(a,b,c,d,e){var f=this;(c?b:a.legendGroup).on("mouseover",function(){a.setState("hover");b.css(f.options.itemHoverStyle)}).on("mouseout",
|
||||
function(){b.css(a.visible?d:e);a.setState()}).on("click",function(b){var c=function(){a.setVisible&&a.setVisible()},b={browserEvent:b};a.firePointEvent?a.firePointEvent("legendItemClick",b,c):J(a,"legendItemClick",b,c)})},createCheckboxForItem:function(a){a.checkbox=$("input",{type:"checkbox",checked:a.selected,defaultChecked:a.selected},this.options.itemCheckboxStyle,this.chart.container);I(a.checkbox,"click",function(b){J(a.series||a,"checkboxClick",{checked:b.target.checked,item:a},function(){a.select()})})}});
|
||||
S.legend.itemStyle.cursor="pointer";t(E.prototype,{showResetZoom:function(){var a=this,b=S.lang,c=a.options.chart.resetZoomButton,d=c.theme,e=d.states,f=c.relativeTo==="chart"?null:"plotBox";this.resetZoomButton=a.renderer.button(b.resetZoom,null,null,function(){a.zoomOut()},d,e&&e.hover).attr({align:c.position.align,title:b.resetZoomTitle}).add().align(c.position,!1,f)},zoomOut:function(){var a=this;J(a,"selection",{resetSelection:!0},function(){a.zoom()})},zoom:function(a){var b,c=this.pointer,
|
||||
d=!1,e;!a||a.resetSelection?o(this.axes,function(a){b=a.zoom()}):o(a.xAxis.concat(a.yAxis),function(a){var e=a.axis,h=e.isXAxis;if(c[h?"zoomX":"zoomY"]||c[h?"pinchX":"pinchY"])b=e.zoom(a.min,a.max),e.displayBtn&&(d=!0)});e=this.resetZoomButton;if(d&&!e)this.showResetZoom();else if(!d&&da(e))this.resetZoomButton=e.destroy();b&&this.redraw(p(this.options.chart.animation,a&&a.animation,this.pointCount<100))},pan:function(a,b){var c=this,d=c.hoverPoints,e;d&&o(d,function(a){a.setState()});o(b==="xy"?
|
||||
[1,0]:[1],function(b){var d=a[b?"chartX":"chartY"],h=c[b?"xAxis":"yAxis"][0],i=c[b?"mouseDownX":"mouseDownY"],j=(h.pointRange||0)/2,k=h.getExtremes(),m=h.toValue(i-d,!0)+j,j=h.toValue(i+c[b?"plotWidth":"plotHeight"]-d,!0)-j,i=i>d;if(h.series.length&&(i||m>z(k.dataMin,k.min))&&(!i||j<s(k.dataMax,k.max)))h.setExtremes(m,j,!1,!1,{trigger:"pan"}),e=!0;c[b?"mouseDownX":"mouseDownY"]=d});e&&c.redraw(!1);M(c.container,{cursor:"move"})}});t(Fa.prototype,{select:function(a,b){var c=this,d=c.series,e=d.chart,
|
||||
a=p(a,!c.selected);c.firePointEvent(a?"select":"unselect",{accumulate:b},function(){c.selected=c.options.selected=a;d.options.data[La(c,d.data)]=c.options;c.setState(a&&"select");b||o(e.getSelectedPoints(),function(a){if(a.selected&&a!==c)a.selected=a.options.selected=!1,d.options.data[La(a,d.data)]=a.options,a.setState(""),a.firePointEvent("unselect")})})},onMouseOver:function(a,b){var c=this.series,d=c.chart,e=d.tooltip,f=d.hoverPoint;if(d.hoverSeries!==c)c.onMouseOver();if(f&&f!==this)f.onMouseOut();
|
||||
if(this.series&&(this.firePointEvent("mouseOver"),e&&(!e.shared||c.noSharedTooltip)&&e.refresh(this,a),this.setState("hover"),!b))d.hoverPoint=this},onMouseOut:function(){var a=this.series.chart,b=a.hoverPoints;this.firePointEvent("mouseOut");if(!b||La(this,b)===-1)this.setState(),a.hoverPoint=null},importEvents:function(){if(!this.hasImportedEvents){var a=D(this.series.options.point,this.options).events,b;this.events=a;for(b in a)I(this,b,a[b]);this.hasImportedEvents=!0}},setState:function(a,b){var c=
|
||||
T(this.plotX),d=this.plotY,e=this.series,f=e.options.states,g=ba[e.type].marker&&e.options.marker,h=g&&!g.enabled,i=g&&g.states[a],j=i&&i.enabled===!1,k=e.stateMarkerGraphic,m=this.marker||{},n=e.chart,l=e.halo,o,a=a||"";o=this.pointAttr[a]||e.pointAttr[a];if(!(a===this.state&&!b||this.selected&&a!=="select"||f[a]&&f[a].enabled===!1||a&&(j||h&&i.enabled===!1)||a&&m.states&&m.states[a]&&m.states[a].enabled===!1)){if(this.graphic)g=g&&this.graphic.symbolName&&o.r,this.graphic.attr(D(o,g?{x:c-g,y:d-
|
||||
g,width:2*g,height:2*g}:{})),k&&k.hide();else{if(a&&i)if(g=i.radius,m=m.symbol||e.symbol,k&&k.currentSymbol!==m&&(k=k.destroy()),k)k[b?"animate":"attr"]({x:c-g,y:d-g});else if(m)e.stateMarkerGraphic=k=n.renderer.symbol(m,c-g,d-g,2*g,2*g).attr(o).add(e.markerGroup),k.currentSymbol=m;if(k)k[a&&n.isInsidePlot(c,d,n.inverted)?"show":"hide"](),k.element.point=this}if((c=f[a]&&f[a].halo)&&c.size){if(!l)e.halo=l=n.renderer.path().add(n.seriesGroup);l.attr(t({fill:na(this.color||e.color).setOpacity(c.opacity).get()},
|
||||
c.attributes))[b?"animate":"attr"]({d:this.haloPath(c.size)})}else l&&l.attr({d:[]});this.state=a}},haloPath:function(a){var b=this.series,c=b.chart,d=b.getPlotBox(),e=c.inverted;return c.renderer.symbols.circle(d.translateX+(e?b.yAxis.len-this.plotY:this.plotX)-a,d.translateY+(e?b.xAxis.len-this.plotX:this.plotY)-a,a*2,a*2)}});t(R.prototype,{onMouseOver:function(){var a=this.chart,b=a.hoverSeries;if(b&&b!==this)b.onMouseOut();this.options.events.mouseOver&&J(this,"mouseOver");this.setState("hover");
|
||||
a.hoverSeries=this},onMouseOut:function(){var a=this.options,b=this.chart,c=b.tooltip,d=b.hoverPoint;b.hoverSeries=null;if(d)d.onMouseOut();this&&a.events.mouseOut&&J(this,"mouseOut");c&&!a.stickyTracking&&(!c.shared||this.noSharedTooltip)&&c.hide();this.setState()},setState:function(a){var b=this.options,c=this.graph,d=b.states,e=b.lineWidth,b=0,a=a||"";if(this.state!==a&&(this.state=a,!(d[a]&&d[a].enabled===!1)&&(a&&(e=d[a].lineWidth||e+(d[a].lineWidthPlus||0)),c&&!c.dashstyle))){a={"stroke-width":e};
|
||||
for(c.attr(a);this["zoneGraph"+b];)this["zoneGraph"+b].attr(a),b+=1}},setVisible:function(a,b){var c=this,d=c.chart,e=c.legendItem,f,g=d.options.chart.ignoreHiddenSeries,h=c.visible;f=(c.visible=a=c.userOptions.visible=a===x?!h:a)?"show":"hide";o(["group","dataLabelsGroup","markerGroup","tracker"],function(a){if(c[a])c[a][f]()});if(d.hoverSeries===c||(d.hoverPoint&&d.hoverPoint.series)===c)c.onMouseOut();e&&d.legend.colorizeItem(c,a);c.isDirty=!0;c.options.stacking&&o(d.series,function(a){if(a.options.stacking&&
|
||||
a.visible)a.isDirty=!0});o(c.linkedSeries,function(b){b.setVisible(a,!1)});if(g)d.isDirtyBox=!0;b!==!1&&d.redraw();J(c,f)},show:function(){this.setVisible(!0)},hide:function(){this.setVisible(!1)},select:function(a){this.selected=a=a===x?!this.selected:a;if(this.checkbox)this.checkbox.checked=a;J(this,a?"select":"unselect")},drawTracker:U.drawTrackerGraph});t(B,{Color:na,Point:Fa,Tick:Sa,Renderer:$a,SVGElement:Q,SVGRenderer:Aa,arrayMin:Oa,arrayMax:Da,charts:X,dateFormat:Na,error:la,format:Ia,pathAnim:yb,
|
||||
getOptions:function(){return S},hasBidiBug:Nb,isTouchDevice:Jb,setOptions:function(a){S=D(!0,S,a);Cb();return S},addEvent:I,removeEvent:Y,createElement:$,discardElement:Qa,css:M,each:o,map:Ua,merge:D,splat:ra,extendClass:ka,pInt:G,svg:ca,canvas:fa,vml:!ca&&!fa,product:"Highcharts",version:"4.1.9"})})();
|
||||
18906
lib/highcharts/js/highcharts.src.js
Normal file
18906
lib/highcharts/js/highcharts.src.js
Normal file
File diff suppressed because it is too large
Load Diff
11
lib/highcharts/js/modules/boost.js
Normal file
11
lib/highcharts/js/modules/boost.js
Normal file
@ -0,0 +1,11 @@
|
||||
(function(g,p){function x(a,b,c,d,i){i=i||0;d=d||y;m(a.slice(i,i+d),b);i+d<a.length?setTimeout(function(){x(a,b,c,d,i+d)}):c&&c()}var O=function(){},P=g.Color,l=g.Series,e=g.seriesTypes,m=g.each,s=g.extend,Q=p.addEvent,R=p.fireEvent,S=g.merge,T=g.pick,k=g.wrap,q=g.getOptions().plotOptions,y=5E4;m(["area","arearange","column","line","scatter"],function(a){if(q[a])q[a].boostThreshold=5E3});m(["translate","generatePoints","drawTracker","drawPoints","render"],function(a){function b(b){var d=this.options.stacking&&
|
||||
(a==="translate"||a==="generatePoints");if((this.processedXData||this.options.data).length<(this.options.boostThreshold||Number.MAX_VALUE)||d){if(a==="render"&&this.image)this.image.attr({href:""}),this.animate=null;b.call(this)}else if(this[a+"Canvas"])this[a+"Canvas"]()}k(l.prototype,a,b);a==="translate"&&(e.column&&k(e.column.prototype,a,b),e.arearange&&k(e.arearange.prototype,a,b))});k(l.prototype,"getExtremes",function(a){this.hasExtremes()||a.apply(this,Array.prototype.slice.call(arguments,
|
||||
1))});k(l.prototype,"setData",function(a){this.hasExtremes(!0)||a.apply(this,Array.prototype.slice.call(arguments,1))});k(l.prototype,"processData",function(a){this.hasExtremes(!0)||a.apply(this,Array.prototype.slice.call(arguments,1))});g.extend(l.prototype,{pointRange:0,hasExtremes:function(a){var b=this.options,c=this.xAxis&&this.xAxis.options,d=this.yAxis&&this.yAxis.options;return b.data.length>(b.boostThreshold||Number.MAX_VALUE)&&typeof d.min==="number"&&typeof d.max==="number"&&(!a||typeof c.min===
|
||||
"number"&&typeof c.max==="number")},destroyGraphics:function(){var a=this,b=this.points,c,d;for(d=0;d<b.length;d+=1)if((c=b[d])&&c.graphic)c.graphic=c.graphic.destroy();m(["graph","area"],function(b){a[b]&&(a[b]=a[b].destroy())})},getContext:function(){var a=this.chart.plotWidth,b=this.chart.plotHeight;this.canvas?this.ctx.clearRect(0,0,a,b):(this.canvas=document.createElement("canvas"),this.image=this.chart.renderer.image("",0,0,a,b).add(this.group),this.ctx=this.canvas.getContext("2d"));this.canvas.setAttribute("width",
|
||||
a);this.canvas.setAttribute("height",b);this.image.attr({width:a,height:b});return this.ctx},canvasToSVG:function(){this.image.attr({href:this.canvas.toDataURL("image/png")})},cvsLineTo:function(a,b,c){a.lineTo(b,c)},renderCanvas:function(){var a=this,b=a.options,c=a.chart,d=this.xAxis,i=this.yAxis,h,g,e=0,k=a.processedXData,l=a.processedYData,m=b.data,j=d.getExtremes(),p=j.min,q=j.max,j=i.getExtremes(),U=j.min,V=j.max,z={},t,W=!!a.sampling,A,B=b.marker&&b.marker.radius,C=this.cvsDrawPoint,D=b.lineWidth?
|
||||
this.cvsLineTo:!1,E=B<=1?this.cvsMarkerSquare:this.cvsMarkerCircle,X=b.enableMouseTracking!==!1,F,j=b.threshold,n=i.getThreshold(j),G=typeof j==="number",H=n,Y=this.fill,I=a.pointArrayMap&&a.pointArrayMap.join(",")==="low,high",J=!!b.stacking,Z=a.cropStart||0,j=c.options.loading,$=a.requireSorting,K,aa=b.connectNulls,L=!k,u,v,o,r,ba=a.fillOpacity?(new P(a.color)).setOpacity(T(b.fillOpacity,0.75)).get():a.color,M=function(){Y?(h.fillStyle=ba,h.fill()):(h.strokeStyle=a.color,h.lineWidth=b.lineWidth,
|
||||
h.stroke())},N=function(a,b,c){e===0&&h.beginPath();K?h.moveTo(a,b):C?C(h,a,b,c,F):D?D(h,a,b):E&&E(h,a,b,B);e+=1;e===1E3&&(M(),e=0);F={clientX:a,plotY:b,yBottom:c}},w=function(a,b,c){X&&!z[a+","+b]&&(A.push({clientX:a,plotX:a,plotY:b,i:Z+c}),z[a+","+b]=!0)};this.points&&this.destroyGraphics();a.plotGroup("group","series",a.visible?"visible":"hidden",b.zIndex,c.seriesGroup);a.getAttribs();a.markerGroup=a.group;Q(a,"destroy",function(){a.markerGroup=null});A=this.points=[];h=this.getContext();a.buildKDTree=
|
||||
O;if(m.length>99999)c.options.loading=S(j,{labelStyle:{backgroundColor:"rgba(255,255,255,0.75)",padding:"1em",borderRadius:"0.5em"},style:{backgroundColor:"none",opacity:1}}),c.showLoading("Drawing..."),c.options.loading=j,c.loadingShown===!0?c.loadingShown=1:c.loadingShown+=1;g=0;x(J?a.data:k||m,function(b){var c,f,e,h=!0;L?(c=b[0],f=b[1]):(c=b,f=l[g]);if(I)L&&(f=b.slice(1,3)),e=f[0],f=f[1];else if(J)c=b.x,f=b.stackY,e=f-b.y;b=f===null;$||(h=f>=U&&f<=V);if(!b&&c>=p&&c<=q&&h)if(c=Math.round(d.toPixels(c,
|
||||
!0)),W){if(o===void 0||c===t){I||(e=f);if(r===void 0||f>v)v=f,r=g;if(o===void 0||e<u)u=e,o=g}c!==t&&(o!==void 0&&(f=i.toPixels(v,!0),n=i.toPixels(u,!0),N(c,G?Math.min(f,H):f,G?Math.max(n,H):n),w(c,f,r),n!==f&&w(c,n,o)),o=r=void 0,t=c)}else f=Math.round(i.toPixels(f,!0)),N(c,f,n),w(c,f,g);K=b&&!aa;g+=1;g%y===0&&a.canvasToSVG()},function(){var b=c.loadingDiv,d=+c.loadingShown;M();a.canvasToSVG();R(a,"renderedCanvas");if(d===1)s(b.style,{transition:"opacity 250ms",opacity:0}),c.loadingShown=!1,setTimeout(function(){b.parentNode&&
|
||||
b.parentNode.removeChild(b);c.loadingDiv=c.loadingSpan=null},250);if(d)c.loadingShown=d-1;a.directTouch=!1;a.options.stickyTracking=!0;delete a.buildKDTree;a.buildKDTree()},c.renderer.forExport?Number.MAX_VALUE:void 0)}});e.scatter.prototype.cvsMarkerCircle=function(a,b,c,d){a.moveTo(b,c);a.arc(b,c,d,0,2*Math.PI,!1)};e.scatter.prototype.cvsMarkerSquare=function(a,b,c,d){a.moveTo(b,c);a.rect(b-d,c-d,d*2,d*2)};e.scatter.prototype.fill=!0;s(e.area.prototype,{cvsDrawPoint:function(a,b,c,d,e){e&&b!==e.clientX&&
|
||||
(a.moveTo(e.clientX,e.yBottom),a.lineTo(e.clientX,e.plotY),a.lineTo(b,c),a.lineTo(b,d))},fill:!0,fillOpacity:!0,sampling:!0});s(e.column.prototype,{cvsDrawPoint:function(a,b,c,d){a.rect(b-1,c,1,d-c)},fill:!0,sampling:!0});k(l.prototype,"searchPoint",function(a){var b=a.apply(this,[].slice.call(arguments,1)),c=b;if(b&&!(b instanceof this.pointClass))c=(new this.pointClass).init(this,this.options.data[b.i]),c.dist=b.dist,c.category=c.x,c.plotX=b.plotX,c.plotY=b.plotY;return c})})(Highcharts,HighchartsAdapter);
|
||||
554
lib/highcharts/js/modules/boost.src.js
Normal file
554
lib/highcharts/js/modules/boost.src.js
Normal file
@ -0,0 +1,554 @@
|
||||
/**
|
||||
* This is an experimental Highcharts module that draws long data series on a canvas
|
||||
* in order to increase performance of the initial load time and tooltip responsiveness.
|
||||
*
|
||||
* Compatible with HTML5 canvas compatible browsers (not IE < 9).
|
||||
*
|
||||
* Author: Torstein Honsi
|
||||
*
|
||||
*
|
||||
* Development plan
|
||||
* - Column range.
|
||||
* - Heatmap.
|
||||
* - Treemap.
|
||||
* - Check how it works with Highstock and data grouping.
|
||||
* - Check inverted charts.
|
||||
* - Check reversed axes.
|
||||
* - Chart callback should be async after last series is drawn. (But not necessarily, we don't do
|
||||
that with initial series animation).
|
||||
* - Cache full-size image so we don't have to redraw on hide/show and zoom up. But k-d-tree still
|
||||
* needs to be built.
|
||||
* - Test IE9 and IE10.
|
||||
* - Stacking is not perhaps not correct since it doesn't use the translation given in
|
||||
* the translate method. If this gets to complicated, a possible way out would be to
|
||||
* have a simplified renderCanvas method that simply draws the areaPath on a canvas.
|
||||
*
|
||||
* If this module is taken in as part of the core
|
||||
* - All the loading logic should be merged with core. Update styles in the core.
|
||||
* - Most of the method wraps should probably be added directly in parent methods.
|
||||
*
|
||||
* Notes for boost mode
|
||||
* - Area lines are not drawn
|
||||
* - Point markers are not drawn
|
||||
* - Zones and negativeColor don't work
|
||||
* - Columns are always one pixel wide. Don't set the threshold too low.
|
||||
*
|
||||
* Optimizing tips for users
|
||||
* - For scatter plots, use a marker.radius of 1 or less. It results in a rectangle being drawn, which is
|
||||
* considerably faster than a circle.
|
||||
* - Set extremes (min, max) explicitly on the axes in order for Highcharts to avoid computing extremes.
|
||||
* - Set enableMouseTracking to false on the series to improve total rendering time.
|
||||
* - The default threshold is set based on one series. If you have multiple, dense series, the combined
|
||||
* number of points drawn gets higher, and you may want to set the threshold lower in order to
|
||||
* use optimizations.
|
||||
*/
|
||||
/*global document, Highcharts, HighchartsAdapter, setTimeout */
|
||||
(function (H, HA) {
|
||||
|
||||
'use strict';
|
||||
|
||||
var noop = function () { return undefined; },
|
||||
Color = H.Color,
|
||||
Series = H.Series,
|
||||
seriesTypes = H.seriesTypes,
|
||||
each = H.each,
|
||||
extend = H.extend,
|
||||
addEvent = HA.addEvent,
|
||||
fireEvent = HA.fireEvent,
|
||||
merge = H.merge,
|
||||
pick = H.pick,
|
||||
wrap = H.wrap,
|
||||
plotOptions = H.getOptions().plotOptions,
|
||||
CHUNK_SIZE = 50000;
|
||||
|
||||
function eachAsync(arr, fn, callback, chunkSize, i) {
|
||||
i = i || 0;
|
||||
chunkSize = chunkSize || CHUNK_SIZE;
|
||||
each(arr.slice(i, i + chunkSize), fn);
|
||||
if (i + chunkSize < arr.length) {
|
||||
setTimeout(function () {
|
||||
eachAsync(arr, fn, callback, chunkSize, i + chunkSize);
|
||||
});
|
||||
} else if (callback) {
|
||||
callback();
|
||||
}
|
||||
}
|
||||
|
||||
// Set default options
|
||||
each(['area', 'arearange', 'column', 'line', 'scatter'], function (type) {
|
||||
if (plotOptions[type]) {
|
||||
plotOptions[type].boostThreshold = 5000;
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* Override a bunch of methods the same way. If the number of points is below the threshold,
|
||||
* run the original method. If not, check for a canvas version or do nothing.
|
||||
*/
|
||||
each(['translate', 'generatePoints', 'drawTracker', 'drawPoints', 'render'], function (method) {
|
||||
function branch(proceed) {
|
||||
var letItPass = this.options.stacking && (method === 'translate' || method === 'generatePoints');
|
||||
if ((this.processedXData || this.options.data).length < (this.options.boostThreshold || Number.MAX_VALUE) ||
|
||||
letItPass) {
|
||||
|
||||
// Clear image
|
||||
if (method === 'render' && this.image) {
|
||||
this.image.attr({ href: '' });
|
||||
this.animate = null; // We're zooming in, don't run animation
|
||||
}
|
||||
|
||||
proceed.call(this);
|
||||
|
||||
// If a canvas version of the method exists, like renderCanvas(), run
|
||||
} else if (this[method + 'Canvas']) {
|
||||
|
||||
this[method + 'Canvas']();
|
||||
}
|
||||
}
|
||||
wrap(Series.prototype, method, branch);
|
||||
|
||||
// A special case for some types - its translate method is already wrapped
|
||||
if (method === 'translate') {
|
||||
if (seriesTypes.column) {
|
||||
wrap(seriesTypes.column.prototype, method, branch);
|
||||
}
|
||||
if (seriesTypes.arearange) {
|
||||
wrap(seriesTypes.arearange.prototype, method, branch);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* Do not compute extremes when min and max are set.
|
||||
* If we use this in the core, we can add the hook to hasExtremes to the methods directly.
|
||||
*/
|
||||
wrap(Series.prototype, 'getExtremes', function (proceed) {
|
||||
if (!this.hasExtremes()) {
|
||||
proceed.apply(this, Array.prototype.slice.call(arguments, 1));
|
||||
}
|
||||
});
|
||||
wrap(Series.prototype, 'setData', function (proceed) {
|
||||
if (!this.hasExtremes(true)) {
|
||||
proceed.apply(this, Array.prototype.slice.call(arguments, 1));
|
||||
}
|
||||
});
|
||||
wrap(Series.prototype, 'processData', function (proceed) {
|
||||
if (!this.hasExtremes(true)) {
|
||||
proceed.apply(this, Array.prototype.slice.call(arguments, 1));
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
H.extend(Series.prototype, {
|
||||
pointRange: 0,
|
||||
|
||||
hasExtremes: function (checkX) {
|
||||
var options = this.options,
|
||||
data = options.data,
|
||||
xAxis = this.xAxis && this.xAxis.options,
|
||||
yAxis = this.yAxis && this.yAxis.options;
|
||||
return data.length > (options.boostThreshold || Number.MAX_VALUE) && typeof yAxis.min === 'number' && typeof yAxis.max === 'number' &&
|
||||
(!checkX || (typeof xAxis.min === 'number' && typeof xAxis.max === 'number'));
|
||||
},
|
||||
|
||||
/**
|
||||
* If implemented in the core, parts of this can probably be shared with other similar
|
||||
* methods in Highcharts.
|
||||
*/
|
||||
destroyGraphics: function () {
|
||||
var series = this,
|
||||
points = this.points,
|
||||
point,
|
||||
i;
|
||||
|
||||
for (i = 0; i < points.length; i = i + 1) {
|
||||
point = points[i];
|
||||
if (point && point.graphic) {
|
||||
point.graphic = point.graphic.destroy();
|
||||
}
|
||||
}
|
||||
|
||||
each(['graph', 'area'], function (prop) {
|
||||
if (series[prop]) {
|
||||
series[prop] = series[prop].destroy();
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* Create a hidden canvas to draw the graph on. The contents is later copied over
|
||||
* to an SVG image element.
|
||||
*/
|
||||
getContext: function () {
|
||||
var width = this.chart.plotWidth,
|
||||
height = this.chart.plotHeight;
|
||||
|
||||
if (!this.canvas) {
|
||||
this.canvas = document.createElement('canvas');
|
||||
this.image = this.chart.renderer.image('', 0, 0, width, height).add(this.group);
|
||||
this.ctx = this.canvas.getContext('2d');
|
||||
} else {
|
||||
this.ctx.clearRect(0, 0, width, height);
|
||||
}
|
||||
|
||||
this.canvas.setAttribute('width', width);
|
||||
this.canvas.setAttribute('height', height);
|
||||
this.image.attr({
|
||||
width: width,
|
||||
height: height
|
||||
});
|
||||
|
||||
return this.ctx;
|
||||
},
|
||||
|
||||
/**
|
||||
* Draw the canvas image inside an SVG image
|
||||
*/
|
||||
canvasToSVG: function () {
|
||||
this.image.attr({ href: this.canvas.toDataURL('image/png') });
|
||||
},
|
||||
|
||||
cvsLineTo: function (ctx, clientX, plotY) {
|
||||
ctx.lineTo(clientX, plotY);
|
||||
},
|
||||
|
||||
renderCanvas: function () {
|
||||
var series = this,
|
||||
options = series.options,
|
||||
chart = series.chart,
|
||||
xAxis = this.xAxis,
|
||||
yAxis = this.yAxis,
|
||||
ctx,
|
||||
i,
|
||||
c = 0,
|
||||
xData = series.processedXData,
|
||||
yData = series.processedYData,
|
||||
rawData = options.data,
|
||||
xExtremes = xAxis.getExtremes(),
|
||||
xMin = xExtremes.min,
|
||||
xMax = xExtremes.max,
|
||||
yExtremes = yAxis.getExtremes(),
|
||||
yMin = yExtremes.min,
|
||||
yMax = yExtremes.max,
|
||||
pointTaken = {},
|
||||
lastClientX,
|
||||
sampling = !!series.sampling,
|
||||
points,
|
||||
r = options.marker && options.marker.radius,
|
||||
cvsDrawPoint = this.cvsDrawPoint,
|
||||
cvsLineTo = options.lineWidth ? this.cvsLineTo : false,
|
||||
cvsMarker = r <= 1 ? this.cvsMarkerSquare : this.cvsMarkerCircle,
|
||||
enableMouseTracking = options.enableMouseTracking !== false,
|
||||
lastPoint,
|
||||
threshold = options.threshold,
|
||||
yBottom = yAxis.getThreshold(threshold),
|
||||
hasThreshold = typeof threshold === 'number',
|
||||
translatedThreshold = yBottom,
|
||||
doFill = this.fill,
|
||||
isRange = series.pointArrayMap && series.pointArrayMap.join(',') === 'low,high',
|
||||
isStacked = !!options.stacking,
|
||||
cropStart = series.cropStart || 0,
|
||||
loadingOptions = chart.options.loading,
|
||||
requireSorting = series.requireSorting,
|
||||
wasNull,
|
||||
connectNulls = options.connectNulls,
|
||||
useRaw = !xData,
|
||||
minVal,
|
||||
maxVal,
|
||||
minI,
|
||||
maxI,
|
||||
fillColor = series.fillOpacity ?
|
||||
new Color(series.color).setOpacity(pick(options.fillOpacity, 0.75)).get() :
|
||||
series.color,
|
||||
stroke = function () {
|
||||
if (doFill) {
|
||||
ctx.fillStyle = fillColor;
|
||||
ctx.fill();
|
||||
} else {
|
||||
ctx.strokeStyle = series.color;
|
||||
ctx.lineWidth = options.lineWidth;
|
||||
ctx.stroke();
|
||||
}
|
||||
},
|
||||
drawPoint = function (clientX, plotY, yBottom) {
|
||||
if (c === 0) {
|
||||
ctx.beginPath();
|
||||
}
|
||||
|
||||
if (wasNull) {
|
||||
ctx.moveTo(clientX, plotY);
|
||||
} else {
|
||||
if (cvsDrawPoint) {
|
||||
cvsDrawPoint(ctx, clientX, plotY, yBottom, lastPoint);
|
||||
} else if (cvsLineTo) {
|
||||
cvsLineTo(ctx, clientX, plotY);
|
||||
} else if (cvsMarker) {
|
||||
cvsMarker(ctx, clientX, plotY, r);
|
||||
}
|
||||
}
|
||||
|
||||
// We need to stroke the line for every 1000 pixels. It will crash the browser
|
||||
// memory use if we stroke too infrequently.
|
||||
c = c + 1;
|
||||
if (c === 1000) {
|
||||
stroke();
|
||||
c = 0;
|
||||
}
|
||||
|
||||
// Area charts need to keep track of the last point
|
||||
lastPoint = {
|
||||
clientX: clientX,
|
||||
plotY: plotY,
|
||||
yBottom: yBottom
|
||||
};
|
||||
},
|
||||
|
||||
addKDPoint = function (clientX, plotY, i) {
|
||||
|
||||
// The k-d tree requires series points. Reduce the amount of points, since the time to build the
|
||||
// tree increases exponentially.
|
||||
if (enableMouseTracking && !pointTaken[clientX + ',' + plotY]) {
|
||||
points.push({
|
||||
clientX: clientX,
|
||||
plotX: clientX,
|
||||
plotY: plotY,
|
||||
i: cropStart + i
|
||||
});
|
||||
pointTaken[clientX + ',' + plotY] = true;
|
||||
}
|
||||
};
|
||||
|
||||
// If we are zooming out from SVG mode, destroy the graphics
|
||||
if (this.points) {
|
||||
this.destroyGraphics();
|
||||
}
|
||||
|
||||
// The group
|
||||
series.plotGroup(
|
||||
'group',
|
||||
'series',
|
||||
series.visible ? 'visible' : 'hidden',
|
||||
options.zIndex,
|
||||
chart.seriesGroup
|
||||
);
|
||||
|
||||
series.getAttribs();
|
||||
series.markerGroup = series.group;
|
||||
addEvent(series, 'destroy', function () {
|
||||
series.markerGroup = null;
|
||||
});
|
||||
|
||||
points = this.points = [];
|
||||
ctx = this.getContext();
|
||||
series.buildKDTree = noop; // Do not start building while drawing
|
||||
|
||||
// Display a loading indicator
|
||||
if (rawData.length > 99999) {
|
||||
chart.options.loading = merge(loadingOptions, {
|
||||
labelStyle: {
|
||||
backgroundColor: 'rgba(255,255,255,0.75)',
|
||||
padding: '1em',
|
||||
borderRadius: '0.5em'
|
||||
},
|
||||
style: {
|
||||
backgroundColor: 'none',
|
||||
opacity: 1
|
||||
}
|
||||
});
|
||||
chart.showLoading('Drawing...');
|
||||
chart.options.loading = loadingOptions; // reset
|
||||
if (chart.loadingShown === true) {
|
||||
chart.loadingShown = 1;
|
||||
} else {
|
||||
chart.loadingShown = chart.loadingShown + 1;
|
||||
}
|
||||
}
|
||||
|
||||
// Loop over the points
|
||||
i = 0;
|
||||
eachAsync(isStacked ? series.data : (xData || rawData), function (d) {
|
||||
|
||||
var x,
|
||||
y,
|
||||
clientX,
|
||||
plotY,
|
||||
isNull,
|
||||
low,
|
||||
isYInside = true;
|
||||
|
||||
if (useRaw) {
|
||||
x = d[0];
|
||||
y = d[1];
|
||||
} else {
|
||||
x = d;
|
||||
y = yData[i];
|
||||
}
|
||||
|
||||
// Resolve low and high for range series
|
||||
if (isRange) {
|
||||
if (useRaw) {
|
||||
y = d.slice(1, 3);
|
||||
}
|
||||
low = y[0];
|
||||
y = y[1];
|
||||
} else if (isStacked) {
|
||||
x = d.x;
|
||||
y = d.stackY;
|
||||
low = y - d.y;
|
||||
}
|
||||
|
||||
isNull = y === null;
|
||||
|
||||
// Optimize for scatter zooming
|
||||
if (!requireSorting) {
|
||||
isYInside = y >= yMin && y <= yMax;
|
||||
}
|
||||
|
||||
if (!isNull && x >= xMin && x <= xMax && isYInside) {
|
||||
|
||||
clientX = Math.round(xAxis.toPixels(x, true));
|
||||
|
||||
if (sampling) {
|
||||
if (minI === undefined || clientX === lastClientX) {
|
||||
if (!isRange) {
|
||||
low = y;
|
||||
}
|
||||
if (maxI === undefined || y > maxVal) {
|
||||
maxVal = y;
|
||||
maxI = i;
|
||||
}
|
||||
if (minI === undefined || low < minVal) {
|
||||
minVal = low;
|
||||
minI = i;
|
||||
}
|
||||
|
||||
}
|
||||
if (clientX !== lastClientX) { // Add points and reset
|
||||
if (minI !== undefined) { // then maxI is also a number
|
||||
plotY = yAxis.toPixels(maxVal, true);
|
||||
yBottom = yAxis.toPixels(minVal, true);
|
||||
drawPoint(
|
||||
clientX,
|
||||
hasThreshold ? Math.min(plotY, translatedThreshold) : plotY,
|
||||
hasThreshold ? Math.max(yBottom, translatedThreshold) : yBottom
|
||||
);
|
||||
addKDPoint(clientX, plotY, maxI);
|
||||
if (yBottom !== plotY) {
|
||||
addKDPoint(clientX, yBottom, minI);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
minI = maxI = undefined;
|
||||
lastClientX = clientX;
|
||||
}
|
||||
} else {
|
||||
plotY = Math.round(yAxis.toPixels(y, true));
|
||||
drawPoint(clientX, plotY, yBottom);
|
||||
addKDPoint(clientX, plotY, i);
|
||||
}
|
||||
}
|
||||
wasNull = isNull && !connectNulls;
|
||||
|
||||
i = i + 1;
|
||||
|
||||
if (i % CHUNK_SIZE === 0) {
|
||||
series.canvasToSVG();
|
||||
}
|
||||
|
||||
}, function () {
|
||||
|
||||
var loadingDiv = chart.loadingDiv,
|
||||
loadingShown = +chart.loadingShown;
|
||||
|
||||
stroke();
|
||||
series.canvasToSVG();
|
||||
|
||||
fireEvent(series, 'renderedCanvas');
|
||||
|
||||
// Do not use chart.hideLoading, as it runs JS animation and will be blocked by buildKDTree.
|
||||
// CSS animation looks good, but then it must be deleted in timeout. If we add the module to core,
|
||||
// change hideLoading so we can skip this block.
|
||||
if (loadingShown === 1) {
|
||||
extend(loadingDiv.style, {
|
||||
transition: 'opacity 250ms',
|
||||
opacity: 0
|
||||
});
|
||||
|
||||
chart.loadingShown = false;
|
||||
setTimeout(function () {
|
||||
if (loadingDiv.parentNode) { // In exporting it is falsy
|
||||
loadingDiv.parentNode.removeChild(loadingDiv);
|
||||
}
|
||||
chart.loadingDiv = chart.loadingSpan = null;
|
||||
}, 250);
|
||||
}
|
||||
if (loadingShown) {
|
||||
chart.loadingShown = loadingShown - 1;
|
||||
}
|
||||
|
||||
// Pass tests in Pointer.
|
||||
// TODO: Replace this with a single property, and replace when zooming in
|
||||
// below boostThreshold.
|
||||
series.directTouch = false;
|
||||
series.options.stickyTracking = true;
|
||||
|
||||
delete series.buildKDTree; // Go back to prototype, ready to build
|
||||
series.buildKDTree();
|
||||
|
||||
// Don't do async on export, the exportChart, getSVGForExport and getSVG methods are not chained for it.
|
||||
}, chart.renderer.forExport ? Number.MAX_VALUE : undefined);
|
||||
}
|
||||
});
|
||||
|
||||
seriesTypes.scatter.prototype.cvsMarkerCircle = function (ctx, clientX, plotY, r) {
|
||||
ctx.moveTo(clientX, plotY);
|
||||
ctx.arc(clientX, plotY, r, 0, 2 * Math.PI, false);
|
||||
};
|
||||
|
||||
// Rect is twice as fast as arc, should be used for small markers
|
||||
seriesTypes.scatter.prototype.cvsMarkerSquare = function (ctx, clientX, plotY, r) {
|
||||
ctx.moveTo(clientX, plotY);
|
||||
ctx.rect(clientX - r, plotY - r, r * 2, r * 2);
|
||||
};
|
||||
seriesTypes.scatter.prototype.fill = true;
|
||||
|
||||
extend(seriesTypes.area.prototype, {
|
||||
cvsDrawPoint: function (ctx, clientX, plotY, yBottom, lastPoint) {
|
||||
if (lastPoint && clientX !== lastPoint.clientX) {
|
||||
ctx.moveTo(lastPoint.clientX, lastPoint.yBottom);
|
||||
ctx.lineTo(lastPoint.clientX, lastPoint.plotY);
|
||||
ctx.lineTo(clientX, plotY);
|
||||
ctx.lineTo(clientX, yBottom);
|
||||
}
|
||||
},
|
||||
fill: true,
|
||||
fillOpacity: true,
|
||||
sampling: true
|
||||
});
|
||||
|
||||
extend(seriesTypes.column.prototype, {
|
||||
cvsDrawPoint: function (ctx, clientX, plotY, yBottom) {
|
||||
ctx.rect(clientX - 1, plotY, 1, yBottom - plotY);
|
||||
},
|
||||
fill: true,
|
||||
sampling: true
|
||||
});
|
||||
|
||||
/**
|
||||
* Return a point instance from the k-d-tree
|
||||
*/
|
||||
wrap(Series.prototype, 'searchPoint', function (proceed) {
|
||||
var point = proceed.apply(this, [].slice.call(arguments, 1)),
|
||||
ret = point;
|
||||
|
||||
if (point && !(point instanceof this.pointClass)) {
|
||||
ret = (new this.pointClass()).init(this, this.options.data[point.i]);
|
||||
ret.dist = point.dist;
|
||||
ret.category = ret.x;
|
||||
ret.plotX = point.plotX;
|
||||
ret.plotY = point.plotY;
|
||||
}
|
||||
return ret;
|
||||
});
|
||||
}(Highcharts, HighchartsAdapter));
|
||||
6
lib/highcharts/js/modules/broken-axis.js
Normal file
6
lib/highcharts/js/modules/broken-axis.js
Normal file
@ -0,0 +1,6 @@
|
||||
(function(i){function p(){return Array.prototype.slice.call(arguments,1)}var n=i.pick,m=i.wrap,q=i.extend,o=HighchartsAdapter.fireEvent,k=i.Axis,r=i.Series;q(k.prototype,{isInBreak:function(h,f){var c=h.repeat||Infinity,b=h.from,a=h.to-h.from,c=f>=b?(f-b)%c:c-(b-f)%c;return h.inclusive?c<=a:c<a&&c!==0},isInAnyBreak:function(h,f){var c=this.options.breaks,b=c&&c.length,a,d,e;if(b){for(;b--;)this.isInBreak(c[b],h)&&(a=!0,d||(d=n(c[b].showPoints,this.isXAxis?!1:!0)));e=a&&f?a&&!d:a}return e}});m(k.prototype,
|
||||
"setTickPositions",function(h){h.apply(this,Array.prototype.slice.call(arguments,1));if(this.options.breaks){var f=this.tickPositions,c=this.tickPositions.info,b=[],a;for(a=0;a<f.length;a++)this.isInAnyBreak(f[a])||b.push(f[a]);this.tickPositions=b;this.tickPositions.info=c}});m(k.prototype,"init",function(h,f,c){if(c.breaks&&c.breaks.length)c.ordinal=!1;h.call(this,f,c);if(this.options.breaks){var b=this;b.doPostTranslate=!0;this.val2lin=function(a){var d=a,e,c;for(c=0;c<b.breakArray.length;c++)if(e=
|
||||
b.breakArray[c],e.to<=a)d-=e.len;else if(e.from>=a)break;else if(b.isInBreak(e,a)){d-=a-e.from;break}return d};this.lin2val=function(a){var d,e;for(e=0;e<b.breakArray.length;e++)if(d=b.breakArray[e],d.from>=a)break;else d.to<a?a+=d.len:b.isInBreak(d,a)&&(a+=d.len);return a};this.setExtremes=function(a,b,e,c,f){for(;this.isInAnyBreak(a);)a-=this.closestPointRange;for(;this.isInAnyBreak(b);)b-=this.closestPointRange;k.prototype.setExtremes.call(this,a,b,e,c,f)};this.setAxisTranslation=function(a){k.prototype.setAxisTranslation.call(this,
|
||||
a);var d=b.options.breaks,a=[],e=[],c=0,f,g,h=b.userMin||b.min,l=b.userMax||b.max,j,i;for(i in d)g=d[i],f=g.repeat||Infinity,b.isInBreak(g,h)&&(h+=g.to%f-h%f),b.isInBreak(g,l)&&(l-=l%f-g.from%f);for(i in d){g=d[i];j=g.from;for(f=g.repeat||Infinity;j-f>h;)j-=f;for(;j<h;)j+=f;for(;j<l;j+=f)a.push({value:j,move:"in"}),a.push({value:j+(g.to-g.from),move:"out",size:g.breakSize})}a.sort(function(a,b){return a.value===b.value?(a.move==="in"?0:1)-(b.move==="in"?0:1):a.value-b.value});d=0;j=h;for(i in a){g=
|
||||
a[i];d+=g.move==="in"?1:-1;if(d===1&&g.move==="in")j=g.value;d===0&&(e.push({from:j,to:g.value,len:g.value-j-(g.size||0)}),c+=g.value-j-(g.size||0))}b.breakArray=e;o(b,"afterBreaks");b.transA*=(l-b.min)/(l-h-c);b.min=h;b.max=l}}});m(r.prototype,"generatePoints",function(h){h.apply(this,p(arguments));var f=this.xAxis,c=this.yAxis,b=this.points,a,d=b.length,e=this.options.connectNulls,i;if(f&&c&&(f.options.breaks||c.options.breaks))for(;d--;)if(a=b[d],i=a.y===null&&e===!1,!i&&(f.isInAnyBreak(a.x,!0)||
|
||||
c.isInAnyBreak(a.y,!0)))b.splice(d,1),this.data[d]&&this.data[d].destroyElements()});m(i.seriesTypes.column.prototype,"drawPoints",function(h){h.apply(this);var h=this.points,f=this.yAxis,c=f.breakArray||[],b=n(this.options.threshold,f.min),a,d,e,i,k,g;for(i=0;i<h.length;i++){d=h[i];g=d.stackY||d.y;for(k=0;k<c.length;k++){e=c[k];a=!1;if(b<e.from&&g>e.to||b>e.from&&g<e.from)a="pointBreak";else if(b<e.from&&g>e.from&&g<e.to||b>e.from&&g>e.to&&g<e.from)a="pointInBreak";a&&o(f,a,{point:d,brk:e})}}})})(Highcharts);
|
||||
314
lib/highcharts/js/modules/broken-axis.src.js
Normal file
314
lib/highcharts/js/modules/broken-axis.src.js
Normal file
@ -0,0 +1,314 @@
|
||||
/**
|
||||
* Highcharts JS v4.1.9 (2015-10-07)
|
||||
* Highcharts Broken Axis module
|
||||
*
|
||||
* Author: Stephane Vanraes, Torstein Honsi
|
||||
* License: www.highcharts.com/license
|
||||
*/
|
||||
|
||||
/*global HighchartsAdapter*/
|
||||
(function (H) {
|
||||
|
||||
"use strict";
|
||||
|
||||
var pick = H.pick,
|
||||
wrap = H.wrap,
|
||||
extend = H.extend,
|
||||
fireEvent = HighchartsAdapter.fireEvent,
|
||||
Axis = H.Axis,
|
||||
Series = H.Series;
|
||||
|
||||
function stripArguments() {
|
||||
return Array.prototype.slice.call(arguments, 1);
|
||||
}
|
||||
|
||||
extend(Axis.prototype, {
|
||||
isInBreak: function (brk, val) {
|
||||
var ret,
|
||||
repeat = brk.repeat || Infinity,
|
||||
from = brk.from,
|
||||
length = brk.to - brk.from,
|
||||
test = (val >= from ? (val - from) % repeat : repeat - ((from - val) % repeat));
|
||||
|
||||
if (!brk.inclusive) {
|
||||
ret = test < length && test !== 0;
|
||||
} else {
|
||||
ret = test <= length;
|
||||
}
|
||||
return ret;
|
||||
},
|
||||
|
||||
isInAnyBreak: function (val, testKeep) {
|
||||
|
||||
var breaks = this.options.breaks,
|
||||
i = breaks && breaks.length,
|
||||
inbrk,
|
||||
keep,
|
||||
ret;
|
||||
|
||||
|
||||
if (i) {
|
||||
|
||||
while (i--) {
|
||||
if (this.isInBreak(breaks[i], val)) {
|
||||
inbrk = true;
|
||||
if (!keep) {
|
||||
keep = pick(breaks[i].showPoints, this.isXAxis ? false : true);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (inbrk && testKeep) {
|
||||
ret = inbrk && !keep;
|
||||
} else {
|
||||
ret = inbrk;
|
||||
}
|
||||
}
|
||||
return ret;
|
||||
}
|
||||
});
|
||||
|
||||
wrap(Axis.prototype, 'setTickPositions', function (proceed) {
|
||||
proceed.apply(this, Array.prototype.slice.call(arguments, 1));
|
||||
|
||||
if (this.options.breaks) {
|
||||
var axis = this,
|
||||
tickPositions = this.tickPositions,
|
||||
info = this.tickPositions.info,
|
||||
newPositions = [],
|
||||
i;
|
||||
|
||||
for (i = 0; i < tickPositions.length; i++) {
|
||||
if (!axis.isInAnyBreak(tickPositions[i])) {
|
||||
newPositions.push(tickPositions[i]);
|
||||
}
|
||||
}
|
||||
|
||||
this.tickPositions = newPositions;
|
||||
this.tickPositions.info = info;
|
||||
}
|
||||
});
|
||||
|
||||
wrap(Axis.prototype, 'init', function (proceed, chart, userOptions) {
|
||||
// Force Axis to be not-ordinal when breaks are defined
|
||||
if (userOptions.breaks && userOptions.breaks.length) {
|
||||
userOptions.ordinal = false;
|
||||
}
|
||||
|
||||
proceed.call(this, chart, userOptions);
|
||||
|
||||
if (this.options.breaks) {
|
||||
|
||||
var axis = this;
|
||||
|
||||
axis.doPostTranslate = true;
|
||||
|
||||
this.val2lin = function (val) {
|
||||
var nval = val,
|
||||
brk,
|
||||
i;
|
||||
|
||||
for (i = 0; i < axis.breakArray.length; i++) {
|
||||
brk = axis.breakArray[i];
|
||||
if (brk.to <= val) {
|
||||
nval -= brk.len;
|
||||
} else if (brk.from >= val) {
|
||||
break;
|
||||
} else if (axis.isInBreak(brk, val)) {
|
||||
nval -= (val - brk.from);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
return nval;
|
||||
};
|
||||
|
||||
this.lin2val = function (val) {
|
||||
var nval = val,
|
||||
brk,
|
||||
i;
|
||||
|
||||
for (i = 0; i < axis.breakArray.length; i++) {
|
||||
brk = axis.breakArray[i];
|
||||
if (brk.from >= nval) {
|
||||
break;
|
||||
} else if (brk.to < nval) {
|
||||
nval += brk.len;
|
||||
} else if (axis.isInBreak(brk, nval)) {
|
||||
nval += brk.len;
|
||||
}
|
||||
}
|
||||
return nval;
|
||||
};
|
||||
|
||||
this.setExtremes = function (newMin, newMax, redraw, animation, eventArguments) {
|
||||
// If trying to set extremes inside a break, extend it to before and after the break ( #3857 )
|
||||
while (this.isInAnyBreak(newMin)) {
|
||||
newMin -= this.closestPointRange;
|
||||
}
|
||||
while (this.isInAnyBreak(newMax)) {
|
||||
newMax -= this.closestPointRange;
|
||||
}
|
||||
Axis.prototype.setExtremes.call(this, newMin, newMax, redraw, animation, eventArguments);
|
||||
};
|
||||
|
||||
this.setAxisTranslation = function (saveOld) {
|
||||
Axis.prototype.setAxisTranslation.call(this, saveOld);
|
||||
|
||||
var breaks = axis.options.breaks,
|
||||
breakArrayT = [], // Temporary one
|
||||
breakArray = [],
|
||||
length = 0,
|
||||
inBrk,
|
||||
repeat,
|
||||
brk,
|
||||
min = axis.userMin || axis.min,
|
||||
max = axis.userMax || axis.max,
|
||||
start,
|
||||
i,
|
||||
j;
|
||||
|
||||
// Min & max check (#4247)
|
||||
for (i in breaks) {
|
||||
brk = breaks[i];
|
||||
repeat = brk.repeat || Infinity;
|
||||
if (axis.isInBreak(brk, min)) {
|
||||
min += (brk.to % repeat) - (min % repeat);
|
||||
}
|
||||
if (axis.isInBreak(brk, max)) {
|
||||
max -= (max % repeat) - (brk.from % repeat);
|
||||
}
|
||||
}
|
||||
|
||||
// Construct an array holding all breaks in the axis
|
||||
for (i in breaks) {
|
||||
brk = breaks[i];
|
||||
start = brk.from;
|
||||
repeat = brk.repeat || Infinity;
|
||||
|
||||
while (start - repeat > min) {
|
||||
start -= repeat;
|
||||
}
|
||||
while (start < min) {
|
||||
start += repeat;
|
||||
}
|
||||
|
||||
for (j = start; j < max; j += repeat) {
|
||||
breakArrayT.push({
|
||||
value: j,
|
||||
move: 'in'
|
||||
});
|
||||
breakArrayT.push({
|
||||
value: j + (brk.to - brk.from),
|
||||
move: 'out',
|
||||
size: brk.breakSize
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
breakArrayT.sort(function (a, b) {
|
||||
if (a.value === b.value) {
|
||||
return (a.move === 'in' ? 0 : 1) - (b.move === 'in' ? 0 : 1);
|
||||
} else {
|
||||
return a.value - b.value;
|
||||
}
|
||||
});
|
||||
|
||||
// Simplify the breaks
|
||||
inBrk = 0;
|
||||
start = min;
|
||||
|
||||
for (i in breakArrayT) {
|
||||
brk = breakArrayT[i];
|
||||
inBrk += (brk.move === 'in' ? 1 : -1);
|
||||
|
||||
if (inBrk === 1 && brk.move === 'in') {
|
||||
start = brk.value;
|
||||
}
|
||||
if (inBrk === 0) {
|
||||
breakArray.push({
|
||||
from: start,
|
||||
to: brk.value,
|
||||
len: brk.value - start - (brk.size || 0)
|
||||
});
|
||||
length += brk.value - start - (brk.size || 0);
|
||||
}
|
||||
}
|
||||
|
||||
axis.breakArray = breakArray;
|
||||
|
||||
fireEvent(axis, 'afterBreaks');
|
||||
|
||||
axis.transA *= ((max - axis.min) / (max - min - length));
|
||||
|
||||
axis.min = min;
|
||||
axis.max = max;
|
||||
};
|
||||
}
|
||||
});
|
||||
|
||||
wrap(Series.prototype, 'generatePoints', function (proceed) {
|
||||
|
||||
proceed.apply(this, stripArguments(arguments));
|
||||
|
||||
var series = this,
|
||||
xAxis = series.xAxis,
|
||||
yAxis = series.yAxis,
|
||||
points = series.points,
|
||||
point,
|
||||
i = points.length,
|
||||
connectNulls = series.options.connectNulls,
|
||||
nullGap;
|
||||
|
||||
|
||||
if (xAxis && yAxis && (xAxis.options.breaks || yAxis.options.breaks)) {
|
||||
while (i--) {
|
||||
point = points[i];
|
||||
|
||||
nullGap = point.y === null && connectNulls === false; // respect nulls inside the break (#4275)
|
||||
if (!nullGap && (xAxis.isInAnyBreak(point.x, true) || yAxis.isInAnyBreak(point.y, true))) {
|
||||
points.splice(i, 1);
|
||||
if (this.data[i]) {
|
||||
this.data[i].destroyElements(); // removes the graphics for this point if they exist
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
wrap(H.seriesTypes.column.prototype, 'drawPoints', function (proceed) {
|
||||
proceed.apply(this);
|
||||
|
||||
var series = this,
|
||||
points = series.points,
|
||||
yAxis = series.yAxis,
|
||||
breaks = yAxis.breakArray || [],
|
||||
threshold = pick(this.options.threshold, yAxis.min),
|
||||
eventName,
|
||||
point,
|
||||
brk,
|
||||
i,
|
||||
j,
|
||||
y;
|
||||
|
||||
for (i = 0; i < points.length; i++) {
|
||||
point = points[i];
|
||||
y = point.stackY || point.y;
|
||||
for (j = 0; j < breaks.length; j++) {
|
||||
brk = breaks[j];
|
||||
eventName = false;
|
||||
|
||||
if ((threshold < brk.from && y > brk.to) || (threshold > brk.from && y < brk.from)) {
|
||||
eventName = 'pointBreak';
|
||||
} else if ((threshold < brk.from && y > brk.from && y < brk.to) || (threshold > brk.from && y > brk.to && y < brk.from)) { // point falls inside the break
|
||||
eventName = 'pointInBreak'; // docs
|
||||
}
|
||||
if (eventName) {
|
||||
fireEvent(yAxis, eventName, {point: point, brk: brk});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
}(Highcharts));
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue
Block a user