• 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. zingchart.loadModules('maps, maps-usa_ak', function(e) {
    17. zingchart.render({
    18. id: 'myChart',
    19. data: {
    20. shapes: [{
    21. type: 'zingchart.maps',
    22. options: {
    23. name: 'usa_ak',
    24. zooming: false,
    25. panning: false,
    26. scrolling: false,
    27. style: {
    28. controls: {
    29. placement: 'tr',
    30. zoomOut: {
    31. color: 'red',
    32. tooltip: {
    33. color: 'red'
    34. }
    35. },
    36. zoomIn: {
    37. color: 'green',
    38. tooltip: {
    39. color: 'green'
    40. }
    41. }
    42. }
    43. }
    44. }
    45. }]
    46. },
    47. height: 400,
    48. width: '100%'
    49. });
    50. });
    51. </script>
    52. </body>
    53.  
    54. </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. zingchart.loadModules('maps, maps-usa_ak', function(e) {
    2. zingchart.render({
    3. id: 'myChart',
    4. data: {
    5. shapes: [{
    6. type: 'zingchart.maps',
    7. options: {
    8. name: 'usa_ak',
    9. zooming: false,
    10. panning: false,
    11. scrolling: false,
    12. style: {
    13. controls: {
    14. placement: 'tr',
    15. zoomOut: {
    16. color: 'red',
    17. tooltip: {
    18. color: 'red'
    19. }
    20. },
    21. zoomIn: {
    22. color: 'green',
    23. tooltip: {
    24. color: 'green'
    25. }
    26. }
    27. }
    28. }
    29. }
    30. }]
    31. },
    32. height: 400,
    33. width: '100%'
    34. });
    35. });