代码信息

保存到分组
外部资源
$[libs.length]
暂无
- $[lib.showName]
添加新的资源

$[newLibMessage]

更多文件见开放CDN服务
快捷键
快捷键风格同 Sublime，同时支持 Emmet 特性，常用快捷键：

全局快捷键
- Ctrl + Enter：运行
- Ctrl + ←/→：折叠左侧菜单
- Ctrl + O：打开添加常用资源
- Ctrl + Z：撤销所有编辑器
- Ctrl + U：恢复所有编辑器
- F11：最大化运行结果
- ESC：关闭添加常用资源
编辑器快捷键
- Ctrl + Enter：运行
- Ctrl + /：注释代码
- Ctrl + H：格式化代码
- Ctrl + Z：撤销
- Ctrl + Y：恢复
- Tab：快捷生成代码
- Ctrl + L：选中当前行
- Ctrl + Q：折叠当前代码
- F11：最大化当前编辑器
关于

JShare 是一个在线代码测试、托管、分享的工具；

当前版本 $[base.version]，这里有更新日志；

使用前请查阅帮助文档及说明；

Copyright © 2020 JShare，由简数科技提供服务，浙ICP备16004892号-3

鼠标滚轮缩放 | JShare

结合 Highmaps 的 mapNavigation 功能实现滚轮缩放

$(function () {
	$.getJSON('https://data.jianshukeji.com/jsonp?filename=json/usdeur.json&callback=?', function (data) {
		$('#container').highcharts({
			chart: {
				zoomType: 'x'
			},
			title: {
				text: '美元兑欧元汇率走势图'
			},
			subtitle: {
				text: document.ontouchstart === undefined ?
				'鼠标拖动、滚轮可以进行缩放' : '手势操作进行缩放'
			},
			mapNavigation: {
				enabled: true,
				enableButtons: false
			},
			xAxis: {
				type: 'datetime',
				dateTimeLabelFormats: {
					millisecond: '%H:%M:%S.%L',
					second: '%H:%M:%S',
					minute: '%H:%M',
					hour: '%H:%M',
					day: '%m-%d',
					week: '%m-%d',
					month: '%Y-%m',
					year: '%Y'
				}
			},
			tooltip: {
				dateTimeLabelFormats: {
					millisecond: '%H:%M:%S.%L',
					second: '%H:%M:%S',
					minute: '%H:%M',
					hour: '%H:%M',
					day: '%Y-%m-%d',
					week: '%m-%d',
					month: '%Y-%m',
					year: '%Y'
				}
			},
			yAxis: {
				title: {
					text: '汇率'
				}
			},
			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: '美元兑欧元',
				data: data
			}]
		});
	});
});

<div id="container" style="min-width:400px;height:400px"></div>

{"resource":"1,3,7,31,https://code.hcharts.cn/plugins/zh_cn.js","options":"{\"editor\":{\"saveLayout\":false,\"saveFold\":false,\"autoFormat\":true},\"hcode\":{\"layoutId\":7}}","code":{"code":"hhhhx1","name":"鼠标滚轮缩放","version":30,"doctype":2,"description":"结合 Highmaps 的 mapNavigation 功能实现滚轮缩放","meta":"<link rel=\"icon\" href=\"https://jscdn.com.cn/highcharts/images/favicon.ico\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">","newGroup":8,"group":{"id":8,"name":"demos","code":"demos"}}}

代码信息

保存到分组

外部资源 $[libs.length]

添加新的资源

快捷键

全局快捷键

编辑器快捷键

关于

鼠标滚轮缩放 | JShare

结合 Highmaps 的 mapNavigation 功能实现滚轮缩放

模板（查看所有模板）

外部资源
$[libs.length]