整理桌面

This commit is contained in:
2022-04-10 00:37:53 +08:00
parent 82e3f2623f
commit e25c8bb318
728 changed files with 986384 additions and 16 deletions

View File

@@ -0,0 +1,7 @@
$( document ).ready(function() {
$( ".start" ).click(function() {
$( ".start" ).html('<span class="glyphicon glyphicon-dashboard" aria-hidden="true"></span> Running...');
newNeat();
loop();
});
});

View File

@@ -0,0 +1,92 @@
.btn-group, .input-group, pre{
margin-top: 10px;
}
.node {
cursor: move;
stroke-width: 1.5px;
}
.link {
fill: none;
stroke: #BDBDBD;
stroke-width: 1.5px;
opacity: 0.4;
marker-end: url(#end-arrow);
}
.label {
fill: #CCCCCC;
font-size: 9px;
text-anchor: middle;
cursor: move;
font-family: Arial;
}
#end-arrow{
opacity: 0.4;
}
.INPUT{
fill: #ff6666;
stroke: #ff4d4d;
}
.OUTPUT{
fill : #ff8c66;
stroke: #ff794d;
}
.LOGISTIC{
fill: #ffb366;
stroke: #ffa64d;
}
.TANH{
fill: #ffd966;
stroke: #ffd24d;
}
.IDENTITY{
fill: #ffff66;
stroke: #ffff4d;
}
.STEP{
fill: #d9ff66;
stroke: #d2ff4d;
}
.RELU{
fill: #b3ff66;
stroke: #a6ff4d;
}
.SOFTSIGN{
fill: #8cff66;
stroke: #79ff4d;
}
.SINUSOID{
fill: #66ff66;
stroke: #4dff4d;
}
.GAUSSIAN{
fill: #66ff8c;
stroke: #4dff79;
}
.BENT_IDENTITY{
fill: #66ffd9;
stroke: #4dffd2;
}
.BIPOLAR{
fill: #66d9ff;
stroke: #4dd2ff;
}
.BIPOLAR_SIGMOID{
fill: #66b3ff;
stroke: #4da6ff;
}
.HARD_TANH{
fill: #668cff;
stroke: #4d79ff;
}
.ABSOLUTE{
fill: #6666ff;
stroke: #4d4dff;
}
.GATE{
fill: #003300;
stroke: #001a00;
}
.CONSTANT{
fill: #ff00ff;
stroke: #e600e6;
}

View File

@@ -0,0 +1,128 @@
var NODE_RADIUS = 7;
var GATE_RADIUS = 2;
var REPEL_FORCE = 0;
var LINK_DISTANCE = 100;
var WIDTH = 500;
var HEIGHT = 600;
var d3cola = cola.d3adaptor()
.avoidOverlaps(true)
.size([WIDTH, HEIGHT]);
var drawGraph = function(graph, panel) {
var svg = d3.select(panel);
d3.selectAll(panel + "> *").remove();
// define arrow markers for graph links
svg.append('svg:defs').append('svg:marker')
.attr('id', 'end-arrow')
.attr('viewBox', '0 -5 10 10')
.attr('refX', 6)
.attr('markerWidth', 4)
.attr('markerHeight', 4)
.attr('orient', 'auto')
.append('svg:path')
.attr('d', 'M0,-5L10,0L0,5')
graph.nodes.forEach(function(v){
v.height = v.width = 2 * (v.name == 'GATE' ? GATE_RADIUS : NODE_RADIUS); }
);
d3cola
.nodes(graph.nodes)
.links(graph.links)
.constraints(graph.constraints)
.symmetricDiffLinkLengths(REPEL_FORCE)
.linkDistance(LINK_DISTANCE)
.start(10, 15, 20);
var path = svg.selectAll(".link")
.data(graph.links)
.enter().append('svg:path')
.attr('class', 'link')
path.append("title")
.text(function (d) {
var text = "";
text += "Weight: " + Math.round(d.weight*1000)/1000 + "\n";;
text += "Source: " + d.source.id + "\n";;
text += "Target: " + d.target.id;
return text;
});
var node = svg.selectAll(".node")
.data(graph.nodes)
.enter().append("circle")
.attr("class", function(d){
return "node " + d.name;
})
.attr("r", function(d) { return d.name == 'GATE' ? GATE_RADIUS : NODE_RADIUS; })
.call(d3cola.drag);
node.append("title")
.text(function (d){
var text = "";
text += "Activation: " + Math.round(d.activation*1000)/1000 + "\n";
text += "Bias: " + Math.round(d.bias*1000)/1000 + "\n";
text += "Position: " + d.id;
return text;
});
var label = svg.selectAll(".label")
.data(graph.nodes)
.enter().append("text")
.attr("class", "label")
.text(function (d){return '(' + d.index + ') ' + d.name; })
.call(d3cola.drag)
d3cola.on("tick", function () {
// draw directed edges with proper padding from node centers
path.attr('d', function (d) {
var deltaX = d.target.x - d.source.x,
deltaY = d.target.y - d.source.y,
dist = Math.sqrt(deltaX * deltaX + deltaY * deltaY),
normX = deltaX / dist,
normY = deltaY / dist;
if(isNaN(normX)) normX = 0;
if(isNaN(normY)) normY = 0;
sourcePadding = d.source.width / 2,
targetPadding = d.target.width / 2 + 2,
sourceX = d.source.x + (sourcePadding * normX),
sourceY = d.source.y + (sourcePadding * normY),
targetX = d.target.x - (targetPadding * normX),
targetY = d.target.y - (targetPadding * normY);
// Defaults for normal edge.
drx = 0,
dry = 0,
xRotation = 0, // degrees
largeArc = 0, // 1 or 0
sweep = 1; // 1 or 0
// Self edge.
if (d.source.x === d.target.x && d.source.y === d.target.y) {
drx = dist;
dry = dist;
xRotation = -45;
largeArc = 1;
drx = 20;
dry = 20;
targetX = targetX + 1;
targetY = targetY + 1;
}
return 'M' + sourceX + ',' + sourceY + "A" + drx + "," + dry + " " + xRotation + "," + largeArc + "," + sweep + " " + targetX + ',' + targetY;
});
node.attr("cx", function (d) { return d.x; })
.attr("cy", function (d) { return d.y; })
label
.attr("x", function (d) { return d.x + 10; })
.attr("y", function (d) { return d.y - 10; });
});
};

View File

@@ -0,0 +1,38 @@
var scripts = [
{ type: 'script', url: "https://wagenaartje.github.io/neataptic/cdn/1.3.4/neataptic.js"},
{ type: 'script', url: "https://cdnjs.cloudflare.com/ajax/libs/d3/3.0.0/d3.js"},
{ type: 'script', url: "../../js/articles/neuroevolution/webcola.js"},
{ type: 'script', url: "../../js/articles/playground/events.js"},
{ type: 'script', url: "../../js/articles/playground/graph.js"},
{ type: 'script', url: "../../js/articles/playground/neural.js"},
{ type: 'css', url: "../../js/articles/playground/extra.css"}
];
/** https://stackoverflow.com/questions/33330636/load-javascript-dynamically-and-sequentially **/
function require(list) {
function loadScript(link) {
return new Promise(function(fulfill, reject) {
if(link.type == 'script'){
var script = document.createElement("script");
script.addEventListener("load", fulfill);
script.src = link.url;
document.head.appendChild(script);
} else if(link.type == 'css'){
var stylesheet = document.createElement('link');
stylesheet.addEventListener("load", fulfill);
stylesheet.rel = 'stylesheet';
stylesheet.type = 'text/css';
stylesheet.href = link.url;
stylesheet.media = "screen,print";
document.head.appendChild(stylesheet);
}
});
}
loadScript(list.shift()).then(function() {
if (list.length > 0) {
require(list);
}
})
}
require(scripts);

View File

@@ -0,0 +1,28 @@
var { Network, methods, architect } = neataptic;
var network = new Network(2, 1);
$(document).ready(function () {
refresh();
activate();
});
function mutate (method) {
network.mutate(method);
refresh();
activate();
}
function activate () {
var in1 = $('.input1').val();
var in2 = $('.input2').val();
if(in1 > 1 || in1 < 0 || in2 > 1 || in2 < 0){
alert('Inputs must be between 0 and 1!');
}
var output = network.activate([in1, in2]);
$('.output').text(output);
}
function refresh(){
drawGraph(network.graph($('.draw').width() / 1.4, $('.draw').height() / 1.4), '.draw');
}