選択できるのは25トピックまでです。 トピックは、先頭が英数字で、英数字とダッシュ('-')を使用した35文字以内のものにしてください。

plot.html 2.0KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width,initial-scale=1.0">
  6. <title>dc-example</title>
  7. <script src='/libs/dc-sdk/dc.min.js'></script>
  8. <link href='/libs/dc-sdk/dc.min.css' type='text/css' rel='stylesheet'>
  9. <link href='../index.css' type='text/css' rel='stylesheet'>
  10. </head>
  11. <body>
  12. <div id="viewer-container" class="viewer-container"></div>
  13. <div class="btn-box">
  14. <ul>
  15. <li><button onclick="draw('point')">点</button></li>
  16. <li><button onclick="draw('billboard')">图标点</button></li>
  17. <li><button onclick="draw('polyline')">线</button></li>
  18. <li><button onclick="draw('polygon')">面</button></li>
  19. <li><button onclick="draw('circle')">圆</button></li>
  20. <li><button onclick="draw('rectangle')">矩形</button></li>
  21. <li><button onclick="draw('attack_arrow')">进攻箭头</button></li>
  22. <li><button onclick="draw('double_arrow')">双箭头</button></li>
  23. <li><button onclick="draw('fine_arrow')">直箭头</button></li>
  24. <li><button onclick="draw('tailed_attack_arrow')">燕尾箭头</button></li>
  25. <li><button onclick="draw('gathering_place')">聚集地</button></li>
  26. <li><button onclick="removeAll()">清除</button></li>
  27. </ul>
  28. </div>
  29. <script>
  30. let viewer = undefined
  31. let plot = undefined
  32. let layer = undefined
  33. function initViewer() {
  34. viewer = new DC.Viewer('viewer-container')
  35. let baseLayer = DC.ImageryLayerFactory.createImageryLayer(DC.ImageryType.AMAP,{
  36. style:'img',
  37. crs:'WGS84'
  38. })
  39. viewer.addBaseLayer( baseLayer)
  40. layer = new DC.VectorLayer('layer')
  41. viewer.addLayer(layer)
  42. plot= new DC.Plot(viewer)
  43. }
  44. function draw(type){
  45. plot && plot.draw(type,overlay => {
  46. if(overlay){
  47. layer.addOverlay(overlay)
  48. plot.edit(overlay)
  49. }
  50. })
  51. }
  52. function removeAll(){
  53. layer.clear()
  54. }
  55. DC.ready({
  56. baseUrl:'../libs/dc-sdk/resources/'
  57. }).then(initViewer)
  58. </script>
  59. </body>
  60. </html>