تنظيم صفحاتك في مجموعات
يمكنك حفظ المحتوى وتصنيفه حسب إعداداتك المفضّلة.
TypeScript هي مجموعة فرعية مكتوبة من JavaScript
يتم تجميعها إلى JavaScript عادية. يوضّح المقتطف أدناه طريقة بسيطة لاستخدام Google Maps باستخدام TypeScript.
لا تتضمّن الأنواع عادةً الخصائص أو الدوال أو الفئات المتوفّرة في إصدارات ألفا أو بيتا. في العديد من هذه الحالات، يمكن تحويل العنصر إلى النوع الصحيح.
يحدث الخطأ التالي بسبب الخاصية التجريبية mapId لـ MapOptions.
error TS2345: Argument of type '{ center: google.maps.LatLng; zoom: number;
mapId: string; }' is not assignable to parameter of type 'MapOptions'. Object
literal may only specify known properties, and 'mapId' does not exist in type
'MapOptions'.
يمكن تصحيح الخطأ أعلاه باستخدام عملية التحويل أدناه.
قد تستخدم بعض المكتبات حزمة أخرى غير
@types/google.maps،
ما قد يؤدي إلى حدوث تعارضات. استخدِم خيار برنامج التجميع skipLibCheck لتجنُّب المشاكل المتعلّقة بالأنواع غير المتسقة.
{"compilerOptions":{"skipLibCheck":true}}
تحديد typeRoots
قد تتطلّب بعض الأُطر، مثل Angular، تحديد خيار برنامج التجميع typeRoots لتضمين الأنواع المثبَّتة من @types/google.maps وجميع حِزم @types الأخرى.
تاريخ التعديل الأخير: 2025-08-27 (حسب التوقيت العالمي المتفَّق عليه)
[[["يسهُل فهم المحتوى.","easyToUnderstand","thumb-up"],["ساعَدني المحتوى في حلّ مشكلتي.","solvedMyProblem","thumb-up"],["غير ذلك","otherUp","thumb-up"]],[["لا يحتوي على المعلومات التي أحتاج إليها.","missingTheInformationINeed","thumb-down"],["الخطوات معقدة للغاية / كثيرة جدًا.","tooComplicatedTooManySteps","thumb-down"],["المحتوى قديم.","outOfDate","thumb-down"],["ثمة مشكلة في الترجمة.","translationIssue","thumb-down"],["مشكلة في العيّنات / التعليمات البرمجية","samplesCodeIssue","thumb-down"],["غير ذلك","otherDown","thumb-down"]],["تاريخ التعديل الأخير: 2025-08-27 (حسب التوقيت العالمي المتفَّق عليه)"],[[["\u003cp\u003eTypeScript can enhance Google Maps development by providing static typing and improved code maintainability.\u003c/p\u003e\n"],["\u003cp\u003eUse the \u003ccode\u003e@types/google.maps\u003c/code\u003e package from DefinitelyTyped for TypeScript support in your Google Maps projects.\u003c/p\u003e\n"],["\u003cp\u003eAlpha and beta Google Maps features may require type casting to avoid TypeScript errors.\u003c/p\u003e\n"],["\u003cp\u003eIn case of conflicting type definitions, consider utilizing the \u003ccode\u003eskipLibCheck\u003c/code\u003e compiler option to bypass type checking of external libraries.\u003c/p\u003e\n"],["\u003cp\u003eWhen necessary, configure \u003ccode\u003etypeRoots\u003c/code\u003e in your TypeScript configuration to ensure proper inclusion of Google Maps type definitions.\u003c/p\u003e\n"]]],[],null,["# TypeScript and Google Maps\n\n[TypeScript](https://www.typescriptlang.org/) is a typed superset of JavaScript\nthat compiles to plain JavaScript. The snippet below demonstrates simple usage\nof Google Maps using TypeScript. \n\n let map: google.maps.Map;\n const center: google.maps.LatLngLiteral = {lat: 30, lng: -110};\n\n function initMap(): void {\n map = new google.maps.Map(document.getElementById(\"map\") as HTMLElement, {\n center,\n zoom: 8\n });\n }\n\nGetting Started\n---------------\n\nThe\n[DefinitelyTyped project](https://github.com/DefinitelyTyped/DefinitelyTyped) is\nan open source projects that maintains type\n[declaration files](https://www.typescriptlang.org/docs/handbook/declaration-files/introduction.html)\nfor many packages including Google Maps. The Google Maps JavaScript declaration\nfiles (see\n[source files](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/google.maps)\non GitHub) can be installed using NPM from the\n[@types/google.maps](https://www.npmjs.com/package/@types/google.maps) package. \n\n npm i -D @types/google.maps\n\n| **Note:** These types are automatically generated. To report an issue with these types, open a [support ticket](https://issuetracker.google.com/issues/new?component=188853&template=788207).\n\nAlpha and Beta Features\n-----------------------\n\nThe\n[types](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/google.maps)\ntypically don't have the properties, functions, or classes found in alpha or\nbeta releases. In many of these cases, the object can be cast to the correct\ntype.\n\nThe following error is caused by the `mapId` beta property for `MapOptions`. \n\n```\nerror TS2345: Argument of type '{ center: google.maps.LatLng; zoom: number;\nmapId: string; }' is not assignable to parameter of type 'MapOptions'. Object\nliteral may only specify known properties, and 'mapId' does not exist in type\n'MapOptions'.\n```\n\nThe above error can be corrected with the cast below. \n\n { center: {lat: 30, lng: -110}, zoom: 8, mapId: '1234' } as google.maps.MapOptions\n\nConflicting @types packages\n---------------------------\n\nSome libraries may use a package other than\n[@types/google.maps](https://www.npmjs.com/package/@types/google.maps),\nwhich may cause conflicts. Use the\n[skipLibCheck](https://www.typescriptlang.org/tsconfig#skipLibCheck)\ncompiler option to avoid issues with inconsistent types. \n\n {\n \"compilerOptions\": {\n \"skipLibCheck\": true\n }\n }\n\nSpecify typeRoots\n-----------------\n\nSome frameworks such as Angular may require specifying the\n[typeRoots](https://www.typescriptlang.org/tsconfig#typeRoots)\ncompiler option to include types installed from\n[@types/google.maps](https://www.npmjs.com/package/@types/google.maps)\nand all other \"@types\" packages.\n**Note:** By default all visible \"@types\" packages are included in your compilation. Packages in node_modules/@types of any enclosing folder are considered visible. \n\n {\n ...\n \"compilerOptions\": {\n ...\n \"typeRoots\": [\n \"node_modules/@types\",\n ],\n ...\n }\n }"]]