Использование Google Диаграмм
Оптимизируйте свои подборки
Сохраняйте и классифицируйте контент в соответствии со своими настройками.
Google Charts предоставляет идеальный способ визуализации данных на вашем веб-сайте. Галерея диаграмм содержит большое количество готовых к использованию типов диаграмм, от простых линейных диаграмм до сложных иерархических древовидных карт.
Наиболее распространенный способ использования Google Charts — это простой JavaScript, который вы встраиваете в свою веб-страницу. Вы загружаете некоторые библиотеки Google Chart, перечисляете данные для диаграммы, выбираете параметры для настройки диаграммы и, наконец, создаете объект диаграммы с выбранным вами идентификатором . Затем, позже на веб-странице, вы создаете <div> с этим идентификатором для отображения Google Chart.
Это все, что вам нужно, чтобы начать .
Диаграммы представлены как классы JavaScript, а Google Charts предоставляет множество типов диаграмм, которые вы можете использовать. Внешний вид по умолчанию, как правило, будет всем, что вам нужно, и вы всегда можете настроить диаграмму в соответствии с внешним видом вашего веб-сайта. Диаграммы очень интерактивны и отображают события , которые позволяют вам соединить их для создания сложных информационных панелей или других функций, интегрированных с вашей веб-страницей . Диаграммы визуализируются с использованием технологии HTML5/SVG для обеспечения кросс-браузерной совместимости (включая VML для более старых версий IE) и кросс-платформенной переносимости на iPhone, iPad и Android. Вашим пользователям никогда не придется возиться с плагинами или любым программным обеспечением. Если у них есть веб-браузер, они могут видеть ваши графики.
Все типы диаграмм заполняются данными с помощью класса DataTable , что позволяет легко переключаться между типами диаграмм, когда вы экспериментируете, чтобы найти идеальный внешний вид. DataTable предоставляет методы для сортировки, изменения и фильтрации данных и может быть заполнен непосредственно с вашей веб-страницы, базы данных или любого поставщика данных, поддерживающего протокол источника данных инструментов для работы с диаграммами . (Этот протокол включает язык запросов, подобный SQL, и реализуется Google Spreadsheets, Google Fusion Tables и сторонними поставщиками данных, такими как SalesForce. Вы даже можете реализовать протокол на своем собственном веб-сайте и стать поставщиком данных для других служб.)
Готовы создать свой первый график? Посетите быстрый старт .
Наши инструменты постоянно совершенствуются, чтобы лучше соответствовать вашим потребностям; мы полагаемся на ваши отзывы, чтобы помочь нам определить приоритеты, какие функции включить. Присоединяйтесь к нашей дискуссионной группе .
Если не указано иное, контент на этой странице предоставляется по лицензии Creative Commons "С указанием авторства 4.0", а примеры кода – по лицензии Apache 2.0. Подробнее об этом написано в правилах сайта. Java – это зарегистрированный товарный знак корпорации Oracle и ее аффилированных лиц.
Последнее обновление: 2024-07-10 UTC.
[null,null,["Последнее обновление: 2024-07-10 UTC."],[[["\u003cp\u003eGoogle Charts offers a wide variety of interactive and customizable chart types to visualize data on your website.\u003c/p\u003e\n"],["\u003cp\u003eEmbedding charts is straightforward using simple JavaScript that loads libraries, specifies data, customizes options, and creates a chart object within a div element.\u003c/p\u003e\n"],["\u003cp\u003eCharts are highly interactive, supporting events, dashboards, and integration with web pages for enhanced user experiences.\u003c/p\u003e\n"],["\u003cp\u003eGoogle Charts uses HTML5/SVG technology for cross-browser and cross-platform compatibility, ensuring accessibility for all users.\u003c/p\u003e\n"],["\u003cp\u003eData population is handled by the DataTable class, enabling easy switching between chart types and providing methods for data manipulation and sourcing.\u003c/p\u003e\n"]]],[],null,["# Using Google Charts\n\nGoogle Charts provides a perfect way to visualize data on your website.\nFrom simple line charts to complex hierarchical tree maps, the\n[chart gallery](/chart/interactive/docs/gallery)\nprovides a large number of ready-to-use chart types.\n\nThe most common way to use Google Charts is with simple JavaScript\nthat you embed in your web page. You load some Google Chart libraries,\nlist the data to be charted, select options to customize your chart,\nand finally create a chart object with an id that you choose.\nThen, later in the web page, you create a \\\u003cdiv\\\u003e\nwith that id to display the Google Chart.\n\nThat's all you need to [get started](/chart/interactive/docs/quick_start).\n\nCharts are exposed as JavaScript classes, and Google Charts provides\n[many chart types](/chart/interactive/docs/gallery) for you to use.\nThe default appearance will usually be all you need, and you can always\n[customize a chart](/chart/interactive/docs/customizing_charts)\nto fit the look and feel of your website. Charts are highly interactive and expose\n[events](/chart/interactive/docs/events) that let you connect them to create complex\n[dashboards](/chart/interactive/docs/gallery/controls) or other experiences\n[integrated with your\nwebpage](/chart/interactive/docs/examples#full_html_page_example).\nCharts are rendered using HTML5/SVG technology to provide cross-browser compatibility\n(including VML for older IE versions) and cross platform portability to iPhones,\niPads, and Android. Your users will never have to mess with plugins or any software.\nIf they have a web browser, they can see your charts.\n\nAll chart types are populated with data using the\n[DataTable](/chart/interactive/docs/reference#DataTable) class,\nmaking it easy to switch between chart types as you experiment to find the ideal appearance.\nThe DataTable provides methods for sorting, modifying, and filtering data, and can be\npopulated directly from your web page, a database, or any data provider supporting the\n[Chart Tools Datasource](/chart/interactive/docs/queries) protocol.\n(That protocol includes a SQL-like query language and is implemented by Google Spreadsheets,\nGoogle Fusion Tables and third party data providers such as SalesForce.\nYou can even implement the protocol on your own website and become a data provider\nfor other services.)\n\n**Ready to create your first chart? Visit the\n[quickstart](/chart/interactive/docs/quick_start).**\n\nOur tools are constantly evolving to better address your needs;\nwe depend on your feedback to help us prioritize which features to include.\nJoin our [discussion group](http://groups.google.com/group/google-visualization-api)."]]
