Ichart.js kode implementasi untuk menggambar garis putus -putus dan efek garis putus -putus rata -rata
var data = array baru (); Data [0] = {Label: ["Unit 1", "Unit 2", "Unit 3", "Unit 4", "Unit 5"], Dataset: [{Name: 'Excellence Rate', Color: '#1dbcfe', Line_width: 4, nilai: [80,75,92,62,0]}}}}}} {"80,75," 3 "," Unit 4 "," Unit 5 "], Dataset: [{Name: 'Excellence Rate', Color: '#1DBCFE', Line_width: 4, Nilai: [50,11,62,77,90]}} {2]," "Unit 1", "Unit 1", "Unit 1", "Unit 1", "Unit 1", "Unit 1" 'Tingkat Keunggulan', Warna: '#1dbcfe', line_width: 4, nilai: [80,51,32,44,80]}]} var _bodywidth = $ ('body'). Width ()-16; $('.item').each(function(i){ var _id=$(this).find('.canvas-wrap').attr('id'); var chart = new iChart.LineBasic2D({ render : _id, data: Data[i].datasets, align:'center', border:0, width : _bodyWidth*2, height : _bodyWidth*1.2, latar belakang_color:#fafafa ', animasi: true, // buka animasi transisi animasi_duration: 600, // 600ms selesai animasi sub_option: {smooth: true, hollow: false, hollow_inside: false, point_size: 16, pendengar: {parsetex Label: {fontsize: 24, color: '#333'},}, koordinat: {lebar: _bodywidth*1.6, valid_width: _bodywidth*1.4, tinggi: _bodywidth*1.6*.5, striped_factor: 0.18, axis: {a color: aa: aa: 0. 0, a. Skala: [{Posisi: 'kiri', start_scale: 0, end_scale: 100, scale_space: 20, scale_size: 2, scale_enable: false, label: {color: '#999', fontsize: 24}, scale_color: '#999'}, {position: '24}, scale_color:'#999 '}, {posisi:' Bawah ', {label: {label: {label: {label: {label: {label: {label: {label: {label: {label: {label', label: {label: false, data [i] .label}]}}); $ .Each (data [i] .DataSets [0] .value, function (i, val) {_total+= val;})); coo.getScale ('kiri'), h = coo.height, h = (rata -rata - s.start) * h / s.distance, y = chart.y+h - h; chart.target.textAlign ('start') .textBaseline ('middle') .textFont ('500 20px verdana') .filltext ('Rata-Rata Win Rate'+AVG+'%', X+W-100, false, '#Fe941c;Kode di atas adalah contoh JS untuk menggambar beberapa bagan garis dan metode menggambar garis putus -putus rata -rata dalam setiap bagan baris.
Ichart.js adalah ikon yang sangat bagus menggambar JS. Kerugiannya adalah bahwa di sisi seluler, Anda perlu mengatur dua kali ukuran terlebih dahulu, dan kemudian mempersempitnya secara manual ke kisaran normal dengan CSS dan JS untuk membuatnya definisi tinggi di layar.
Ada contoh menggambar garis rata -rata di situs web resmi, tetapi tidak ada garis putus -putus. Secara umum, agar tidak bingung, garis rata -rata ditarik menggunakan garis putus -putus. Di sini saya hanya berputar untuk menggambar garis lurus N-end, yang merupakan solusi. Jika ada cara yang lebih baik, silakan tinggalkan pesan. Terima kasih.
Kode di atas untuk menggambar garis putus -putus dan garis putus -putus yang dibagi sama di ichart.js adalah semua konten yang saya bagikan dengan Anda. Saya harap Anda dapat memberi Anda referensi dan saya harap Anda dapat mendukung wulin.com lebih lanjut.