133 " width " : 4338
这是自界说图片的示例图
先给最简单的非自界说图代码
1 <html> 2 <head> 3 <meta charset="utf-8"> 4 <!-- <script src=http://www.mamicode.com/‘https:/cdn.bootcss.com/echarts/3.7.0/echarts.simple.js‘></script> --> 5 6 <script src=‘../../echarts/echarts.min.js‘></script> 7 8 <script src=‘../dist/echarts-wordcloud.js‘></script> 9 </head> 10 <body> 11 <style> 12 html, body, #main { 13 width: 100%; 14 height: 100%; 15 margin: 0; 16 } 17 </style> 18 <div id=‘main‘></div> 19 <script> 20 var chart = echarts.init(document.getElementById(‘main‘)); 21 22 var option = { 23 tooltip: {}, 24 series: [ { 25 type: ‘wordCloud‘, 26 gridSize: 2, 27 sizeRange: [12, 50], 28 rotationRange: [-90, 90], 29 shape: ‘pentagon‘, 30 width: 600, 31 height: 400, 32 drawOutOfBound: true, 33 textStyle: { 34 normal: { 35 color: function () { 36 return ‘rgb(‘ + [ 37 Math.round(Math.random() * 160), 38 Math.round(Math.random() * 160), 39 Math.round(Math.random() * 160) 40 ].join(‘,‘) + ‘)‘; 41 } 42 }, 43 emphasis: { 44 shadowBlur: 10, 45 shadowColor: ‘#333‘ 46 } 47 }, 48 data: [ 49 { 50 name: ‘Sam S Club‘, 51 value: 10000, 52 textStyle: { 53 normal: { 54 color: ‘black‘ 55 }, 56 emphasis: { 57 color: ‘red‘ 58 } 59 } 60 }, 61 { 62 name: ‘Macys‘, 63 value: 6181 64 }, 65 { 66 name: ‘Amy Schumer‘, 67 value: 4386 68 }, 69 { 70 name: ‘Jurassic World‘, 71 value: 4055 72 }, 73 { 74 name: ‘Charter Communications‘, 75 value: 2467 76 }, 77 { 78 name: ‘Chick Fil A‘, 79 value: 2244 80 }, 81 { 82 name: ‘Planet Fitness‘, 83 value: 1898 84 }, 85 { 86 name: ‘Pitch Perfect‘, 87 value: 1484 88 }, 89 { 90 name: ‘Express‘, 91 value: 1112 92 }, 93 { 94 name: ‘Home‘, 95 value: 965 96 }, 97 { 98 name: ‘Johnny Depp‘, 99 value: 847 100 }, 101 { 102 name: ‘Lena Dunham‘, 103 value: 582 104 }, 105 { 106 name: ‘Lewis Hamilton‘, 107 value: 555 108 }, 109 { 110 name: ‘KXAN‘, 111 value: 550 112 }, 113 { 114 name: ‘Mary Ellen Mark‘, 115 value: 462 116 }, 117 { 118 name: ‘Farrah Abraham‘, 119 value: 366 120 }, 121 { 122 name: ‘Rita Ora‘, 123 value: 360 124 }, 125 { 126 name: ‘Serena Williams‘, 127 value: 282 128 }, 129 { 130 name: ‘NCAA baseball tournament‘, 131 value: 273 132 }, 133 { 134 name: ‘Point Break‘, 135 value: 265 136 } 137 ] 138 } ] 139 }; 140 141 chart.setOption(option); 142 143 window.onresize = chart.resize; 144 </script> 145 </body> 146 </html>
官方非自界说图片下面这个是自界说图片教程
1，数据填写
温馨提示: 本文由Jm博客推荐，转载请保留链接: https://www.jmwww.net/file/web/30408.html
![[转]Node.js中package.json中^和~的区别](/uploads/allimg/200519/054J34453_lit.png "[转]Node.js中package.json中^和~的区别")