var dataCS = [ [30, 13, 3, 10, 8, 72, 'Hannah Abbott '], [19, 14, 3, 6, 8, 60, 'Katie Bell '], [7, 14, 3, 9, 10, 51, 'Phineas Nigellus Black'], [31, 7, 6, 9, 6, 70, 'Susan Bones'], [35, 12, 4, 8, 10, 77, 'Vincent Crabbe'], [27, 13, 6, 9, 4, 69, 'Marcus Flint'], [26, 23, 4, 8, 8, 83, 'Filius Flitwick'], [11, 14, 3, 6, 7, 47, 'Rubeus Hagrid'], [32, 15, 6, 9, 9, 79, 'Graham Montague'], [24, 13, 3, 7, 8, 71, 'Theodore Nott'], [17, 14, 3, 7, 7, 58,'Garrick Ollivander'], [9, 8, 1, 4, 5, 31, 'Antioch Peverell'], [23, 15, 7, 10, 10, 71, 'Sturgis Podmore'], [10, 10, 2, 3, 4, 38, 'Poppy Pomfrey'], [13, 18, 1, 5, 8, 49, 'Quirinus Quirrell'], [16, 16, 5, 8, 6, 62, 'Tom Marvolo Riddle'], [15, 12, 3, 7, 8, 56, 'Albert Runcorn'], [19, 12, 4, 5, 7, 58, 'Kingsley Shacklebolt'], [28, 17, 9, 10, 2, 79, 'Aurora Sinistra'], [18, 13, 1, 10, 8, 61, 'Rita Skeeter'], [12, 15, 3, 8, 7, 54, 'Severus Snape'], [15, 15, 2, 8, 9, 58, 'Pomona Sprout'], [11, 15, 2, 3, 7, 46, 'Emmeline Vance'], [15, 5, 3, 3, 3, 39,'Newt Scamander'], [5, 13, 2, 3, 5, 33, 'Amelia Bones'], [17, 21, 2, 7, 10, 62, 'Thorfinn Rowle'], [21, 21, 2, 8, 9, 69, 'Rufus Scrimgeour'], [10, 13, 2, 7, 8, 50, 'Irma Pince'] ]; var dataHCI = [ [4, 26, 2, 3, 9, 51, 'Ludo Bagman'], [26, 15, 7, 9, 5, 76, 'Frank Bryce'], [16, 24, 3, 10, 8, 71, 'Alecto Carrow'], [25, 26, 7, 9, 9, 90, 'Gellert Grindelwald'], [16, 23, 5, 5, 7, 68, 'Rolanda Hooch'], [9, 18, 2, 4, 6, 48, 'Helga Hufflepuff'], [5, 20, 3, 6, 7, 47, 'Viktor Krum'], [17, 22, 3, 6, 7, 62, 'Bellatrix Lestrange'], [24, 16, 5, 8, 9, 68, 'Neville Longbottom'], [21, 17, 7, 8, 4, 62, 'Remus Lupin'], [6, 29, 2, 9, 10, 59, 'Lily Potter'], [10, 21, 5, 8, 9, 61, 'Helena Ravenclaw'], [14, 28, 2, 8, 8, 70, 'Salazar Slytherin'], [11, 15, 2, 6, 6, 47, 'Ron Weasley'], [10, 20, 5, 7, 9, 54, 'Colin Creevey'], [12, 20, 7, 9, 6, 62, 'Peter Pettigrew'], [12, 20, 3, 10, 9, 62, 'Draco Malfoy'], [9, 26, 3, 8, 8, 62, 'Penelope Clearwater'], [19, 14, 4, 7, 8, 58, 'Michael Corner'], [4, 19, 3, 4, 4, 40, 'Amos Diggory '], [28, 18, 6, 8, 7, 76, 'Igor Karkaroff '], [23, 21, 7, 8, 10, 80, 'Silvanus Kettleburn '], [25, 16, 7, 9, 9, 74, 'Sirius Black'] ]; var dataMT = [ [16, 21, 2, 8, 9, 60, 'Cuthbert Binns'], [25, 18, 4, 8, 8, 71, 'Terry Boot'], [22, 19, 5, 8, 7, 71, 'Lavender Brown'], [14, 20, 1, 4, 9, 58, 'Millicent Bulstrode'], [14, 21, 2, 8, 8, 59, 'Amycus Carrow'], [17, 20, 4, 8, 9, 67, 'Reginald Cattermole'], [27, 23, 5, 9, 9, 79, 'Mary Cattermole '], [18, 15, 3, 8, 8, 59, 'Cho Chang '], [16, 22, 3, 9, 8, 69, 'Fleur Delacour '], [8, 20, 2, 8, 10, 56, 'Seamus Finnigan'], [20, 11, 1, 7, 8, 60, 'Cornelius Fudge'], [11, 23, 2, 6, 10, 60, 'Godric Gryffindor'], [14, 18, 3, 7, 8, 59, 'Hermione Granger'], [26, 19, 6, 9, 8, 78, 'Xenophilius Lovegood'], [16, 13, 4, 7, 6, 56, 'Ernie Macmillan'], [10, 18, 2, 6, 8, 50, 'Minerva McGonagall'], [13, 24, 3, 8, 10, 66, 'Cormac McLaggen'], [16, 19, 1, 7, 10, 61, 'Harry Potter'], [10, 21, 1, 8, 5, 53, 'James Potter '], [6, 20, 1, 4, 7, 43, 'Rowena Ravenclaw'], [22, 24, 3, 9, 8, 77, 'Demelza Robins'], [21, 23, 2, 7, 8, 69, ' Augustus Rookwood'], [5, 22, 1, 5, 10, 50, 'Stanley Shunpike'], [13, 18, 2, 7, 6, 52, 'Horace Slughorn'], [23, 21, 3, 9, 9, 73, 'Hepzibah Smith'], [15, 12, 3, 6, 5, 47, 'Nymphadora Tonks'], [6, 13, 2, 3, 8, 40, 'Oliver Wood'] ]; var dataOther = [ [11, 21, 2, 5, 8, 56, 'Bathilda Bagshot'], [16, 16, 5, 7, 6, 63, 'Dean Thomas'], [7, 16, 2, 9, 9, 54, 'Pansy Parkinson'], [6, 22, 3, 3, 9, 49, 'Charity Burbage'], [10, 12, 2, 5, 5, 38, 'Charity Burbage'] ]; var schema = [ {name: 'coder', index: 0, text: 'Coder'}, {name: 'designer', index: 1, text: 'Desginer'}, {name: 'visualization', index: 2, text: 'Visualization'}, {name: 'computer usage', index: 3, text: 'Computer usage'}, {name: 'collaboration', index: 4, text: 'Collaboration'}, {name: 'overallratings', index: 5, text: 'Overallratings'}, {name: 'name', index: 6, text: 'Name'} ]; var itemStyle = { normal: { opacity: 0.8, shadowBlur: 10, shadowOffsetX: 0, shadowOffsetY: 0, shadowColor: 'rgba(0, 0, 0, 0.5)' } }; option = { backgroundColor: '#404a59', title : { text: 'A Coder or a Designer?', x:'center', textStyle: { color: '#fff' } }, color: ['#dd4444', '#426ab3', '#fec42c', '#80F1BE'], //不同图例的颜色 legend: { y: 'top', data: ['Computer Science','Human Computer Interaction','Media Technology', 'Other related majors'], textStyle: { color: '#fff', fontSize: 16 } }, grid: { x: '10%', x2: 150, y: '18%', y2: '10%' }, tooltip: { backgroundColor: '#100', borderColor: '#777', borderWidth: 1, formatter: function (obj) { var value = obj.value; return '<div style="border-bottom: 1px solid rgba(255,255,255,.3); font-size: 18px;padding-bottom: 7px;margin-bottom: 7px">' + obj.seriesName + ':' + '</div>' + schema[0].text + ':' + value[0] + '<br>' + schema[1].text + ':' + value[1] + '<br>' + schema[2].text + ':' + value[2] + '<br>' + schema[3].text + ':' + value[3] + '<br>' + schema[4].text + ':' + value[4] + '<br>' + schema[5].text + ':' + value[5] + '<br>' + schema[6].text + ':' + value[6] + '<br>'; } }, xAxis: { type: 'value', name: 'Coder-programming skills', nameGap: 12, nameTextStyle: { color: '#fff', fontSize: 11 }, max: 31, splitLine: { show: false }, axisLine: { lineStyle: { color: '#eee' } } }, yAxis: { type: 'value', name: 'Designer-art,talk,evaluation', nameLocation: 'end', nameGap: 10, nameTextStyle: { color: '#fff', fontSize: 12 }, axisLine: { lineStyle: { color: '#eee' } }, splitLine: { show: false } }, series: [ { name: 'CS', type: 'scatter', itemStyle: itemStyle, data: dataCS }, { name: 'HCI', type: 'scatter', itemStyle: itemStyle, data: dataHCI }, { name: 'MT', type: 'scatter', itemStyle: itemStyle, data: dataMT }, { name: 'Other', type: 'scatter', itemStyle: itemStyle, data: dataOther } ] };