• Edit
  • Download
    1. <!DOCTYPE html>
    2. <html>
    3.  
    4. <head>
    5. <meta charset="utf-8">
    6. <title>ZingSoft Demo</title>
    7.  
    8. <script nonce="undefined" src="https://cdn.zingchart.com/zingchart.min.js"></script>
    9. <style></style>
    10. </head>
    11.  
    12. <body>
    13. <div id='myChart'></div>
    14. <script>
    15. ZC.LICENSE = ["569d52cefae586f634c54f86dc99e6a9", "b55b025e438fa8a98e32482b5f768ff5"];
    16. let chartConfig = {
    17. type: 'radar',
    18. plot: {
    19. aspect: 'area',
    20. lineWidth: 1
    21. },
    22. scaleV: {
    23. values: '0:100:10',
    24. format: '%v%',
    25. item: {
    26. fontColor: '#607D8B',
    27. backgroundColor: 'white',
    28. borderColor: '#aeaeae',
    29. borderWidth: 1,
    30. padding: 3,
    31. borderRadius: 10,
    32. offsetX: 5
    33. },
    34. refLine: {
    35. lineColor: '#607D8B'
    36. },
    37. tick: {
    38. lineColor: '#607D8B',
    39. length: 5,
    40. size: 5
    41. },
    42. guide: {
    43. lineColor: '#CFD8DC',
    44. lineStyle: 'solid',
    45. }
    46. },
    47. scaleK: {
    48. visible: false
    49. },
    50. series: [{
    51. values: [59, 30, 65, 34, 40],
    52. backgroundColor: '#689F38',
    53. lineColor: '#33691E'
    54. },
    55. {
    56. values: [76, 60, 11, 21, 99],
    57. backgroundColor: '#0288D1',
    58. lineColor: '#01579B'
    59. }
    60. ],
    61. };
    62.  
    63.  
    64. zingchart.render({
    65. id: 'myChart',
    66. data: chartConfig,
    67. height: 400,
    68. width: '100%'
    69. });
    70. </script>
    71. </body>
    72.  
    73. </html>
    1. <!DOCTYPE html>
    2. <html>
    3.  
    4. <head>
    5. <meta charset="utf-8">
    6. <title>ZingSoft Demo</title>
    7.  
    8. <script src="https://cdn.zingchart.com/zingchart.min.js"></script>
    9. </head>
    10.  
    11. <body>
    12. <div id='myChart'></div>
    13. </body>
    14.  
    15. </html>
    1.  
    1. let chartConfig = {
    2. type: 'radar',
    3. plot: {
    4. aspect: 'area',
    5. lineWidth: 1
    6. },
    7. scaleV: {
    8. values: '0:100:10',
    9. format: '%v%',
    10. item: {
    11. fontColor: '#607D8B',
    12. backgroundColor: 'white',
    13. borderColor: '#aeaeae',
    14. borderWidth: 1,
    15. padding: 3,
    16. borderRadius: 10,
    17. offsetX: 5
    18. },
    19. refLine: {
    20. lineColor: '#607D8B'
    21. },
    22. tick: {
    23. lineColor: '#607D8B',
    24. length: 5,
    25. size: 5
    26. },
    27. guide: {
    28. lineColor: '#CFD8DC',
    29. lineStyle: 'solid',
    30. }
    31. },
    32. scaleK: {
    33. visible: false
    34. },
    35. series: [{
    36. values: [59, 30, 65, 34, 40],
    37. backgroundColor: '#689F38',
    38. lineColor: '#33691E'
    39. },
    40. {
    41. values: [76, 60, 11, 21, 99],
    42. backgroundColor: '#0288D1',
    43. lineColor: '#01579B'
    44. }
    45. ],
    46. };
    47.  
    48.  
    49. zingchart.render({
    50. id: 'myChart',
    51. data: chartConfig,
    52. height: 400,
    53. width: '100%'
    54. });