点击添加点 | JShare

var chart = Highcharts.chart('container', {
		chart: {
				type: 'scatter',
				margin: [70, 50, 60, 80],
				events: {
						click: function (e) {
								// 从点击事件里获取 x, y 值
								var x = e.xAxis[0].value,
										y = e.yAxis[0].value,
										series = this.series[0];
								// 增加点
								series.addPoint([x, y]);
						}
				}
		},
		title: {
				text: '可手动添加数据的动态图'
		},
		subtitle: {
				text: '单击绘图区添加点，单击点可删除此点.'
		},
		xAxis: {
				gridLineWidth: 1,
				minPadding: 0.2,
				maxPadding: 0.2,
				maxZoom: 60
		},
		yAxis: {
				title: {
						text: '数值'
				},
				minPadding: 0.2,
				maxPadding: 0.2,
				maxZoom: 60,
				plotLines: [{
						value: 0,
						width: 1,
						color: '#808080'
				}]
		},
		legend: {
				enabled: false
		},
		plotOptions: {
				series: {
						lineWidth: 1,
						point: {
								events: {
										'click': function () {
												if (this.series.data.length > 1) {
														this.remove();
												}
										}
								}
						}
				}
		},
		series: [{
				name:'图例1',
				data: [[20, 20], [80, 80]]
		}]
});

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

{"doctype":0,"resouces":"3,7,https://code.hcharts.cn/plugins/zh_cn.js","options":"{\"editor\":{\"saveLayout\":false,\"saveFold\":false,\"autoFormat\":true},\"hcode\":{\"layoutId\":7}}","meta":"<link rel=\"icon\" href=\"https://jscdn.com.cn/highcharts/images/favicon.ico\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">"}

点击添加点 | JShare

模板（查看所有模板）