echarts实现文字标签云效果代码

代码语言:html

所属分类:其他

代码描述:echarts实现文字标签云效果代码

代码标签: echarts 文字 标签

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开


<!DOCTYPE html>
<html lang="en" >

<head>

  <meta charset="UTF-8">
  

  
  
<style>
body {
	background-color: #fff;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px; 
	color: #000;
}

a:link, a:visited {
	color: #4682b4;
}

a:hover {
	color: #4169e1;
}

#main	{
	width: 650px;
	height: 350px;
	border: 1px solid #ccc;
	padding: 5px;
}
</style>



</head>

<body  >
  <div id="main"></div>


<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/echarts-all.js"></script>
      <script  >
var myChart = echarts.init(document.getElementById('main'));

function createRandomItemStyle() {
  return {
    normal: {
      color: 'rgb(' + [
      Math.round(Math.random() * 160),
      Math.round(Math.random() * 160),
      Math.round(Math.random() * 160)].
      join(',') + ')' } };


}

myChart.setOption({
  title: {
    text: 'My Heart is Broken by Evanescence',
    link: 'http://www.bfw.wiki' },

  tooltip: {
    show: true },

  series: [{
    name: 'My Heart is Broken Lyrics',
    type: 'wordCloud',
    size: ['98%', '98%'],
    textRotation: [0, 45, 90, -45],
    textPadding: 0,
    autoSize: {
      enable: true,
      minSize: 14 },

    data: [
    {
      name: "sweet sleep",
      value: 978539,
      itemStyle: {
        normal: {
          color: 'black' } } },



    {
      name: "dark angel",
      value: 907241,
      itemSt.........完整代码请登录后点击上方下载按钮下载查看

网友评论0