@heycar/heycars-map 0.3.6 → 0.3.8

package/dist/style.css

@@ -1 +1 @@
-.n8tgem0{pointer-events:none;position:absolute;bottom:50%;left:0;right:0;margin-left:auto;margin-right:auto;display:flex;flex-direction:column;align-items:center;z-index:1}.n8tgem1{pointer-events:auto;padding:2.67vw 4.27vw;background:linear-gradient(90deg,#79AFFF 0%,#5C8DFF 32%,#507FFF 75%,#4471FF 100%);border-radius:3.2vw;display:flex;align-items:center}.n8tgem2{padding-right:2.67vw;max-width:41.33vw}.n8tgem3{display:-webkit-box;font-size:3.47vw;font-family:PingFangSC-Semibold,PingFang SC;font-weight:600;color:#fff;line-height:4.8vw;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.n8tgem4{margin-top:.53vw;font-size:2.93vw;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;color:#fff;line-height:4.27vw;opacity:.8}.n8tgem5{width:1.758vw;height:2.93vw}.n8tgem6{width:.8vw;height:4vw;background:#4C80FF;border-radius:0vw 0vw 26.67vw 26.67vw}.n8tgem7{width:6.9355vw;height:10.67vw}.rgf09w0{width:7.1045vw;height:10.93vw;display:flex}._15rq2xn0{display:flex;flex-direction:column;align-items:center;margin-bottom:-1.6vw}._15rq2xn1{padding:2.13vw 4.5vw 2.67vw 4.27vw;display:flex;align-items:center;background:linear-gradient(90deg,#79AFFF 0%,#5C8DFF 32%,#507FFF 75%,#4471FF 100%);border-radius:3.2vw}._15rq2xn2{font-size:3.47vw;font-family:PingFangSC-Semibold,PingFang SC;font-weight:600;color:#fff;line-height:4.8vw;white-space:nowrap}._15rq2xn3{font-size:2.93vw;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;color:#eafaf8;line-height:4.27vw;white-space:nowrap;opacity:.8}._15rq2xn4{margin-left:3.2vw;width:1.44vw;height:2.4vw}._15rq2xn5{width:.8vw;height:4vw;background:#4C80FF;border-radius:0vw 0vw 26.67vw 26.67vw;z-index:1}._15rq2xn6{margin-top:-1.5vw;width:3.2vw;height:3.2vw}._1d8ur7t0,._7anfuo0{position:relative}._4a4ovk0{margin-bottom:-.4vw;display:flex;flex-direction:column;align-items:center}._4a4ovk1{padding:1.07vw 2.4vw 1.6vw 2.67vw;background:#FFFFFF;box-shadow:0 .53vw 2.4vw #3f3f3f33;border-radius:2.13vw}._4a4ovk2{padding:2.67vw 2.67vw 2.4vw 3.2vw;background:#FFFFFF;box-shadow:0 0 2.67vw #4e556c26;border-radius:4.8vw;font-size:3.2vw;font-family:PingFangSC-Medium,PingFang SC;font-weight:500;color:#1e1e1e;line-height:4.53vw;white-space:nowrap}._4a4ovk3{font-size:3.2vw;font-family:PingFangSC-Medium,PingFang SC;font-weight:500;color:#1e1e1e;line-height:4.53vw;white-space:nowrap}._4a4ovk4{font-size:2.4vw;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;color:#7e7e7e;line-height:3.47vw;white-space:nowrap}._4a4ovk5{color:#4471ff;font-family:PingFangSC-Medium,PingFang SC;font-weight:500}._4a4ovk6{margin-top:1.33vw;width:6.192vw;height:7.998vw}._4a4ovk7{margin-top:2.4vw;width:6.192vw;height:7.998vw}._1l6offo0{display:flex}._1l6offo1{width:4.53vw;height:4.53vw;margin-bottom:-2.265vw}._1l6offo2{width:16.27vw;height:16.27vw;margin-bottom:-8.135vw}.fhyw80{display:flex;align-items:center}.fhyw81{flex-direction:row-reverse}.fhyw83{margin-right:-2.265vw}.fhyw84{margin-left:-2.265vw}.fhyw85{margin-bottom:-2.265vw}.fhyw86{margin-right:calc(50% - 2.265vw)}.fhyw87{margin-left:calc(50% - 2.265vw)}.fhyw88{display:flex;width:4.53vw;height:4.53vw}.fhyw89{opacity:0}.fhyw8b{display:-webkit-box;font-size:3.2vw;font-family:PingFangSC-Semibold,PingFang SC;font-weight:600;color:#243e66;line-height:4.53vw;width:max-content;max-width:32vw;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}._65j3sr1{margin-top:1.87vw;margin-bottom:-5.5vw;width:6vw;height:11vw}@keyframes rrvp0y0{0%{transform:scale(0);opacity:1}33.33%{transform:scale(.5);opacity:1}66.66%{transform:scale(1);opacity:0}to{transform:scale(1);opacity:0}}@keyframes rrvp0y1{0%{transform:scale(0);opacity:0}33.33%{transform:scale(0);opacity:1}66.66%{transform:scale(.5);opacity:1}to{transform:scale(1);opacity:0}}.rrvp0y2{display:flex;margin-bottom:-30.935vw;width:61.87vw;height:61.87vw;animation-name:rrvp0y0;animation-duration:3s;animation-iteration-count:infinite;animation-timing-function:linear}.rrvp0y3{animation-name:rrvp0y1}
+.n8tgem0{pointer-events:none;position:absolute;bottom:50%;left:0;right:0;margin-left:auto;margin-right:auto;display:flex;flex-direction:column;align-items:center;z-index:1}.n8tgem1{pointer-events:auto;padding:2.67vw 4.27vw;background:linear-gradient(90deg,#79AFFF 0%,#5C8DFF 32%,#507FFF 75%,#4471FF 100%);border-radius:3.2vw;display:flex;align-items:center}.n8tgem2{padding-right:2.67vw;max-width:41.33vw}.n8tgem3{display:-webkit-box;font-size:3.47vw;font-family:PingFangSC-Semibold,PingFang SC;font-weight:600;color:#fff;line-height:4.8vw;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.n8tgem4{margin-top:.53vw;font-size:2.93vw;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;color:#fff;line-height:4.27vw;opacity:.8}.n8tgem5{width:1.758vw;height:2.93vw}.n8tgem6{width:.8vw;height:4vw;background:#4C80FF;border-radius:0vw 0vw 26.67vw 26.67vw}.n8tgem7{width:6.9355vw;height:10.67vw}.rgf09w0{width:7.1045vw;height:10.93vw;display:flex}._15rq2xn0{display:flex;flex-direction:column;align-items:center;margin-bottom:-1.6vw}._15rq2xn1{padding:2.13vw 4.5vw 2.67vw 4.27vw;display:flex;align-items:center;background:linear-gradient(90deg,#79AFFF 0%,#5C8DFF 32%,#507FFF 75%,#4471FF 100%);border-radius:3.2vw}._15rq2xn2{font-size:3.47vw;font-family:PingFangSC-Semibold,PingFang SC;font-weight:600;color:#fff;line-height:4.8vw;white-space:nowrap}._15rq2xn3{font-size:2.93vw;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;color:#eafaf8;line-height:4.27vw;white-space:nowrap;opacity:.8}._15rq2xn4{margin-left:3.2vw;width:1.44vw;height:2.4vw}._15rq2xn5{width:.8vw;height:4vw;background:#4C80FF;border-radius:0vw 0vw 26.67vw 26.67vw;z-index:1}._15rq2xn6{margin-top:-1.5vw;width:3.2vw;height:3.2vw}._1d8ur7t0{position:relative}._7anfuo0{height:inherit;width:inherit}._7anfuo1{position:relative}._4a4ovk0{margin-bottom:-.4vw;display:flex;flex-direction:column;align-items:center}._4a4ovk1{padding:1.07vw 2.4vw 1.6vw 2.67vw;background:#FFFFFF;box-shadow:0 .53vw 2.4vw #3f3f3f33;border-radius:2.13vw}._4a4ovk2{padding:2.67vw 2.67vw 2.4vw 3.2vw;background:#FFFFFF;box-shadow:0 0 2.67vw #4e556c26;border-radius:4.8vw;font-size:3.2vw;font-family:PingFangSC-Medium,PingFang SC;font-weight:500;color:#1e1e1e;line-height:4.53vw;white-space:nowrap}._4a4ovk3{font-size:3.2vw;font-family:PingFangSC-Medium,PingFang SC;font-weight:500;color:#1e1e1e;line-height:4.53vw;white-space:nowrap}._4a4ovk4{font-size:2.4vw;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;color:#7e7e7e;line-height:3.47vw;white-space:nowrap}._4a4ovk5{color:#4471ff;font-family:PingFangSC-Medium,PingFang SC;font-weight:500}._4a4ovk6{margin-top:1.33vw;width:6.192vw;height:7.998vw}._4a4ovk7{margin-top:2.4vw;width:6.192vw;height:7.998vw}._1l6offo0{display:flex}._1l6offo1{width:4.53vw;height:4.53vw;margin-bottom:-2.265vw}._1l6offo2{width:16.27vw;height:16.27vw;margin-bottom:-8.135vw}.fhyw80{display:flex;align-items:center}.fhyw81{flex-direction:row-reverse}.fhyw83{margin-right:-2.265vw}.fhyw84{margin-left:-2.265vw}.fhyw85{margin-bottom:-2.265vw}.fhyw86{margin-right:calc(50% - 2.265vw)}.fhyw87{margin-left:calc(50% - 2.265vw)}.fhyw88{display:flex;width:4.53vw;height:4.53vw}.fhyw89{opacity:0}.fhyw8b{display:-webkit-box;font-size:3.2vw;font-family:PingFangSC-Semibold,PingFang SC;font-weight:600;color:#243e66;line-height:4.53vw;width:max-content;max-width:32vw;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}._65j3sr1{margin-top:1.87vw;margin-bottom:-5.5vw;width:6vw;height:11vw}@keyframes rrvp0y0{0%{transform:scale(0);opacity:1}33.33%{transform:scale(.5);opacity:1}66.66%{transform:scale(1);opacity:0}to{transform:scale(1);opacity:0}}@keyframes rrvp0y1{0%{transform:scale(0);opacity:0}33.33%{transform:scale(0);opacity:1}66.66%{transform:scale(.5);opacity:1}to{transform:scale(1);opacity:0}}.rrvp0y2{display:flex;margin-bottom:-30.935vw;width:61.87vw;height:61.87vw;animation-name:rrvp0y0;animation-duration:3s;animation-iteration-count:infinite;animation-timing-function:linear}.rrvp0y3{animation-name:rrvp0y1}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@heycar/heycars-map",
-  "version": "0.3.6",
+  "version": "0.3.8",
   "type": "module",
   "scripts": {
     "dev": "vite -c vite.config.dev.ts",

package/todo.md

@@ -1,8 +1,9 @@
 https://dawchihliou.github.io/articles/building-custom-google-maps-marker-react-component-like-airbnb-in-nextjs
 
 2. Google 地址名称太长
-3. 高德地图加载期间出现大量的请求
-4. google/高德 坐标系转化
+3. 中心点 drag 期间位置
+4. 高德地图加载期间出现大量的请求
+5. google/高德 坐标系转化
 
 ---
 
@@ -12,9 +13,20 @@ https://dawchihliou.github.io/articles/building-custom-google-maps-marker-react-
 
 ---
 
+1. locator 的气泡也要支持点击
+2. locator 气泡长度限制
 3. locator 拖动次数多了会不更新
+4. 郝瑞 searh Place 接口搜索次数多了会不更新
 
 ---
 
-2. google cityparent 要用 city 上级，目前是 country 下级
-3. 推荐点搜索是距离参数可能要优化，比如没搜到推荐点，应该扩大搜索距离
+1. 定位失败的视觉稿文字提示
+2. 用户手动输入地址，然后跳回 home 页面， centerplace 的 name 不正确
+3. 用户地址搜索，先设置台湾，搜个结果，然后切换城市到新加坡，搜索到结果依然是台湾
+
+v0.3.8
+
+- 4845
+- 4898
+- 4840
+- 4827

package/dist/Demo/CityBound/SearchDemo.d.ts

@@ -1 +0,0 @@
-export declare const SearchDemo: import("vue-demi").DefineComponent<import("vue/types/v3-component-props").ComponentObjectPropsOptions<unknown>, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").Empty, import("../../types/helper").EmitByProps<unknown, Required<unknown>>, never, unknown, {}>;

package/dist/Demo/CityBound/country.d.ts

@@ -1,5 +0,0 @@
-export declare const countries: Record<string, string>;
-export declare const citiesWithCountry: {
-    name: string;
-    country: string;
-}[];

package/dist/Demo/CityBound/searchResult.d.ts

@@ -1,8 +0,0 @@
-/// <reference types="google.maps" />
-export type Result = {
-    name: string;
-    country: string;
-    bound: google.maps.LatLngBoundsLiteral | null;
-};
-export declare const searchResult: Result[];
-export declare const breakIdx = 3280;

package/dist/hooks/useMapLog.d.ts

@@ -1,5 +0,0 @@
-export interface MapLogProps {
-    log?: boolean;
-}
-export declare const useMapLog: <P extends MapLogProps>(props: P, prefix: string) => void;
-export declare const useMapLogVariable: <P extends MapLogProps>(props: P, prefix: string, variable: any, name: string) => void;

package/src/App.tsx

@@ -1,27 +0,0 @@
-import { defineComponent } from "vue-demi";
-import { MapProvider } from "./components/MapProvider";
-import { DemoBusinessRecomendPlace } from "./Demo/DemoBusinessRecomendPlace";
-
-const gmapApiKey = import.meta.env.VITE_GMAP_API_KEY;
-const gmapId = import.meta.env.VITE_GMAP_MAP_ID;
-const amapApiKey = import.meta.env.VITE_AMAP_API_KEY;
-const amapApiSecret = import.meta.env.VITE_AMAP_API_SECRET;
-
-export const App = defineComponent({
-  setup() {
-    return () => (
-      <MapProvider
-        amapKey={amapApiKey}
-        amapSecret={amapApiSecret}
-        gmapId={gmapId}
-        gmapKey={gmapApiKey}
-        supplier={"amap"}
-      >
-        <DemoBusinessRecomendPlace />
-        {/* <DemoBusinessQuoting /> */}
-        {/* <DemoBusinessTaxiService /> */}
-        {/* <DemoBusinessTaxiEnd /> */}
-      </MapProvider>
-    );
-  },
-});

package/src/Demo/CityBound/SearchDemo.tsx

@@ -1,142 +0,0 @@
-import { watchPostEffect } from "vue-demi";
-import { HeycarMap, MapProvider } from "../../components/MapProvider/MapProvider";
-import { useHeycarMap } from "../../hooks/useHeycarMap";
-import { defineSetup } from "../../types/helper";
-import * as css from "../Demo.css";
-import { citiesWithCountry } from "./country";
-import { searchResult } from "./searchResult";
-
-const gmapApiKey = import.meta.env.VITE_GMAP_API_KEY;
-const gmapId = import.meta.env.VITE_GMAP_MAP_ID;
-const amapApiKey = import.meta.env.VITE_AMAP_API_KEY;
-const amapApiSecret = import.meta.env.VITE_AMAP_API_SECRET;
-
-export const SearchDemo = defineSetup(function HeycarDemo() {
-  return () => (
-    <MapProvider
-      amapKey={amapApiKey}
-      amapSecret={amapApiSecret}
-      gmapId={gmapId}
-      gmapKey={gmapApiKey}
-      supplier={"gmap"}
-    >
-      <SomePage />
-    </MapProvider>
-  );
-});
-
-const SomePage = defineSetup(function Hello() {
-  const { mapRef, setMap, panTo } = useHeycarMap();
-  (window as any).panTo = panTo;
-  watchPostEffect(() => {
-    const map = mapRef.value as google.maps.Map;
-    if (!map) return;
-    const searchName = async (idx: number, address: string, country: string) => {
-      const geocoder = new google.maps.Geocoder();
-      // const placeService = new google.maps.places.PlacesService(document.createElement("div"));
-      return new Promise((resolve, reject) => {
-        geocoder.geocode(
-          {
-            address,
-            componentRestrictions: {
-              country,
-              administrativeArea: "administrative_area_level_1",
-            },
-            language: "en",
-          },
-          (results, status) => {
-            switch (status) {
-              case google.maps.GeocoderStatus.OK: {
-                if (results?.length === 2) {
-                  const [result1, result2] = results;
-                  const isResult1Admin = result1.types[0].startsWith("administrative_area_level_");
-                  const isResult2Admin = result2.types[0].startsWith("administrative_area_level_");
-                  if (isResult1Admin && !isResult2Admin) {
-                    return resolve(result1.geometry.bounds?.toJSON());
-                  }
-                  if (isResult2Admin && !isResult1Admin) {
-                    return resolve(result2.geometry.bounds?.toJSON());
-                  }
-                }
-                if (results?.length !== 1) {
-                  console.warn("length !== 1 by idx, keyword, results = ", idx, address, results);
-                  return resolve(undefined);
-                }
-                const { geometry } = results[0];
-                const output = geometry.bounds?.toJSON() ?? geometry.viewport.toJSON();
-                return resolve(output);
-              }
-              case google.maps.GeocoderStatus.ZERO_RESULTS: {
-                return resolve(undefined);
-              }
-              default:
-                throw reject(status);
-            }
-          }
-        );
-      });
-    };
-    const wait = (seconds: number) => new Promise((r) => setTimeout(r, seconds * 1000));
-    const search = async (from: number, to: number) => {
-      const citiesSample = citiesWithCountry.slice(from, to);
-      const result: { name: string; country: string; bound: any }[] = [];
-      let idx = from;
-      try {
-        for (const city of citiesSample) {
-          if (idx % 10 === 0) {
-            console.log("start processing idx = ", idx);
-          }
-          const bound = await searchName(idx, city.name, city.country);
-          await wait(2);
-          result.push({ name: city.name, country: city.country, bound: bound ?? null });
-          idx += 1;
-        }
-        console.log("success search result = ");
-        console.log(JSON.stringify(result));
-      } catch (e) {
-        console.log("failed search break idx = ", idx);
-        console.log(JSON.stringify(result));
-        throw e;
-      }
-    };
-
-    const searchRest = async () => {
-      const notfound = searchResult.filter((item) => item.bound == null);
-      const result: { name: string; country: string; bound: any }[] = [];
-      try {
-        for (const city of notfound) {
-          try {
-            const bound = await searchName(0, city.name, city.country);
-            await wait(2);
-            result.push({ name: city.name, country: city.country, bound: bound ?? null });
-          } catch (e) {
-            console.warn("fail search name, country = ", city.name, city.country);
-            console.error(e);
-            continue;
-          }
-        }
-        console.log("success search result = ");
-        console.log(JSON.stringify(result));
-      } catch (e) {
-        console.log(JSON.stringify(result));
-        throw e;
-      }
-    };
-    (window as any).search = search;
-    (window as any).searchRest = searchRest;
-  });
-  return () => {
-    return (
-      <div>
-        <HeycarMap
-          class={css.demo}
-          fallback={() => <div>error</div>}
-          loading={() => <div>loading</div>}
-          center={[121, 31]}
-          zoom={15}
-          mapRef={setMap}
-        ></HeycarMap>
-      </div>
-    );
-  };
-});