[{"data":1,"prerenderedAt":531},["ShallowReactive",2],{"navigation_docs":3,"-getting-started-first-map":67,"-getting-started-first-map-surround":526},[4,23,53],{"title":5,"icon":6,"path":7,"stem":8,"children":9,"page":22},"快速上手","i-lucide-rocket","\u002Fgetting-started","01.getting-started",[10,14,18],{"title":11,"path":12,"stem":13},"安装","\u002Fgetting-started\u002Finstallation","01.getting-started\u002F01.installation",{"title":15,"path":16,"stem":17},"密钥（tk）","\u002Fgetting-started\u002Fapikey","01.getting-started\u002F02.apikey",{"title":19,"path":20,"stem":21},"第一个地图","\u002Fgetting-started\u002Ffirst-map","01.getting-started\u002F03.first-map",false,{"title":24,"icon":25,"path":26,"stem":27,"children":28,"page":22},"组件","i-lucide-component","\u002Fcomponents","02.components",[29,33,37,41,45,49],{"title":30,"path":31,"stem":32},"地图","\u002Fcomponents\u002Fmap","02.components\u002F01.map",{"title":34,"path":35,"stem":36},"覆盖物","\u002Fcomponents\u002Foverlays","02.components\u002F02.overlays",{"title":38,"path":39,"stem":40},"控件","\u002Fcomponents\u002Fcontrols","02.components\u002F03.controls",{"title":42,"path":43,"stem":44},"工具","\u002Fcomponents\u002Ftools","02.components\u002F04.tools",{"title":46,"path":47,"stem":48},"图层","\u002Fcomponents\u002Flayers","02.components\u002F05.layers",{"title":50,"path":51,"stem":52},"标绘","\u002Fcomponents\u002Fplot-symbols","02.components\u002F06.plot-symbols",{"title":54,"icon":55,"path":56,"stem":57,"children":58,"page":22},"服务","i-lucide-plug","\u002Fservices","03.services",[59,63],{"title":60,"path":61,"stem":62},"REST 服务","\u002Fservices\u002Frest","03.services\u002F01.rest",{"title":64,"path":65,"stem":66},"SDK 服务","\u002Fservices\u002Fcomposables","03.services\u002F02.composables",{"id":68,"title":19,"body":69,"description":520,"extension":521,"links":522,"meta":523,"navigation":172,"path":20,"seo":524,"stem":21,"__hash__":525},"docs\u002F01.getting-started\u002F03.first-map.md",{"type":70,"value":71,"toc":515},"minimark",[72,77,89,331,335,498,501,504,511],[73,74,76],"h2",{"id":75},"vue-3","Vue 3",[78,79,80,84,85,88],"p",{},[81,82,83],"code",{},"\u003CTdtMap>"," 即地图容器，",[81,86,87],{},"tk"," 传入浏览器端密钥：",[90,91,96],"pre",{"className":92,"code":93,"language":94,"meta":95,"style":95},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup>\nimport { TdtMap, TdtMarker } from \"@tianditu\u002Fvue\";\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CTdtMap tk=\"你的浏览器端密钥\" :center=\"[116.404, 39.915]\" :zoom=\"12\" style=\"width: 100%; height: 100%\">\n    \u003CTdtMarker :lnglat=\"[116.404, 39.915]\" \u002F>\n  \u003C\u002FTdtMap>\n\u003C\u002Ftemplate>\n","vue","",[81,97,98,118,157,167,174,184,279,312,322],{"__ignoreMap":95},[99,100,103,107,111,115],"span",{"class":101,"line":102},"line",1,[99,104,106],{"class":105},"sMK4o","\u003C",[99,108,110],{"class":109},"swJcz","script",[99,112,114],{"class":113},"spNyl"," setup",[99,116,117],{"class":105},">\n",[99,119,121,125,128,132,135,138,141,144,147,151,154],{"class":101,"line":120},2,[99,122,124],{"class":123},"s7zQu","import",[99,126,127],{"class":105}," {",[99,129,131],{"class":130},"sTEyZ"," TdtMap",[99,133,134],{"class":105},",",[99,136,137],{"class":130}," TdtMarker",[99,139,140],{"class":105}," }",[99,142,143],{"class":123}," from",[99,145,146],{"class":105}," \"",[99,148,150],{"class":149},"sfazB","@tianditu\u002Fvue",[99,152,153],{"class":105},"\"",[99,155,156],{"class":105},";\n",[99,158,160,163,165],{"class":101,"line":159},3,[99,161,162],{"class":105},"\u003C\u002F",[99,164,110],{"class":109},[99,166,117],{"class":105},[99,168,170],{"class":101,"line":169},4,[99,171,173],{"emptyLinePlaceholder":172},true,"\n",[99,175,177,179,182],{"class":101,"line":176},5,[99,178,106],{"class":105},[99,180,181],{"class":109},"template",[99,183,117],{"class":105},[99,185,187,190,193,196,199,201,204,206,209,212,214,216,219,223,226,229,232,234,236,239,241,243,246,248,251,253,255,259,262,265,268,271,273,275,277],{"class":101,"line":186},6,[99,188,189],{"class":105},"  \u003C",[99,191,192],{"class":109},"TdtMap",[99,194,195],{"class":113}," tk",[99,197,198],{"class":105},"=",[99,200,153],{"class":105},[99,202,203],{"class":149},"你的浏览器端密钥",[99,205,153],{"class":105},[99,207,208],{"class":105}," :",[99,210,211],{"class":113},"center",[99,213,198],{"class":105},[99,215,153],{"class":105},[99,217,218],{"class":105},"[",[99,220,222],{"class":221},"sbssI","116.404",[99,224,225],{"class":105},", ",[99,227,228],{"class":221},"39.915",[99,230,231],{"class":105},"]",[99,233,153],{"class":105},[99,235,208],{"class":105},[99,237,238],{"class":113},"zoom",[99,240,198],{"class":105},[99,242,153],{"class":105},[99,244,245],{"class":221},"12",[99,247,153],{"class":105},[99,249,250],{"class":113}," style",[99,252,198],{"class":105},[99,254,153],{"class":105},[99,256,258],{"class":257},"sqsOY","width",[99,260,261],{"class":105},": ",[99,263,264],{"class":221},"100%",[99,266,267],{"class":105},"; ",[99,269,270],{"class":257},"height",[99,272,261],{"class":105},[99,274,264],{"class":221},[99,276,153],{"class":105},[99,278,117],{"class":105},[99,280,282,285,288,290,293,295,297,299,301,303,305,307,309],{"class":101,"line":281},7,[99,283,284],{"class":105},"    \u003C",[99,286,287],{"class":109},"TdtMarker",[99,289,208],{"class":105},[99,291,292],{"class":113},"lnglat",[99,294,198],{"class":105},[99,296,153],{"class":105},[99,298,218],{"class":105},[99,300,222],{"class":221},[99,302,225],{"class":105},[99,304,228],{"class":221},[99,306,231],{"class":105},[99,308,153],{"class":105},[99,310,311],{"class":105}," \u002F>\n",[99,313,315,318,320],{"class":101,"line":314},8,[99,316,317],{"class":105},"  \u003C\u002F",[99,319,192],{"class":109},[99,321,117],{"class":105},[99,323,325,327,329],{"class":101,"line":324},9,[99,326,162],{"class":105},[99,328,181],{"class":109},[99,330,117],{"class":105},[73,332,334],{"id":333},"web-components","Web Components",[90,336,340],{"className":337,"code":338,"language":339,"meta":95,"style":95},"language-html shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript type=\"module\">\n  import { registerComponents } from \"@tianditu\u002Fweb-components\";\n\n  registerComponents();\n\u003C\u002Fscript>\n\n\u003Ctdt-map tk=\"你的浏览器端密钥\" center=\"116.404,39.915\" zoom=\"12\" style=\"width: 100vw; height: 100vh\">\n  \u003Ctdt-marker lnglat=\"116.404,39.915\">\u003C\u002Ftdt-marker>\n\u003C\u002Ftdt-map>\n","html",[81,341,342,362,385,389,400,408,412,465,490],{"__ignoreMap":95},[99,343,344,346,348,351,353,355,358,360],{"class":101,"line":102},[99,345,106],{"class":105},[99,347,110],{"class":109},[99,349,350],{"class":113}," type",[99,352,198],{"class":105},[99,354,153],{"class":105},[99,356,357],{"class":149},"module",[99,359,153],{"class":105},[99,361,117],{"class":105},[99,363,364,367,369,372,374,376,378,381,383],{"class":101,"line":120},[99,365,366],{"class":123},"  import",[99,368,127],{"class":105},[99,370,371],{"class":130}," registerComponents",[99,373,140],{"class":105},[99,375,143],{"class":123},[99,377,146],{"class":105},[99,379,380],{"class":149},"@tianditu\u002Fweb-components",[99,382,153],{"class":105},[99,384,156],{"class":105},[99,386,387],{"class":101,"line":159},[99,388,173],{"emptyLinePlaceholder":172},[99,390,391,395,398],{"class":101,"line":169},[99,392,394],{"class":393},"s2Zo4","  registerComponents",[99,396,397],{"class":130},"()",[99,399,156],{"class":105},[99,401,402,404,406],{"class":101,"line":176},[99,403,162],{"class":105},[99,405,110],{"class":109},[99,407,117],{"class":105},[99,409,410],{"class":101,"line":186},[99,411,173],{"emptyLinePlaceholder":172},[99,413,414,416,419,421,423,425,427,429,432,434,436,439,441,444,446,448,450,452,454,456,458,461,463],{"class":101,"line":281},[99,415,106],{"class":105},[99,417,418],{"class":109},"tdt-map",[99,420,195],{"class":113},[99,422,198],{"class":105},[99,424,153],{"class":105},[99,426,203],{"class":149},[99,428,153],{"class":105},[99,430,431],{"class":113}," center",[99,433,198],{"class":105},[99,435,153],{"class":105},[99,437,438],{"class":149},"116.404,39.915",[99,440,153],{"class":105},[99,442,443],{"class":113}," zoom",[99,445,198],{"class":105},[99,447,153],{"class":105},[99,449,245],{"class":149},[99,451,153],{"class":105},[99,453,250],{"class":113},[99,455,198],{"class":105},[99,457,153],{"class":105},[99,459,460],{"class":149},"width: 100vw; height: 100vh",[99,462,153],{"class":105},[99,464,117],{"class":105},[99,466,467,469,472,475,477,479,481,483,486,488],{"class":101,"line":314},[99,468,189],{"class":105},[99,470,471],{"class":109},"tdt-marker",[99,473,474],{"class":113}," lnglat",[99,476,198],{"class":105},[99,478,153],{"class":105},[99,480,438],{"class":149},[99,482,153],{"class":105},[99,484,485],{"class":105},">\u003C\u002F",[99,487,471],{"class":109},[99,489,117],{"class":105},[99,491,492,494,496],{"class":101,"line":324},[99,493,162],{"class":105},[99,495,418],{"class":109},[99,497,117],{"class":105},[73,499,500],{"id":500},"实测",[78,502,503],{},"在下方输入浏览器端密钥即可渲染地图，密钥只保存在当前浏览器：",[505,506,507],"demo-map",{},[471,508],{":lnglat":509,"title":510},"[116.428, 39.916]","故宫",[512,513,514],"style",{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html pre.shiki code .sqsOY, html code.shiki .sqsOY{--shiki-light:#8796B0;--shiki-default:#B2CCD6;--shiki-dark:#B2CCD6}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}",{"title":95,"searchDepth":120,"depth":120,"links":516},[517,518,519],{"id":75,"depth":120,"text":76},{"id":333,"depth":120,"text":334},{"id":500,"depth":120,"text":500},"用 Vue 与 Web Components 分别渲染一张地图","md",null,{},{"title":19,"description":520},"3FF7p5YiTb0To3SuOBeRNpZH1zNNRPLCbHbF-BYDTDM",[527,529],{"title":15,"path":16,"stem":17,"description":528,"children":-1},"浏览器端密钥（tk）的申请与在本站的使用",{"title":30,"path":31,"stem":32,"description":530,"children":-1},"TdtMap 地图容器：props、事件与命令式访问",1788745401818]