1 line
8.9 KiB
JavaScript
1 line
8.9 KiB
JavaScript
"use strict";(globalThis.webpackChunktripdocs=globalThis.webpackChunktripdocs||[]).push([[906],{5923:(e,n,i)=>{i.r(n),i.d(n,{assets:()=>c,contentTitle:()=>r,default:()=>p,frontMatter:()=>s,metadata:()=>a,toc:()=>o});const a=JSON.parse('{"id":"map-tracker/places-creation","title":"Places - Creation","description":"Creating a Place using the Place creation modal","source":"@site/docs/map-tracker/places-creation.md","sourceDirName":"map-tracker","slug":"/map-tracker/places-creation","permalink":"/trip/docs/map-tracker/places-creation","draft":false,"unlisted":false,"tags":[],"version":"current","sidebarPosition":3,"frontMatter":{"sidebar_position":3,"description":"Creating a Place using the Place creation modal"},"sidebar":"docSidebar","previous":{"title":"Places","permalink":"/trip/docs/map-tracker/places"},"next":{"title":"Map - Panel","permalink":"/trip/docs/map-tracker/map-panel"}}');var t=i(4848),l=i(8453);const s={sidebar_position:3,description:"Creating a Place using the Place creation modal"},r="Places - Creation",c={},o=[{value:"GMaps API autocompletion",id:"gmaps-api-autocompletion",level:3},{value:"GMaps Place Parser",id:"gmaps-place-parser",level:3},{value:"Latitude, Longitude Parser",id:"latitude-longitude-parser",level:3},{value:"Batch Creation",id:"batch-creation",level:2}];function d(e){const n={a:"a",admonition:"admonition",code:"code",em:"em",h1:"h1",h2:"h2",h3:"h3",header:"header",li:"li",p:"p",pre:"pre",ul:"ul",...(0,l.R)(),...e.components};return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(n.header,{children:(0,t.jsx)(n.h1,{id:"places---creation",children:"Places - Creation"})}),"\n",(0,t.jsx)(n.admonition,{title:"TL;DR",type:"note",children:(0,t.jsxs)(n.p,{children:["Modal supports ",(0,t.jsx)(n.a,{href:"places-creation#latitude-longitude-parser",children:"flexible coordinate formats"}),", ",(0,t.jsx)(n.a,{href:"places-creation#gmaps-place-parser",children:"Google Maps Place links"}),", and ",(0,t.jsx)(n.a,{href:"places-creation#gmaps-api-autocompletion",children:"Google Maps API"})," autocomplete (API key required)."]})}),"\n",(0,t.jsx)(n.p,{children:"Creating a place is done through the place creation modal."}),"\n",(0,t.jsx)("img",{src:"/trip/img/place_creation_modal.png",alt:"Place creation modal"}),"\n",(0,t.jsx)("div",{style:{textAlign:"center"},children:(0,t.jsx)("sup",{children:"Place creation modal"})}),"\n",(0,t.jsx)(n.p,{children:"A place contains the following informations:"}),"\n",(0,t.jsxs)(n.ul,{children:["\n",(0,t.jsxs)(n.li,{children:[(0,t.jsx)(n.code,{children:"name"}),": the place's name"]}),"\n",(0,t.jsxs)(n.li,{children:[(0,t.jsx)(n.code,{children:"latitude"}),": latitude coordinates (",(0,t.jsx)(n.a,{href:"places-creation",children:"supports multiple formats"}),")"]}),"\n",(0,t.jsxs)(n.li,{children:[(0,t.jsx)(n.code,{children:"longitude"}),": longitude coordinates"]}),"\n",(0,t.jsxs)(n.li,{children:[(0,t.jsx)(n.code,{children:"place"}),": address or identifier (",(0,t.jsx)(n.a,{href:"places-creation#gmaps-place-parser",children:"supports GMaps Place link"}),")"]}),"\n",(0,t.jsxs)(n.li,{children:[(0,t.jsx)(n.code,{children:"category"}),": a label to categorize the places"]}),"\n",(0,t.jsxs)(n.li,{children:[(0,t.jsx)(n.code,{children:"image"}),": optional image to display in the map"]}),"\n",(0,t.jsxs)(n.li,{children:[(0,t.jsx)(n.code,{children:"duration"}),": optional duration in minutes (e.g., ",(0,t.jsx)(n.code,{children:"90"}),")"]}),"\n",(0,t.jsxs)(n.li,{children:[(0,t.jsx)(n.code,{children:"price"}),": optional price"]}),"\n",(0,t.jsxs)(n.li,{children:[(0,t.jsx)(n.code,{children:"description"}),": optional description (links will be auto-clickable)"]}),"\n",(0,t.jsxs)(n.li,{children:[(0,t.jsx)(n.code,{children:"allow dog"}),": optional boolean indicating if dogs are allowed"]}),"\n",(0,t.jsxs)(n.li,{children:[(0,t.jsx)(n.code,{children:"visited"}),": status indicating if the place has been visited (controls default visibility)"]}),"\n",(0,t.jsxs)(n.li,{children:[(0,t.jsx)(n.code,{children:"gpx"}),": optional GPX file to display trace on the map"]}),"\n"]}),"\n",(0,t.jsx)(n.h3,{id:"gmaps-api-autocompletion",children:"GMaps API autocompletion"}),"\n",(0,t.jsx)(n.admonition,{type:"warning",children:(0,t.jsxs)(n.p,{children:["You must add your ",(0,t.jsx)(n.em,{children:"Google API Key"})," in your ",(0,t.jsx)(n.a,{href:"settings",children:"settings"}),"."]})}),"\n",(0,t.jsx)(n.admonition,{type:"tip",children:(0,t.jsxs)(n.p,{children:["You can use the shortcuts ",(0,t.jsx)("kbd",{children:"Shift"}),"+",(0,t.jsx)("kbd",{children:"Enter"})," to run the completion and ",(0,t.jsx)("kbd",{children:"Ctrl"}),"+",(0,t.jsx)("kbd",{children:"Enter"})," to confirm the modal (if there is no missing field)"]})}),"\n",(0,t.jsx)(n.p,{children:"After entering a name, you can autocomplete the other fields by clicking the button inside the input area."}),"\n",(0,t.jsx)("img",{src:"/trip/img/place_gmaps_api.png",alt:"Autocomplete using GMaps API"}),"\n",(0,t.jsx)("div",{style:{textAlign:"center"},children:(0,t.jsx)("sup",{children:"Autocomplete using GMaps API"})}),"\n",(0,t.jsx)(n.h3,{id:"gmaps-place-parser",children:"GMaps Place Parser"}),"\n",(0,t.jsxs)(n.p,{children:["You can paste a Google Maps place link (",(0,t.jsx)(n.em,{children:(0,t.jsx)(n.a,{href:"https://www.google.com/maps/place/XXX",children:"https://www.google.com/maps/place/XXX"})}),") into the ",(0,t.jsx)(n.code,{children:"place"})," input to automatically populate the ",(0,t.jsx)(n.code,{children:"name"}),", ",(0,t.jsx)(n.code,{children:"place"}),", ",(0,t.jsx)(n.code,{children:"latitude"})," and ",(0,t.jsx)(n.code,{children:"longitude"})," fields from the link content."]}),"\n",(0,t.jsx)("img",{src:"/trip/img/place_gmaps_parse.png",alt:"Parse Google Maps place link"}),"\n",(0,t.jsx)("div",{style:{textAlign:"center"},children:(0,t.jsx)("sup",{children:"Parse Google Maps place link"})}),"\n",(0,t.jsx)(n.h3,{id:"latitude-longitude-parser",children:"Latitude, Longitude Parser"}),"\n",(0,t.jsxs)(n.p,{children:["The ",(0,t.jsx)(n.code,{children:"latitude"})," field is flexible and supports multiple LatLng coordinate formats, like:"]}),"\n",(0,t.jsxs)(n.ul,{children:["\n",(0,t.jsx)(n.li,{children:(0,t.jsx)(n.code,{children:"37.7749, -122.4194"})}),"\n",(0,t.jsx)(n.li,{children:(0,t.jsx)(n.code,{children:"37.7749\xb0 N, 122.4194\xb0 W"})}),"\n",(0,t.jsx)(n.li,{children:(0,t.jsx)(n.code,{children:"37\xb046'29.64\" N, 122\xb025'9.84\" W"})}),"\n",(0,t.jsx)(n.li,{children:(0,t.jsx)(n.code,{children:"37\xb046.494' N, 122\xb025.164' W"})}),"\n"]}),"\n",(0,t.jsxs)(n.p,{children:["It also supports full* ",(0,t.jsx)(n.a,{href:"https://maps.google.com/pluscodes/",children:"Plus Code"})," (e.g., ",(0,t.jsx)(n.code,{children:"849VCWC8+R9"}),")."]}),"\n",(0,t.jsx)(n.admonition,{type:"warning",children:(0,t.jsxs)(n.p,{children:["Only full Plus Codes are currently handled. The ",(0,t.jsx)(n.code,{children:"+"})," sign is added after eight characters for full codes\xa0(e.g., ",(0,t.jsx)(n.code,{children:"849VCWC8+R9"}),") and after the four characters for short codes (e.g., not full: ",(0,t.jsx)(n.code,{children:"V75V+9Q"}),")."]})}),"\n",(0,t.jsx)(n.h2,{id:"batch-creation",children:"Batch Creation"}),"\n",(0,t.jsx)(n.p,{children:"Places can\xa0be created using\xa0the batch creation\xa0dialog, which\xa0accepts a JSON\xa0array Example:"}),"\n",(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-json",children:'[\n { "category": "Culture", "name": "Car Museum", "lat": 12.12, "lng": 50.89, "place": "Auto History Museum" },\n {\n "category": "Nature & Outdoor",\n "name": "An amazing park",\n "lat": 50.12,\n "lng": 12.89,\n "place": "The Park",\n "image": "https://upload.wikimedia.org/wikipedia/commons/b/be/Random_pyramids.jpg"\n }\n]\n'})}),"\n",(0,t.jsx)(n.admonition,{title:"mandatory properties",type:"warning",children:(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{children:'"category": "Category name" (case-sensitive)\n"name": "The name"\n"lat": 0.00\n"lng": 0.00\n"place": "Your string"\n'})})}),"\n",(0,t.jsxs)(n.admonition,{title:"optional properties",type:"note",children:[(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{children:'"image": "https://example.com/image.jpg"\n"allowdog": true/false\n"description": "A description for the place"\n"price": 0.00\n"duration": 0\n"favorite": true/false\n"visited": true/false\n"gpx": "gpx file content"\n'})}),(0,t.jsx)(n.p,{children:"Image URLs must include the file extension. URLs without it will create the place but won't attach the image."})]})]})}function p(e={}){const{wrapper:n}={...(0,l.R)(),...e.components};return n?(0,t.jsx)(n,{...e,children:(0,t.jsx)(d,{...e})}):d(e)}},8453:(e,n,i)=>{i.d(n,{R:()=>s,x:()=>r});var a=i(6540);const t={},l=a.createContext(t);function s(e){const n=a.useContext(l);return a.useMemo(function(){return"function"==typeof e?e(n):{...n,...e}},[n,e])}function r(e){let n;return n=e.disableParentContext?"function"==typeof e.components?e.components(t):e.components||t:s(e.components),a.createElement(l.Provider,{value:n},e.children)}}}]); |