I am a Professor of Mathematics at the University of Connecticut.
doit = async function(plusPoints, minusPoints) {
var alphaPlus = d3.range(plusPoints.length).map(d=>1/plusPoints.length)
var alphaMinus = d3.range(minusPoints.length).map(d=>1/minusPoints.length) ;
var current_w = w(plusPoints, minusPoints, alphaPlus, alphaMinus) ;
var current_w_plus = w(plusPoints,[[0,0]],alphaPlus,[0])
var current_w_minus = w(minusPoints,[[0,0]],alphaMinus,[0])
var distance = Math.sqrt(l2([current_w_plus[0]-current_w_minus[0],current_w_plus[1]-current_w_minus[1]])) ;
solution.selectAll('circle').data([current_w_plus, current_w_minus]).join('circle')
.attr('cx',d=>d[0])
.attr('cy',d=>d[1])
.attr('r',5)
.attr('fill','black').attr('opacity',1)
solution.selectAll('path').data([[current_w_plus, current_w_minus]]).join('path')
.attr('d',d=>d3.line()(d))
.attr('stroke','black').attr('opacity',1)
solution.append('text').attr('id','distance').attr('x',10).attr('y',460)
solution.append('text').attr('id','iterations').attr('x',10).attr('y',480)
solution.select('#distance')
.data([distance]).join('text')
.text(`Distance = ${distance.toFixed(2)}`)
solution.select('#iterations')
.data([0]).join('text')
.text(d=>`Iterations=${d}`)
for(let j=0;j<1000;j++) {
for (let s = 0;s<plusPoints.length;s++) {
for (let t = 0; t< minusPoints.length; t++) {
const ap = answer(plusPoints, minusPoints, alphaPlus, alphaMinus, s,t) ;
alphaPlus[s] = ap[0]
alphaMinus[t] = ap[1]
}
}
var nmalphaPlus = alphaPlus.map(x=>x/d3.sum(alphaPlus)) ;
var nmalphaMinus = alphaMinus.map(x=>x/d3.sum(alphaMinus));
var new_w = w(plusPoints, minusPoints, nmalphaPlus, nmalphaMinus)
var delta = l2([new_w[0]-current_w[0],new_w[1]-current_w[1]]) ;
current_w = new_w ;
var new_wp = w(plusPoints, [[0,0]],nmalphaPlus,[0]) ;
var new_wm = w(minusPoints,[[0,0]], nmalphaMinus, [0]) ;
var newdistance = Math.sqrt(l2([new_wp[0]-new_wm[0],new_wp[1]-new_wm[1]])) ;
if (Math.abs(distance-newdistance)<.001) {
break ;
}
distance = newdistance
var t0 = d3.transition().duration(700) ;
solution.select('#distance')
.transition(t0)
.text(`Distance = ${distance.toFixed(2)}`)
solution.select('#iterations').transition(t0)
.text(`Iterations = ${j}`)
solution.selectAll('circle')
.data([new_wp,new_wm])
.transition(t0)
.attr('cx',d=>d[0])
.attr('cy',d=>d[1])
solution.selectAll('path')
.data([[new_wp, new_wm]])
.transition(t0)
.attr('d',d=>d3.line()(d))
await t0.end() ;
}
//var t1 = t0.transition().delay(500)
// await solution.selectAll('*').transition(t1).attr('opacity',0).end() ;
}
svg = d3.create('svg').attr('width',800).attr('height',500)
solution = svg.append('g').attr('id','solution')
plusPoints = randomPts(150,50,200,50,30) ;
minusPoints = randomPts(650,50,300,50,30) ;
polygons = function(plusPoints, minusPoints) {
svg.append('g').attr('id','plusPoints') ;
svg.append('g').attr('id','minusPoints') ;
const plusGroup = d3.select('#plusPoints') ;
const minusGroup = d3.select('#minusPoints') ;
plusGroup.selectAll('circle')
.data(plusPoints)
.join('circle')
.attr('cx',d=>d[0])
.attr('cy',d=>d[1])
.attr('r', 3)
.attr('fill','blue')
minusGroup.selectAll('circle')
.data(minusPoints)
.join('circle')
.attr('cx',d=>d[0])
.attr('cy',d=>d[1])
.attr('r', 3)
.attr('fill','green')
const plusHull = d3.polygonHull(plusPoints)
const minusHull = d3.polygonHull(minusPoints)
const plusPath = d3.select('#plusPoints')
.selectAll('path')
.data([d3.line()(plusHull)])
.join('path')
.attr('d',d=>d+`Z`)
.attr('stroke','black')
.attr('fill','blue')
.attr('fill-opacity',.1)
const minusPath = d3.select('#minusPoints')
.selectAll('path')
.data([d3.line()(minusHull)])
.join('path')
.attr('d',d=>d+`Z`)
.attr('stroke','black')
.attr('fill','green')
.attr('fill-opacity',.1)
}
import {button} from "@jashkenas/inputs"
d3 = require('d3@^5.8')
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
