canvas实现K-Medoids聚类算法可视化执行过程效果代码
代码语言:html
所属分类:其他
代码描述:canvas实现K-Medoids聚类算法可视化执行过程效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!doctype html>
<html lang="en-us">
<head>
<meta charset="utf-8">
</head>
<body>
<div class="center">
<article>
<div class="social">
</div>
<h1 class="title">K-Medoids</h1>
<div class="content">
<div>
<p>A visualization of a <a href="http://en.wikipedia.org/wiki/K-medoids">K-medoids clustering</a>.</p>
<style>
.post {
max-width: none;
width: 480px;
padding: 0;
}
</style>
<p><button onclick="doStep()">Step</button>
<canvas id="canvas" ></canvas></p>
<script>
var size = {x: 480, y:480};
var canvas = document.getElementById("canvas");
canvas.width = size.x;
canvas.height = size.y;
var TAU = Math.PI*2;
var draw = canvas.getContext("2d");
var data = [{ label : "A", x : 2, y : 4 },
{ label : "B", x : 7, y : 3 },
{ label : "C", x : 3, y : 5 },
{ label : "D", x : 5, y : 3 },
{ label : "E", x : 7, y : 4 },
{ label : "F", x : 6, y : 8 },
{ label : "G", x : 6, y : 5 },
{ label : "H", x : 8, y : 4 },
{ label : "I", x : 2, y : 5 },
{ label : "J", x : 3, y : 7 }];
var dataMap = {};
for(var i = 0; i < data.length; i += 1)
dataMap[data[i].label] = data[i];
var stepInterval = 0;
var state = {
tick : 0,
centers : []
};
function clone(obj){
var res = {};
for(var i in obj)
if(typeof(obj[i]) == "object")
res[i] = clone(obj[i])
else
res[i] = obj[i];
return res;
}
function stop(){
clearInterval(stepInterval);
}
function reset(){
state.tick = 0;
state.centers = [{link:"D"}, {link:"E"}, {link:"H"}];
for(var i = 0; i < state.centers.length; i += 1){
state.centers[i].children = [];
}
}
function start(){
.........完整代码请登录后点击上方下载按钮下载查看
网友评论0