js 里面添加html,JS添加HTML元素

请假统计

#main{

position: absolute;

width: 600px;

height: 400px;

left: 50%;

top: 50%;

margin-left: -300px;

margin-top: -200px;/*

border: 1px solid #00F;*/

}

var url="https://cdn.staticfile.org/echarts/4.2.1-rc1/echarts-en.min.js";

var btn=document.createElement("script");//createElement() 方法通过指定名称创建一个元素

btn.src=url;

document.body.appendChild(btn);//需要appendChild();appendChild() 方法可向节点的子节点列表的末尾添加新的子节点。

function myFunction(){

var myChart = echarts.init(document.getElementById('main'));

// 基于准备好的dom，初始化echarts实例

/*

var myChart = echarts.init(document.getElementById('main'));

// 指定图表的配置项和数据

var option = {

title: {

text: '请假统计'

},

tooltip: {},

legend: {

data:['天数']

},

xAxis: {

data: ["小王","小红","小黑","小赵","小周","小白"]

},

yAxis: {},

series: [{

name: '天数',

type: 'bar',

data: [5, 20, 36, 10, 10, 20]

}]

};

// 使用刚指定的配置项和数据显示图表。

myChart.setOption(option);*/

// 绘制图表。

/*

myChart.setOption(

{ title:

{ text: '请假统计' },

tooltip: {},

legend: { data:['天数'] },

xAxis: {

data: ["小王","小红","小黑","小赵","小周","小白"] },

yAxis: {},

series: [{

name: '天数',

type: 'bar',

data: [5, 20, 36, 10, 10, 20] }]

});

*/

myChart.setOption({

series : [

{

name: '请假统计',

type: 'pie',

radius: '55%',

data:[

{value:235, name:'小周'},

{value:274, name:'小王'},

{value:310, name:'小白'},

{value:335, name:'小红'},

{value:400, name:'小黑'}

],yAxis: {},

}

]

})

}

点我

标签：name,添加,myChart,value,JS,HTML,var,data,echarts

来源： https://www.cnblogs.com/zeng-qh/p/10517664.html