• 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.  
    17. var myConfig = {
    18. gui: {
    19. contextMenu: {
    20. visible: false
    21. }
    22. },
    23. graphset: [{
    24. type: "bar",
    25. title: {
    26. text: "showmenu API"
    27. },
    28. series: [{
    29. values: [35, 42, 67, 89, 25, 34, 67, 85]
    30. }],
    31. shapes: [{
    32. type: 'square',
    33. size: 40,
    34. backgroundColor: "red",
    35. x: 100,
    36. cursor: "pointer",
    37. label: {
    38. text: 'Display CM',
    39. y: 20
    40. }
    41. }]
    42. }]
    43.  
    44. };
    45.  
    46. zingchart.bind('myChart', 'shape_click', function() {
    47. zingchart.exec('myChart', 'showmenu', {
    48. x: 100,
    49. y: 100
    50. });
    51. })
    52.  
    53. zingchart.render({
    54. id: 'myChart',
    55. data: myConfig,
    56. height: 400,
    57. width: 600,
    58. output: 'canvas'
    59. });
    60. </script>
    61. </body>
    62.  
    63. </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. var myConfig = {
    2. gui: {
    3. contextMenu: {
    4. visible: false
    5. }
    6. },
    7. graphset: [{
    8. type: "bar",
    9. title: {
    10. text: "showmenu API"
    11. },
    12. series: [{
    13. values: [35, 42, 67, 89, 25, 34, 67, 85]
    14. }],
    15. shapes: [{
    16. type: 'square',
    17. size: 40,
    18. backgroundColor: "red",
    19. x: 100,
    20. cursor: "pointer",
    21. label: {
    22. text: 'Display CM',
    23. y: 20
    24. }
    25. }]
    26. }]
    27.  
    28. };
    29.  
    30. zingchart.bind('myChart', 'shape_click', function() {
    31. zingchart.exec('myChart', 'showmenu', {
    32. x: 100,
    33. y: 100
    34. });
    35. })
    36.  
    37. zingchart.render({
    38. id: 'myChart',
    39. data: myConfig,
    40. height: 400,
    41. width: 600,
    42. output: 'canvas'
    43. });