{"id":11149,"date":"2023-06-05T15:37:02","date_gmt":"2023-06-05T13:37:02","guid":{"rendered":"https:\/\/schedulejs.com\/?p=11149"},"modified":"2024-07-02T09:26:11","modified_gmt":"2024-07-02T07:26:11","slug":"dynamic-rendering-zoom-level","status":"publish","type":"post","link":"https:\/\/schedulejs.com\/fr\/dynamic-rendering-zoom-level\/","title":{"rendered":"Rendu dynamique : Niveau de zoom"},"content":{"rendered":"<div data-elementor-type=\"wp-post\" data-elementor-id=\"11149\" class=\"elementor elementor-11149\" data-elementor-settings=\"[]\">\n\t\t\t\t\t\t\t<div class=\"elementor-section-wrap\">\n\t\t\t\t\t\t\t<div class=\"elementor-section elementor-top-section elementor-element elementor-element-ae92876 elementor-section-stretched schedulejs-header-menu elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"ae92876\" data-element_type=\"section\" id=\"schedulejs-header-menu\" data-settings=\"{&quot;stretch_section&quot;:&quot;section-stretched&quot;,&quot;background_background&quot;:&quot;classic&quot;,&quot;animation&quot;:&quot;none&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-fee1607\" data-id=\"fee1607\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-a6a075e elementor-widget elementor-widget-image\" data-id=\"a6a075e\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/\">\n\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"900\" height=\"300\" src=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2021\/05\/logo_schedulejs_blue_1500x500-2-1024x341.png\" class=\"attachment-large size-large\" alt=\"schedulejs\" srcset=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2021\/05\/logo_schedulejs_blue_1500x500-2-1024x341.png 1024w, https:\/\/schedulejs.com\/wp-content\/uploads\/2021\/05\/logo_schedulejs_blue_1500x500-2-300x100.png 300w, https:\/\/schedulejs.com\/wp-content\/uploads\/2021\/05\/logo_schedulejs_blue_1500x500-2-768x256.png 768w, https:\/\/schedulejs.com\/wp-content\/uploads\/2021\/05\/logo_schedulejs_blue_1500x500-2-730x243.png 730w, https:\/\/schedulejs.com\/wp-content\/uploads\/2021\/05\/logo_schedulejs_blue_1500x500-2.png 1500w\" sizes=\"auto, (max-width: 900px) 100vw, 900px\" \/>\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-87efabb\" data-id=\"87efabb\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-03a8e64 elementor-widget elementor-widget-ekit-nav-menu\" data-id=\"03a8e64\" data-element_type=\"widget\" data-widget_type=\"ekit-nav-menu.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<div class=\"ekit-wid-con ekit_menu_responsive_tablet\" data-hamburger-icon=\"fas fa-bars\" data-hamburger-icon-type=\"icon\" data-responsive-breakpoint=\"1024\">            <button class=\"elementskit-menu-hamburger elementskit-menu-toggler\">\n                <i aria-hidden=\"true\" class=\"ekit-menu-icon fas fa-bars\"><\/i>            <\/button>\n            <div id=\"ekit-megamenu-schedulejs-primary-menu\" class=\"elementskit-menu-container elementskit-menu-offcanvas-elements elementskit-navbar-nav-default elementskit_line_arrow ekit-nav-menu-one-page-\"><ul id=\"main-menu\" class=\"elementskit-navbar-nav elementskit-menu-po-right submenu-click-on-\"><li id=\"menu-item-11511\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-11511 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/blog-javascript-framework\/\" class=\"ekit-menu-nav-link\">Blog<\/a><\/li>\n<li id=\"menu-item-2859\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-2859 nav-item delay-1 nav-item elementskit-dropdown-has relative_position elementskit-dropdown-menu-default_width elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/presentation-angular-gantt-library\/\" class=\"ekit-menu-nav-link ekit-menu-dropdown-toggle\">Produit<i class=\"icon icon-down-arrow1 elementskit-submenu-indicator\"><\/i><\/a>\n<ul class=\"elementskit-dropdown elementskit-submenu-panel\">\n\t<li id=\"menu-item-2860\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-2860 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/presentation-angular-gantt-library\/\" class=\"dropdown-item\">ScheduleJS<\/a>\t<li id=\"menu-item-10522\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-10522 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/schedule-js-viewer-2\/\" class=\"dropdown-item\">ScheduleJS Viewer<\/a>\t<li id=\"menu-item-12063\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-12063 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/api-code-typescript-gantt-library\/\" class=\"dropdown-item\">API &amp; Code<\/a>\t<li id=\"menu-item-2892\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-2892 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/example-gantt-js\/\" class=\"dropdown-item\">Cas pratique<\/a>\t<li id=\"menu-item-2890\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-2890 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/faqs-gantt-js\/\" class=\"dropdown-item\">FAQs<\/a><\/ul>\n<\/li>\n<li id=\"menu-item-11895\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-11895 nav-item delay-1 nav-item elementskit-dropdown-has relative_position elementskit-dropdown-menu-default_width elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/services-gantt-js\/\" class=\"ekit-menu-nav-link ekit-menu-dropdown-toggle\">Services<i class=\"icon icon-down-arrow1 elementskit-submenu-indicator\"><\/i><\/a>\n<ul class=\"elementskit-dropdown elementskit-submenu-panel\">\n\t<li id=\"menu-item-5624\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-5624 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/maintenance-support\/\" class=\"dropdown-item\">Maintenance &amp; Support<\/a>\t<li id=\"menu-item-11589\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-11589 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/training-gantt-js-2\/\" class=\"dropdown-item\">Formations<\/a>\t<li id=\"menu-item-5622\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-5622 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/development\/\" class=\"dropdown-item\">D\u00e9veloppement<\/a>\t<li id=\"menu-item-5626\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-5626 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/ui-ux-design\/\" class=\"dropdown-item\">Design UI \/ UX<\/a>\t<li id=\"menu-item-5623\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-5623 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/flexgantt-migration\/\" class=\"dropdown-item\">Migration FlexGantt<\/a>\t<li id=\"menu-item-5621\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-5621 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/proof-of-concept-gantt-js\/\" class=\"dropdown-item\">Proof of Concept<\/a><\/ul>\n<\/li>\n<li id=\"menu-item-11590\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-11590 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/pricing-js-gantt\/\" class=\"ekit-menu-nav-link\">Pricing<\/a><\/li>\n<li id=\"menu-item-6751\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-6751 nav-item delay-1 nav-item elementskit-dropdown-has relative_position elementskit-dropdown-menu-default_width elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/job-openings\/\" class=\"ekit-menu-nav-link ekit-menu-dropdown-toggle\">Carri\u00e8res<i class=\"icon icon-down-arrow1 elementskit-submenu-indicator\"><\/i><\/a>\n<ul class=\"elementskit-dropdown elementskit-submenu-panel\">\n\t<li id=\"menu-item-7071\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-7071 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/our-work-gantt-js\/\" class=\"dropdown-item\">Notre travail<\/a>\t<li id=\"menu-item-7072\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-7072 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/job-openings\/\" class=\"dropdown-item\">Offres d'emploi<\/a><\/ul>\n<\/li>\n<li id=\"menu-item-2937\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-2937 nav-item delay-1 nav-item elementskit-dropdown-has relative_position elementskit-dropdown-menu-default_width elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/contact-support-schedulejs\/\" class=\"ekit-menu-nav-link ekit-menu-dropdown-toggle\">Support<i class=\"icon icon-down-arrow1 elementskit-submenu-indicator\"><\/i><\/a>\n<ul class=\"elementskit-dropdown elementskit-submenu-panel\">\n\t<li id=\"menu-item-2935\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-2935 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/submit-a-ticket\/\" class=\"dropdown-item\">Cr\u00e9er un ticket<\/a>\t<li id=\"menu-item-3367\" class=\"menu-item menu-item-type-custom menu-item-object-custom menu-item-3367 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a target=\"_blank\" href=\"https:\/\/www.schedulejs.com\/api\/docs\/index.html\" class=\"dropdown-item\">Documentation de l'API<\/a>\t<li id=\"menu-item-7319\" class=\"menu-item menu-item-type-custom menu-item-object-custom menu-item-7319 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a target=\"_blank\" href=\"https:\/\/schedulejs.com\/fr\/manual\/\" class=\"dropdown-item\">Manuel du d\u00e9veloppeur<\/a><\/ul>\n<\/li>\n<li id=\"menu-item-12479\" class=\"contact-menu menu-item menu-item-type-post_type menu-item-object-page menu-item-12479 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/contact-schedulejs\/\" class=\"ekit-menu-nav-link\">Contact<\/a><\/li>\n<li id=\"menu-item-11921\" class=\"trp-language-switcher-container menu-item menu-item-type-post_type menu-item-object-language_switcher menu-item-has-children current-language-menu-item menu-item-11921 nav-item delay-1 nav-item elementskit-dropdown-has relative_position elementskit-dropdown-menu-default_width elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/wp-json\/wp\/v2\/posts\/11149\" class=\"ekit-menu-nav-link ekit-menu-dropdown-toggle\"><span data-no-translation><img loading=\"lazy\" decoding=\"async\" class=\"trp-flag-image\" src=\"https:\/\/schedulejs.com\/wp-content\/plugins\/translatepress-multilingual\/assets\/images\/flags\/fr_FR.png\" width=\"18\" height=\"12\" alt=\"fr_FR\" title=\"Fran\u00e7ais\"><span class=\"trp-ls-language-name\">Fran\u00e7ais<\/span><\/span><i class=\"icon icon-down-arrow1 elementskit-submenu-indicator\"><\/i><\/a>\n<ul class=\"elementskit-dropdown elementskit-submenu-panel\">\n\t<li id=\"menu-item-11923\" class=\"trp-language-switcher-container menu-item menu-item-type-post_type menu-item-object-language_switcher menu-item-11923 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/en\/wp-json\/wp\/v2\/posts\/11149\/\" class=\"dropdown-item\"><span data-no-translation><img loading=\"lazy\" decoding=\"async\" class=\"trp-flag-image\" src=\"https:\/\/schedulejs.com\/wp-content\/plugins\/translatepress-multilingual\/assets\/images\/flags\/en_US.png\" width=\"18\" height=\"12\" alt=\"en_US\" title=\"English\"><span class=\"trp-ls-language-name\">English<\/span><\/span><\/a><\/ul>\n<\/li>\n<\/ul>\n\t\t\t\t<div class=\"elementskit-nav-identity-panel\">\n\t\t\t\t\t<div class=\"elementskit-site-title\">\n\t\t\t\t\t\t<a class=\"elementskit-nav-logo\" href=\"https:\/\/schedulejs.com\/fr\" target=\"_self\" rel=\"\">\n\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2021\/04\/logo_schedulejs_blue_1128x191-1.png\" alt=\"Logo ScheduleJS small\">\n\t\t\t\t\t\t<\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<button class=\"elementskit-menu-close elementskit-menu-toggler\" type=\"button\">X<\/button>\n\t\t\t\t<\/div>\n\t\t\t<\/div><div class=\"elementskit-menu-overlay elementskit-menu-offcanvas-elements elementskit-menu-toggler ekit-nav-menu--overlay\"><\/div><\/div>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-db2e1c4 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"db2e1c4\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-9bf4f10 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"9bf4f10\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;gradient&quot;,&quot;shape_divider_top&quot;:&quot;mountains&quot;,&quot;shape_divider_bottom&quot;:&quot;mountains&quot;}\">\n\t\t\t\t\t<div class=\"elementor-shape elementor-shape-top\" data-negative=\"false\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewbox=\"0 0 1000 100\" preserveaspectratio=\"none\">\n\t<path class=\"elementor-shape-fill\" opacity=\"0.33\" d=\"M473,67.3c-203.9,88.3-263.1-34-320.3,0C66,119.1,0,59.7,0,59.7V0h1000v59.7 c0,0-62.1,26.1-94.9,29.3c-32.8,3.3-62.8-12.3-75.8-22.1C806,49.6,745.3,8.7,694.9,4.7S492.4,59,473,67.3z\"\/>\n\t<path class=\"elementor-shape-fill\" opacity=\"0.66\" d=\"M734,67.3c-45.5,0-77.2-23.2-129.1-39.1c-28.6-8.7-150.3-10.1-254,39.1 s-91.7-34.4-149.2,0C115.7,118.3,0,39.8,0,39.8V0h1000v36.5c0,0-28.2-18.5-92.1-18.5C810.2,18.1,775.7,67.3,734,67.3z\"\/>\n\t<path class=\"elementor-shape-fill\" d=\"M766.1,28.9c-200-57.5-266,65.5-395.1,19.5C242,1.8,242,5.4,184.8,20.6C128,35.8,132.3,44.9,89.9,52.5C28.6,63.7,0,0,0,0 h1000c0,0-9.9,40.9-83.6,48.1S829.6,47,766.1,28.9z\"\/>\n<\/svg>\t\t<\/div>\n\t\t\t\t<div class=\"elementor-shape elementor-shape-bottom\" data-negative=\"false\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewbox=\"0 0 1000 100\" preserveaspectratio=\"none\">\n\t<path class=\"elementor-shape-fill\" opacity=\"0.33\" d=\"M473,67.3c-203.9,88.3-263.1-34-320.3,0C66,119.1,0,59.7,0,59.7V0h1000v59.7 c0,0-62.1,26.1-94.9,29.3c-32.8,3.3-62.8-12.3-75.8-22.1C806,49.6,745.3,8.7,694.9,4.7S492.4,59,473,67.3z\"\/>\n\t<path class=\"elementor-shape-fill\" opacity=\"0.66\" d=\"M734,67.3c-45.5,0-77.2-23.2-129.1-39.1c-28.6-8.7-150.3-10.1-254,39.1 s-91.7-34.4-149.2,0C115.7,118.3,0,39.8,0,39.8V0h1000v36.5c0,0-28.2-18.5-92.1-18.5C810.2,18.1,775.7,67.3,734,67.3z\"\/>\n\t<path class=\"elementor-shape-fill\" d=\"M766.1,28.9c-200-57.5-266,65.5-395.1,19.5C242,1.8,242,5.4,184.8,20.6C128,35.8,132.3,44.9,89.9,52.5C28.6,63.7,0,0,0,0 h1000c0,0-9.9,40.9-83.6,48.1S829.6,47,766.1,28.9z\"\/>\n<\/svg>\t\t<\/div>\n\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-b3f9623\" data-id=\"b3f9623\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-230fb91 elementor-invisible elementor-widget elementor-widget-image\" data-id=\"230fb91\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;}\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/schedulejs.com\/wp-content\/uploads\/elementor\/thumbs\/custom-py89yugwrzkqh9kg26v5otencnin6arm038wldm274.png\" title=\"Schedulejs viewer gantt\" alt=\"Schedulejs viewer gantt\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-9b38a48 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"9b38a48\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;gradient&quot;,&quot;shape_divider_top&quot;:&quot;mountains&quot;}\">\n\t\t\t\t\t<div class=\"elementor-shape elementor-shape-top\" data-negative=\"false\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewbox=\"0 0 1000 100\" preserveaspectratio=\"none\">\n\t<path class=\"elementor-shape-fill\" opacity=\"0.33\" d=\"M473,67.3c-203.9,88.3-263.1-34-320.3,0C66,119.1,0,59.7,0,59.7V0h1000v59.7 c0,0-62.1,26.1-94.9,29.3c-32.8,3.3-62.8-12.3-75.8-22.1C806,49.6,745.3,8.7,694.9,4.7S492.4,59,473,67.3z\"\/>\n\t<path class=\"elementor-shape-fill\" opacity=\"0.66\" d=\"M734,67.3c-45.5,0-77.2-23.2-129.1-39.1c-28.6-8.7-150.3-10.1-254,39.1 s-91.7-34.4-149.2,0C115.7,118.3,0,39.8,0,39.8V0h1000v36.5c0,0-28.2-18.5-92.1-18.5C810.2,18.1,775.7,67.3,734,67.3z\"\/>\n\t<path class=\"elementor-shape-fill\" d=\"M766.1,28.9c-200-57.5-266,65.5-395.1,19.5C242,1.8,242,5.4,184.8,20.6C128,35.8,132.3,44.9,89.9,52.5C28.6,63.7,0,0,0,0 h1000c0,0-9.9,40.9-83.6,48.1S829.6,47,766.1,28.9z\"\/>\n<\/svg>\t\t<\/div>\n\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-693262b\" data-id=\"693262b\" data-element_type=\"column\" data-settings=\"{&quot;background_background&quot;:&quot;gradient&quot;}\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-74339fd elementor-invisible elementor-widget elementor-widget-elementskit-button\" data-id=\"74339fd\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInLeft&quot;}\" data-widget_type=\"elementskit-button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<div class=\"ekit-wid-con\" >\t\t<div class=\"ekit-btn-wraper\">\n\t\t\t\t\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/blog\/\" class=\"elementskit-btn  whitespace--normal\" >\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\tRetour au blog\t\t\t\t<\/a>\n\t\t\t\t\t\t<\/div>\n        <\/div>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6a689bad elementor-invisible elementor-widget elementor-widget-heading\" data-id=\"6a689bad\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInLeft&quot;}\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h1 class=\"elementor-heading-title elementor-size-xl\">Rendu dynamique : Niveau de zoom<\/h1>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-452009b6 elementor-invisible elementor-widget elementor-widget-text-editor\" data-id=\"452009b6\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInLeft&quot;}\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<p>Les rendus peuvent s'adapter de mani\u00e8re programmatique \u00e0 l'\u00e9tat de l'application et donner lieu \u00e0 diff\u00e9rentes mani\u00e8res de dessiner vos activit\u00e9s. Cet article couvre le AssignmentActivityRenderer impl\u00e9ment\u00e9 dans le ScheduleJS Viewer et explique ses m\u00e9canismes.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-344eb0c elementor-invisible elementor-widget elementor-widget-heading\" data-id=\"344eb0c\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInRight&quot;,&quot;_animation_delay&quot;:600}\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h6 class=\"elementor-heading-title elementor-size-default\">Monday, June 5th, 2023 - 3 minutes read<\/h6>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-13c5fd21 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"13c5fd21\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-1b6ca9da\" data-id=\"1b6ca9da\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-abd97a4 elementor-invisible elementor-widget elementor-widget-text-editor\" data-id=\"abd97a4\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;}\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<h2 style=\"color: #181926; margin-bottom: 25px;\">Qu'est-ce qu'un moteur de rendu ScheduleJS ?\u00a0<\/h2><p>Le concept d'une <code>ActivityRenderer<\/code> repr\u00e9sente un moteur de rendu enfichable d\u00e9di\u00e9 au dessin d'activit\u00e9s. Il se concentre sur le rendu de n'importe quel type de donn\u00e9es dans une ligne. En g\u00e9n\u00e9ral, les moteurs de rendu contiennent des strat\u00e9gies de dessin li\u00e9es aux activit\u00e9s. Il convient de noter que le moteur de rend <code>ActivityRenderer<\/code> \u00e9tend la classe <code>Renderer<\/code> classe. Cette architecture permet au d\u00e9veloppeur d'affiner sa strat\u00e9gie de dessin \u00e0 plusieurs niveaux tout en donnant acc\u00e8s \u00e0 des m\u00e9thodes de calcul de temps et de position qui l'aideront.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c9b9988 elementor-invisible elementor-widget elementor-widget-text-editor\" data-id=\"c9b9988\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;}\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<h2 style=\"color: #181926; margin-bottom: 25px;\">La classe ScheduleJS ActivityRenderer<\/h2><p>Vous trouverez ci-dessous un exemple de cr\u00e9ation d'un moteur de rendu d'activit\u00e9 dans ScheduleJS :\u00a0<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-61ac5dc elementor-invisible elementor-widget elementor-widget-text-editor\" data-id=\"61ac5dc\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;}\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<p>Voici la liste des trois classes de rendu d'activit\u00e9 avanc\u00e9es que vous pouvez \u00e9tendre pour commencer \u00e0 cr\u00e9er votre propre rendu plus rapidement :<\/p><ul><li><code>ActivityBarRenderer<\/code>: utilis\u00e9 dans les sch\u00e9mas de Gantt, il repr\u00e9sente une barre sur le graphique.<\/li><li><code>ChartActivityRenderer<\/code>: traite les dessins li\u00e9s \u00e0 des graphiques avec une dimension verticale<\/li><li><code>CalendarActivityRenderer<\/code>: le syst\u00e8me d'information sur les droits de propri\u00e9t\u00e9 intellectuelle (DPI) est un syst\u00e8me d'information sur les droits de propri\u00e9t\u00e9 intellectuelle (DPI).<\/li><\/ul><p>Une fois que vous avez con\u00e7u votre moteur de rendu, vous pouvez l'enregistrer \u00e0 l'aide de l'API graphique :<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-dbb9ec0 elementor-invisible elementor-widget elementor-widget-text-editor\" data-id=\"dbb9ec0\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;}\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<h2 style=\"color: #181926; margin-bottom: 25px;\">Conception d'un ActivityRenderer dynamique au niveau du zoom<\/h2><p>Tous les <code>ActivityRenderer<\/code> d\u00e9clenche le moteur de dessin interne de ScheduleJS pour dessiner les activit\u00e9s \u00e0 l'\u00e9cran, ce qui permet au d\u00e9veloppeur de se concentrer sur les d\u00e9cisions de haut niveau de l'application. La strat\u00e9gie consiste \u00e0 d\u00e9clencher automatiquement le moins de red\u00e9coupages possible lorsque vous travaillez sur les graphiques. Vous pouvez \u00e9galement demander des redessins manuels pour des cas d'utilisation sp\u00e9cifiques tels que le chargement de donn\u00e9es, les mises \u00e0 jour en temps r\u00e9el et les relations indirectes. Cela permet au d\u00e9veloppeur d'optimiser la strat\u00e9gie de rendu et d'offrir une meilleure r\u00e9solution et de meilleures performances.<\/p><p>Cet article se concentre sur les <code>AssignmentActivityRenderer<\/code> de la visionneuse ScheduleJS.<\/p><p>Comme vous pouvez le voir ci-dessous, le <code>AssignmentActivityRenderer<\/code> est un simple moteur de rendu qui dessine des nombres sur le canevas pour indiquer les unit\u00e9s budg\u00e9t\u00e9es et les unit\u00e9s r\u00e9elles d'un projet ou d'une t\u00e2che.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-b4f0f27 elementor-widget elementor-widget-image\" data-id=\"b4f0f27\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"375\" src=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2023\/06\/assignment-renderer.gif\" class=\"attachment-large size-large\" alt=\"big table gantt\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7d3c3d1 elementor-invisible elementor-widget elementor-widget-text-editor\" data-id=\"7d3c3d1\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;}\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<p>En fonction du niveau de zoom, nous voulons visualiser les affectations des unit\u00e9s d'affaires par jour, par semaine et par mois. Pour mettre cela en \u0153uvre de mani\u00e8re simple, nous nous sommes appuy\u00e9s sur les puissantes structures de donn\u00e9es internes de ScheduleJS et avons d\u00e9cid\u00e9 de calculer les activit\u00e9s suppl\u00e9mentaires pour tous les intervalles de temps disponibles.<\/p><p>La structure de donn\u00e9es .xer n'indique que les valeurs journali\u00e8res. Nous avons donc d\u00fb cr\u00e9er les valeurs hebdomadaires et mensuelles en regroupant les valeurs journali\u00e8res correspondantes. Pour ce faire, la visionneuse ScheduleJS utilise une balise <code>temporalUnit<\/code> dans son champ <code>AssignmentActivity<\/code> pour indiquer quel mod\u00e8le de <code>AssignmentActivity<\/code> correspond \u00e0 laquelle <code>ChronoUnit<\/code>.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-23a0aa1 elementor-invisible elementor-widget elementor-widget-text-editor\" data-id=\"23a0aa1\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;}\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<p>Nous devons maintenant indiquer au moteur de rendu quelle r\u00e9solution est actuellement utilis\u00e9e. Pour ce faire, l'API Dateline est tr\u00e8s utile.<\/p><p>Comme vous pouvez le voir ci-dessous, la ligne de base est compos\u00e9e de deux lignes :<\/p><ul><li>La premi\u00e8re ligne de cellules donne des informations sur la p\u00e9riode en cours (ex : Semaine 49, lundi 29 novembre 2021).<\/li><li>La deuxi\u00e8me rang\u00e9e de cellules d\u00e9compose la cellule sup\u00e9rieure en plusieurs cellules plus petites (ex : Jour 29).<\/li><\/ul>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f090363 elementor-widget elementor-widget-image\" data-id=\"f090363\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"483\" height=\"167\" src=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2023\/06\/dateline.png\" class=\"attachment-large size-large\" alt=\"Date Line to add new gantt\" srcset=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2023\/06\/dateline.png 483w, https:\/\/schedulejs.com\/wp-content\/uploads\/2023\/06\/dateline-300x104.png 300w, https:\/\/schedulejs.com\/wp-content\/uploads\/2023\/06\/dateline-18x6.png 18w\" sizes=\"auto, (max-width: 483px) 100vw, 483px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ba64e3f elementor-invisible elementor-widget elementor-widget-text-editor\" data-id=\"ba64e3f\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;}\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<p>Pour dessiner nos activit\u00e9s sous forme de texte, nous utiliserons le Canvas <code>ctx.fillText<\/code> methode.<\/p><p>Now, to select which activity has to be drawn at any time, we decide to trigger this method conditionally after we confirmed the activity <code>temporalUnit<\/code> is the same temporal unit used by the Dateline 2nd row cells. As the renderer draws every frame, adding this condition to our renderer will only draw either the Monthly, Weekly, or Daily <code>AssignmentActivities<\/code> \u00e0 un moment donn\u00e9.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-9e60f03 elementor-invisible elementor-widget elementor-widget-text-editor\" data-id=\"9e60f03\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;}\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<h2 style=\"color: #181926; margin-bottom: 25px;\">Quelques mots sur la structure de donn\u00e9es de ScheduleJS<\/h2><p>Les graphiques de ScheduleJS sont con\u00e7us pour prendre en charge des millions d'activit\u00e9s \u00e0 tout moment. Pour s'assurer que nos graphiques conservent les meilleures performances possibles, ScheduleJS met en \u0153uvre une repr\u00e9sentation arborescente binaire des donn\u00e9es en m\u00e9moire afin d'acc\u00e9der rapidement \u00e0 tout n\u0153ud d'activit\u00e9 et de r\u00e9duire le temps de traitement.<\/p><p>La mise en \u0153uvre d\u00e9crite ci-dessus tire parti de cette caract\u00e9ristique pour calculer et stocker toutes les informations requises pour les graphiques avant l'ex\u00e9cution afin d'am\u00e9liorer encore la fluidit\u00e9 de la navigation.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-cae20cf elementor-widget elementor-widget-image\" data-id=\"cae20cf\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"412\" height=\"249\" src=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2022\/11\/interval-tree.png\" class=\"attachment-large size-large\" alt=\"Tree Gantt\" srcset=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2022\/11\/interval-tree.png 412w, https:\/\/schedulejs.com\/wp-content\/uploads\/2022\/11\/interval-tree-300x181.png 300w, https:\/\/schedulejs.com\/wp-content\/uploads\/2022\/11\/interval-tree-18x12.png 18w\" sizes=\"auto, (max-width: 412px) 100vw, 412px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6a6916c elementor-invisible elementor-widget elementor-widget-text-editor\" data-id=\"6a6916c\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;}\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<p>Cet exemple est un cas simple d'utilisation d'un moteur de rendu dynamique. Le niveau de zoom n'est qu'une des variables publiques que l'on peut trouver dans une application ScheduleJS. La m\u00eame logique peut \u00eatre appliqu\u00e9e \u00e0 n'importe quelle variable externe pour dessiner de mani\u00e8re conditionnelle et construire votre propre interface utilisateur et votre propre exp\u00e9rience.\u00a0<\/p><div style=\"text-align: center; margin-top: 45px; margin-bottom: 20px;\"><strong>S'il vous pla\u00eet <a href=\"https:\/\/schedulejs.com\/fr\/contact\/\">nous contacter<\/a> si vous avez des d\u00e9fis UX\/UI ou des id\u00e9es pour ScheduleJS !<\/strong><\/div>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-f2eace9 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"f2eace9\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;gradient&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-8bea6f0\" data-id=\"8bea6f0\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-629ebc3 elementor-invisible elementor-widget elementor-widget-heading\" data-id=\"629ebc3\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInRight&quot;}\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Plus d'articles li\u00e9s \u00e0 ScheduleJS Viewer<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-ddc14ce elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"ddc14ce\" data-element_type=\"section\" data-settings=\"{&quot;shape_divider_top&quot;:&quot;mountains&quot;}\">\n\t\t\t\t\t<div class=\"elementor-shape elementor-shape-top\" data-negative=\"false\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewbox=\"0 0 1000 100\" preserveaspectratio=\"none\">\n\t<path class=\"elementor-shape-fill\" opacity=\"0.33\" d=\"M473,67.3c-203.9,88.3-263.1-34-320.3,0C66,119.1,0,59.7,0,59.7V0h1000v59.7 c0,0-62.1,26.1-94.9,29.3c-32.8,3.3-62.8-12.3-75.8-22.1C806,49.6,745.3,8.7,694.9,4.7S492.4,59,473,67.3z\"\/>\n\t<path class=\"elementor-shape-fill\" opacity=\"0.66\" d=\"M734,67.3c-45.5,0-77.2-23.2-129.1-39.1c-28.6-8.7-150.3-10.1-254,39.1 s-91.7-34.4-149.2,0C115.7,118.3,0,39.8,0,39.8V0h1000v36.5c0,0-28.2-18.5-92.1-18.5C810.2,18.1,775.7,67.3,734,67.3z\"\/>\n\t<path class=\"elementor-shape-fill\" d=\"M766.1,28.9c-200-57.5-266,65.5-395.1,19.5C242,1.8,242,5.4,184.8,20.6C128,35.8,132.3,44.9,89.9,52.5C28.6,63.7,0,0,0,0 h1000c0,0-9.9,40.9-83.6,48.1S829.6,47,766.1,28.9z\"\/>\n<\/svg>\t\t<\/div>\n\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-410297c\" data-id=\"410297c\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-fe84f8c premium-blog-align-left premium-blog-align-left elementor-invisible elementor-widget elementor-widget-premium-addon-blog\" data-id=\"fe84f8c\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInRight&quot;}\" data-widget_type=\"premium-addon-blog.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t<div class=\"premium-blog\">\n\t\t\t\t<div class=\"premium-blog-wrap  premium-blog-even\" data-scroll=\"1\" data-infinite=\"\" data-layout=\"even\" data-equal=\"true\" data-page=\"11149\" data-carousel=\"1\" data-grid=\"true\" data-fade=\"false\" data-play=\"1\" data-center=\"false\" data-slides-spacing=\"0\" data-speed=\"8000\" data-col=\"3\" data-col-tablet=\"2\" data-col-mobile=\"1\" data-arrows=\"true\" data-dots=\"true\" data-scroll-slides=\"\">\n\t\t\t\t\t<div class=\"premium-blog-post-outer-container\" data-total=\"1\">\n\t\t\t<div class=\"premium-blog-post-container premium-blog-skin-classic\">\n\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumb-effect-wrapper\">\n\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-container premium-blog-zoomin-effect\">\n\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"2880\" height=\"1800\" src=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2022\/11\/tree-architecture.png\" class=\"attachment-full size-full\" alt=\"schedulejs viewer\" \/>\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-overlay\">\n\t\t\t\t\t\t\t\t<a class=\"elementor-icon\" href=\"https:\/\/schedulejs.com\/fr\/building-a-tree-gantt\/\" target=\"_self\"><\/a>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-content-wrapper\">\n\t\t\t\t\t<div class=\"premium-blog-content-wrapper-inner\">\n\t\t\t\t\t\t<div class=\"premium-blog-inner-container\">\n\t\t\t\t\t\t\t<div class=\"premium-blog-entry-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h2 class=\"premium-blog-entry-title\">\n\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/building-a-tree-gantt\/\" target=\"_self\">\n\t\t\t\tConstruire un arbre de Gantt\t\t\t<\/a>\n\t\t<\/h2>\n\t\t\t\t<div class=\"premium-blog-entry-meta\">\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-time premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-clock-o\"><\/i>\n\t\t\t\t\t<span>novembre 24, 2022<\/span>\n\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-categories premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-align-left fa-fw\"><\/i>\n\t\t\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/category\/implementations\/\" rel=\"category tag\">Impl\u00e9mentations<\/a>, <a href=\"https:\/\/schedulejs.com\/fr\/category\/schedulejs-viewer\/\" rel=\"category tag\">ScheduleJS Viewer<\/a>\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<p class=\"premium-blog-post-content\">Cet article vous montrera comment a \u00e9t\u00e9 construite l'architecture de l'arbre de Gantt parent-enfant dans le ScheduleJS Viewer.<\/p>\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t\t\t<div class=\"premium-blog-post-outer-container\" data-total=\"1\">\n\t\t\t<div class=\"premium-blog-post-container premium-blog-skin-classic\">\n\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumb-effect-wrapper\">\n\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-container premium-blog-zoomin-effect\">\n\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"2880\" height=\"1800\" src=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2022\/11\/gantt.png\" class=\"attachment-full size-full\" alt=\"Schedulejs viewer gantt\" \/>\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-overlay\">\n\t\t\t\t\t\t\t\t<a class=\"elementor-icon\" href=\"https:\/\/schedulejs.com\/fr\/activity-renderer-in-javascript\/\" target=\"_self\"><\/a>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-content-wrapper\">\n\t\t\t\t\t<div class=\"premium-blog-content-wrapper-inner\">\n\t\t\t\t\t\t<div class=\"premium-blog-inner-container\">\n\t\t\t\t\t\t\t<div class=\"premium-blog-entry-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h2 class=\"premium-blog-entry-title premium-blog-entry-title\">\n\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/activity-renderer-in-javascript\/\" target=\"_self\">\n\t\t\t\tConstruire un ActivityRenderer\t\t\t<\/a>\n\t\t<\/h2>\n\t\t\t\t<div class=\"premium-blog-entry-meta\">\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-time premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-clock-o\"><\/i>\n\t\t\t\t\t<span>novembre 23, 2022<\/span>\n\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-categories premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-align-left fa-fw\"><\/i>\n\t\t\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/category\/implementations\/\" rel=\"category tag\">Impl\u00e9mentations<\/a>, <a href=\"https:\/\/schedulejs.com\/fr\/category\/schedulejs-viewer\/\" rel=\"category tag\">ScheduleJS Viewer<\/a>\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<p class=\"premium-blog-post-content\">Cet article montre comment le moteur de rendu de l'activit\u00e9 principale du ScheduleJS Viewer a \u00e9t\u00e9 construit \u00e0 l'aide d'exemples de code.<\/p>\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t\t\t<div class=\"premium-blog-post-outer-container\" data-total=\"1\">\n\t\t\t<div class=\"premium-blog-post-container premium-blog-skin-classic\">\n\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumb-effect-wrapper\">\n\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-container premium-blog-zoomin-effect\">\n\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"2880\" height=\"1800\" src=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2022\/11\/grouping-1.png\" class=\"attachment-full size-full\" alt=\"Schedulejs viewer gantt\" \/>\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-overlay\">\n\t\t\t\t\t\t\t\t<a class=\"elementor-icon\" href=\"https:\/\/schedulejs.com\/fr\/schedulejs-viewer-features\/\" target=\"_self\"><\/a>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-content-wrapper\">\n\t\t\t\t\t<div class=\"premium-blog-content-wrapper-inner\">\n\t\t\t\t\t\t<div class=\"premium-blog-inner-container\">\n\t\t\t\t\t\t\t<div class=\"premium-blog-entry-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h2 class=\"premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title\">\n\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/schedulejs-viewer-features\/\" target=\"_self\">\n\t\t\t\tCaract\u00e9ristiques de ScheduleJS Viewer\t\t\t<\/a>\n\t\t<\/h2>\n\t\t\t\t<div class=\"premium-blog-entry-meta\">\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-time premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-clock-o\"><\/i>\n\t\t\t\t\t<span>novembre 21, 2022<\/span>\n\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-categories premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-align-left fa-fw\"><\/i>\n\t\t\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/category\/schedulejs-viewer\/\" rel=\"category tag\">ScheduleJS Viewer<\/a>\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<p class=\"premium-blog-post-content\">Cet article pr\u00e9sente les principales fonctionnalit\u00e9s du ScheduleJS Viewer. Une toute nouvelle visionneuse de projets bas\u00e9e sur le web.<\/p>\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t\t\t<\/div>\n\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-b325336 elementor-widget elementor-widget-shortcode\" data-id=\"b325336\" data-element_type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"elementor-shortcode\">    <div class=\"wpdiscuz_top_clearing\"><\/div>\r\n    <div id='comments' class='comments-area'><div id='respond' style='width: 0;height: 0;clear: both;margin: 0;padding: 0;'><\/div>    <div id=\"wpdcom\" class=\"wpdiscuz_unauth wpd-default wpd-layout-1 wpd-comments-open\">\r\n                    <div class=\"wc_social_plugin_wrapper\">\r\n                            <\/div>\r\n            <div class=\"wpd-form-wrap\">\r\n                <div class=\"wpd-form-head\">\r\n                                            <div class=\"wpd-sbs-toggle\">\r\n                            <i class=\"far fa-envelope\"><\/i> <span class=\"wpd-sbs-title\">S\u2019abonner<\/span> <i class=\"fas fa-caret-down\"><\/i>\r\n                        <\/div>\r\n                                            <div class=\"wpd-auth\">\r\n                                                <div class=\"wpd-login\">\r\n                            <a rel=\"nofollow\" href=\"https:\/\/schedulejs.com\/wp-login.php?redirect_to=https%3A%2F%2Fschedulejs.com%2Ffr%2Fschedulejs-viewer-features%2F\"><i class='fas fa-sign-in-alt'><\/i> Connexion<\/a>                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n                                                    <div class=\"wpdiscuz-subscribe-bar wpdiscuz-hidden\">\r\n                                                    <form action=\"https:\/\/schedulejs.com\/wp-admin\/admin-ajax.php?action=wpdAddSubscription\" method=\"post\" id=\"wpdiscuz-subscribe-form\">\r\n                                <div class=\"wpdiscuz-subscribe-form-intro\">Notification pour <\/div>\r\n                                <div class=\"wpdiscuz-subscribe-form-option\" style=\"width:40%;\">\r\n                                    <select class=\"wpdiscuz_select\" name=\"wpdiscuzSubscriptionType\" >\r\n                                                                                    <option value=\"post\">nouveaux commentaires de suivi<\/option>\r\n                                                                                                                                <option value=\"all_comment\" >nouvelles r\u00e9ponses \u00e0 mes commentaires<\/option>\r\n                                                                                <\/select>\r\n                                <\/div>\r\n                                                                    <div class=\"wpdiscuz-item wpdiscuz-subscribe-form-email\">\r\n                                        <input  class=\"email\" type=\"email\" name=\"wpdiscuzSubscriptionEmail\" required=\"required\" value=\"\" placeholder=\"E-mail\"\/>\r\n                                    <\/div>\r\n                                                                    <div class=\"wpdiscuz-subscribe-form-button\">\r\n                                    <input id=\"wpdiscuz_subscription_button\" class=\"wpd-prim-button wpd_not_clicked\" type=\"submit\" value=\"\u203a\" name=\"wpdiscuz_subscription_button\" \/>\r\n                                <\/div> \r\n                                <input type=\"hidden\" id=\"wpdiscuz_subscribe_form_nonce\" name=\"wpdiscuz_subscribe_form_nonce\" value=\"4b13503646\" \/><input type=\"hidden\" name=\"_wp_http_referer\" value=\"\/fr\/wp-json\/wp\/v2\/posts\/11149\" \/>                            <\/form>\r\n                                                <\/div>\r\n                            <div class=\"wpd-form wpd-form-wrapper wpd-main-form-wrapper\" id='wpd-main-form-wrapper-0_0'>\r\n                                        <form class=\"wpd_comm_form wpd_main_comm_form\"\r\n                      method=\"post\" enctype=\"multipart\/form-data\" data-uploading=\"false\" action=\"\">\r\n                    <div class=\"wpd-field-comment\">\r\n                        <div class=\"wpdiscuz-item wc-field-textarea\">\r\n                            <div class=\"wpdiscuz-textarea-wrap\">\r\n                                                                                                        <div class=\"wpd-avatar\">\r\n                                        <img alt='guest' src='https:\/\/secure.gravatar.com\/avatar\/?s=56&#038;d=mm&#038;r=g' srcset='https:\/\/secure.gravatar.com\/avatar\/?s=112&#038;d=mm&#038;r=g 2x' class='avatar avatar-56 photo avatar-default' height='56' width='56' \/>                                    <\/div>\r\n                                                <div id=\"wpd-editor-wraper-0_0\" style=\"display: none;\">\r\n                <div id=\"wpd-editor-char-counter-0_0\"\r\n                     class=\"wpd-editor-char-counter\"><\/div>\r\n                <label style=\"display: none;\" for=\"wc-textarea-0_0\">Label<\/label>\r\n                <textarea id=\"wc-textarea-0_0\" name=\"wc_comment\"\r\n                          class=\"wc_comment wpd-field\"><\/textarea>\r\n                <div id=\"wpd-editor-0_0\"><\/div>\r\n                        <div id=\"wpd-editor-toolbar-0_0\">\r\n                            <button title=\"En gras\"\r\n                        class=\"ql-bold\"  ><\/button>\r\n                                <button title=\"Italique\"\r\n                        class=\"ql-italic\"  ><\/button>\r\n                                <button title=\"Soulign\u00e9\"\r\n                        class=\"ql-underline\"  ><\/button>\r\n                                <button title=\"Barr\u00e9\"\r\n                        class=\"ql-strike\"  ><\/button>\r\n                                <button title=\"Liste ordonn\u00e9e\"\r\n                        class=\"ql-list\" value='ordered' ><\/button>\r\n                                <button title=\"Liste non ordonn\u00e9e\"\r\n                        class=\"ql-list\" value='bullet' ><\/button>\r\n                                <button title=\"Bloc de citation\"\r\n                        class=\"ql-blockquote\"  ><\/button>\r\n                                <button title=\"Bloc de code\"\r\n                        class=\"ql-code-block\"  ><\/button>\r\n                                <button title=\"Lien\"\r\n                        class=\"ql-link\"  ><\/button>\r\n                                <button title=\"Code source\"\r\n                        class=\"ql-sourcecode\"  data-wpde_button_name='sourcecode'>{}<\/button>\r\n                                <button title=\"Spoiler\"\r\n                        class=\"ql-spoiler\"  data-wpde_button_name='spoiler'>[+]<\/button>\r\n                            <div class=\"wpd-editor-buttons-right\">\r\n                <span class='wmu-upload-wrap' wpd-tooltip='Attacher une image \u00e0 ce commentaire' wpd-tooltip-position='left'><label class='wmu-add'><i class='far fa-image'><\/i><input style='display:none;' class='wmu-add-files' type='file' name='wmu_files[]'  accept='image\/*'\/><\/label><\/span>            <\/div>\r\n        <\/div>\r\n                    <\/div>\r\n                                        <\/div>\r\n                        <\/div>\r\n                    <\/div>\r\n                    <div class=\"wpd-form-foot\" style='display:none;'>\r\n                        <div class=\"wpdiscuz-textarea-foot\">\r\n                                                        <div class=\"wpdiscuz-button-actions\"><div class='wmu-action-wrap'><div class='wmu-tabs wmu-images-tab wmu-hide'><\/div><\/div><\/div>\r\n                        <\/div>\r\n                                <div class=\"wpd-form-row\">\r\n                    <div class=\"wpd-form-col-left\">\r\n                        <div class=\"wpdiscuz-item wc_name-wrapper wpd-has-icon\">\r\n                                    <div class=\"wpd-field-icon\"><i class=\"fas fa-user\"><\/i><\/div>\r\n                                    <input id=\"wc_name-0_0\" value=\"\" required='required' aria-required='true' class=\"wc_name wpd-field\" type=\"text\" name=\"wc_name\" placeholder=\"Nom*\" maxlength=\"50\" pattern='.{3,50}' title=\"\">\r\n                <label for=\"wc_name-0_0\" class=\"wpdlb\">Nom*<\/label>\r\n                            <\/div>\r\n                        <div class=\"wpdiscuz-item wc_email-wrapper wpd-has-icon\">\r\n                                    <div class=\"wpd-field-icon\"><i class=\"fas fa-at\"><\/i><\/div>\r\n                                    <input id=\"wc_email-0_0\" value=\"\" required='required' aria-required='true' class=\"wc_email wpd-field\" type=\"email\" name=\"wc_email\" placeholder=\"E-mail*\" \/>\r\n                <label for=\"wc_email-0_0\" class=\"wpdlb\">E-mail*<\/label>\r\n                            <\/div>\r\n                            <div class=\"wpdiscuz-item wc_website-wrapper wpd-has-icon\">\r\n                                            <div class=\"wpd-field-icon\"><i class=\"fas fa-link\"><\/i><\/div>\r\n                                        <input id=\"wc_website-0_0\" value=\"\" class=\"wc_website wpd-field\" type=\"text\" name=\"wc_website\" placeholder=\"Site web\" \/>\r\n                    <label for=\"wc_website-0_0\" class=\"wpdlb\">Site web<\/label>\r\n                                    <\/div>\r\n                        <\/div>\r\n                <div class=\"wpd-form-col-right\">\r\n                    <div class=\"wc-field-submit\">\r\n                                            \r\n                                            <label class=\"wpd_label\" wpd-tooltip=\"Notifier des nouvelles r\u00e9ponses \u00e0 tous mes commentaires\">\r\n                            <input id=\"wc_notification_new_comment-0_0\" class=\"wc_notification_new_comment-0_0 wpd_label__checkbox\" value=\"comment\" type=\"checkbox\" name=\"wpdiscuz_notification_type\" \/>\r\n                            <span class=\"wpd_label__text\">\r\n                                <span class=\"wpd_label__check\">\r\n                                    <i class=\"fas fa-bell wpdicon wpdicon-on\"><\/i>\r\n                                    <i class=\"fas fa-bell-slash wpdicon wpdicon-off\"><\/i>\r\n                                <\/span>\r\n                            <\/span>\r\n                        <\/label>\r\n                                                                <input id=\"wpd-field-submit-0_0\" class=\"wc_comm_submit wpd_not_clicked wpd-prim-button\" type=\"submit\" name=\"submit\" value=\"Publier le commentaire\" \/>\r\n        <\/div>\r\n                <\/div>\r\n                    <div class=\"clearfix\"><\/div>\r\n        <\/div>\r\n                            <\/div>\r\n                                        <input type=\"hidden\" class=\"wpdiscuz_unique_id\" value=\"0_0\"\r\n                           name=\"wpdiscuz_unique_id\">\r\n                                    <input type=\"hidden\" name=\"trp-form-language\" value=\"fr\"\/><\/form>\r\n                        <\/div>\r\n                <div id=\"wpdiscuz_hidden_secondary_form\" style=\"display: none;\">\r\n                    <div class=\"wpd-form wpd-form-wrapper wpd-secondary-form-wrapper\" id='wpd-secondary-form-wrapper-wpdiscuzuniqueid' style='display: none;'>\r\n                            <div class=\"wpd-secondary-forms-social-content\"><\/div>\r\n                <div class=\"clearfix\"><\/div>\r\n                                        <form class=\"wpd_comm_form wpd-secondary-form-wrapper\"\r\n                      method=\"post\" enctype=\"multipart\/form-data\" data-uploading=\"false\" action=\"\">\r\n                    <div class=\"wpd-field-comment\">\r\n                        <div class=\"wpdiscuz-item wc-field-textarea\">\r\n                            <div class=\"wpdiscuz-textarea-wrap\">\r\n                                                                                                        <div class=\"wpd-avatar\">\r\n                                        <img alt='guest' src='https:\/\/secure.gravatar.com\/avatar\/?s=56&#038;d=mm&#038;r=g' srcset='https:\/\/secure.gravatar.com\/avatar\/?s=112&#038;d=mm&#038;r=g 2x' class='avatar avatar-56 photo avatar-default' height='56' width='56' \/>                                    <\/div>\r\n                                                <div id=\"wpd-editor-wraper-wpdiscuzuniqueid\" style=\"display: none;\">\r\n                <div id=\"wpd-editor-char-counter-wpdiscuzuniqueid\"\r\n                     class=\"wpd-editor-char-counter\"><\/div>\r\n                <label style=\"display: none;\" for=\"wc-textarea-wpdiscuzuniqueid\">Label<\/label>\r\n                <textarea id=\"wc-textarea-wpdiscuzuniqueid\" name=\"wc_comment\"\r\n                          class=\"wc_comment wpd-field\"><\/textarea>\r\n                <div id=\"wpd-editor-wpdiscuzuniqueid\"><\/div>\r\n                        <div id=\"wpd-editor-toolbar-wpdiscuzuniqueid\">\r\n                            <button title=\"En gras\"\r\n                        class=\"ql-bold\"  ><\/button>\r\n                                <button title=\"Italique\"\r\n                        class=\"ql-italic\"  ><\/button>\r\n                                <button title=\"Soulign\u00e9\"\r\n                        class=\"ql-underline\"  ><\/button>\r\n                                <button title=\"Barr\u00e9\"\r\n                        class=\"ql-strike\"  ><\/button>\r\n                                <button title=\"Liste ordonn\u00e9e\"\r\n                        class=\"ql-list\" value='ordered' ><\/button>\r\n                                <button title=\"Liste non ordonn\u00e9e\"\r\n                        class=\"ql-list\" value='bullet' ><\/button>\r\n                                <button title=\"Bloc de citation\"\r\n                        class=\"ql-blockquote\"  ><\/button>\r\n                                <button title=\"Bloc de code\"\r\n                        class=\"ql-code-block\"  ><\/button>\r\n                                <button title=\"Lien\"\r\n                        class=\"ql-link\"  ><\/button>\r\n                                <button title=\"Code source\"\r\n                        class=\"ql-sourcecode\"  data-wpde_button_name='sourcecode'>{}<\/button>\r\n                                <button title=\"Spoiler\"\r\n                        class=\"ql-spoiler\"  data-wpde_button_name='spoiler'>[+]<\/button>\r\n                            <div class=\"wpd-editor-buttons-right\">\r\n                <span class='wmu-upload-wrap' wpd-tooltip='Attacher une image \u00e0 ce commentaire' wpd-tooltip-position='left'><label class='wmu-add'><i class='far fa-image'><\/i><input style='display:none;' class='wmu-add-files' type='file' name='wmu_files[]'  accept='image\/*'\/><\/label><\/span>            <\/div>\r\n        <\/div>\r\n                    <\/div>\r\n                                        <\/div>\r\n                        <\/div>\r\n                    <\/div>\r\n                    <div class=\"wpd-form-foot\" style='display:none;'>\r\n                        <div class=\"wpdiscuz-textarea-foot\">\r\n                                                        <div class=\"wpdiscuz-button-actions\"><div class='wmu-action-wrap'><div class='wmu-tabs wmu-images-tab wmu-hide'><\/div><\/div><\/div>\r\n                        <\/div>\r\n                                <div class=\"wpd-form-row\">\r\n                    <div class=\"wpd-form-col-left\">\r\n                        <div class=\"wpdiscuz-item wc_name-wrapper wpd-has-icon\">\r\n                                    <div class=\"wpd-field-icon\"><i class=\"fas fa-user\"><\/i><\/div>\r\n                                    <input id=\"wc_name-wpdiscuzuniqueid\" value=\"\" required='required' aria-required='true' class=\"wc_name wpd-field\" type=\"text\" name=\"wc_name\" placeholder=\"Nom*\" maxlength=\"50\" pattern='.{3,50}' title=\"\">\r\n                <label for=\"wc_name-wpdiscuzuniqueid\" class=\"wpdlb\">Nom*<\/label>\r\n                            <\/div>\r\n                        <div class=\"wpdiscuz-item wc_email-wrapper wpd-has-icon\">\r\n                                    <div class=\"wpd-field-icon\"><i class=\"fas fa-at\"><\/i><\/div>\r\n                                    <input id=\"wc_email-wpdiscuzuniqueid\" value=\"\" required='required' aria-required='true' class=\"wc_email wpd-field\" type=\"email\" name=\"wc_email\" placeholder=\"E-mail*\" \/>\r\n                <label for=\"wc_email-wpdiscuzuniqueid\" class=\"wpdlb\">E-mail*<\/label>\r\n                            <\/div>\r\n                            <div class=\"wpdiscuz-item wc_website-wrapper wpd-has-icon\">\r\n                                            <div class=\"wpd-field-icon\"><i class=\"fas fa-link\"><\/i><\/div>\r\n                                        <input id=\"wc_website-wpdiscuzuniqueid\" value=\"\" class=\"wc_website wpd-field\" type=\"text\" name=\"wc_website\" placeholder=\"Site web\" \/>\r\n                    <label for=\"wc_website-wpdiscuzuniqueid\" class=\"wpdlb\">Site web<\/label>\r\n                                    <\/div>\r\n                        <\/div>\r\n                <div class=\"wpd-form-col-right\">\r\n                    <div class=\"wc-field-submit\">\r\n                                            \r\n                                            <label class=\"wpd_label\" wpd-tooltip=\"Notifier des nouvelles r\u00e9ponses \u00e0 tous mes commentaires\">\r\n                            <input id=\"wc_notification_new_comment-wpdiscuzuniqueid\" class=\"wc_notification_new_comment-wpdiscuzuniqueid wpd_label__checkbox\" value=\"comment\" type=\"checkbox\" name=\"wpdiscuz_notification_type\" \/>\r\n                            <span class=\"wpd_label__text\">\r\n                                <span class=\"wpd_label__check\">\r\n                                    <i class=\"fas fa-bell wpdicon wpdicon-on\"><\/i>\r\n                                    <i class=\"fas fa-bell-slash wpdicon wpdicon-off\"><\/i>\r\n                                <\/span>\r\n                            <\/span>\r\n                        <\/label>\r\n                                                                <input id=\"wpd-field-submit-wpdiscuzuniqueid\" class=\"wc_comm_submit wpd_not_clicked wpd-prim-button\" type=\"submit\" name=\"submit\" value=\"Publier le commentaire\" \/>\r\n        <\/div>\r\n                <\/div>\r\n                    <div class=\"clearfix\"><\/div>\r\n        <\/div>\r\n                            <\/div>\r\n                                        <input type=\"hidden\" class=\"wpdiscuz_unique_id\" value=\"wpdiscuzuniqueid\"\r\n                           name=\"wpdiscuz_unique_id\">\r\n                                    <input type=\"hidden\" name=\"trp-form-language\" value=\"fr\"\/><\/form>\r\n                        <\/div>\r\n                <\/div>\r\n                    <\/div>\r\n                        <div id=\"wpd-threads\" class=\"wpd-thread-wrapper\">\r\n                <div class=\"wpd-thread-head\">\r\n                    <div class=\"wpd-thread-info\" data-comments-count=\"2\">\r\n                        <span class='wpdtc' title='2'>2<\/span> Commentaires                    <\/div>\r\n                                        <div class=\"wpd-space\"><\/div>\r\n                    <div class=\"wpd-thread-filter\">\r\n                                                    <div class=\"wpd-filter wpdf-reacted wpd_not_clicked\" wpd-tooltip=\"Commentaire avec le plus de r\u00e9actions\"><i class=\"fas fa-bolt\"><\/i><\/div>\r\n                                                        <div class=\"wpd-filter wpdf-hottest wpd_not_clicked\" wpd-tooltip=\"Fil de commentaire le plus chaud\"><i class=\"fas fa-fire\"><\/i><\/div>\r\n                                                        <div class=\"wpd-filter wpdf-sorting\">\r\n                                                                        <span class=\"wpdiscuz-sort-button wpdiscuz-date-sort-asc wpdiscuz-sort-button-active\" data-sorting=\"oldest\">Le plus ancien<\/span>\r\n                                                                        <i class=\"fas fa-sort-down\"><\/i>\r\n                                <div class=\"wpdiscuz-sort-buttons\">\r\n                                                                            <span class=\"wpdiscuz-sort-button wpdiscuz-date-sort-desc\" data-sorting=\"newest\">Le plus r\u00e9cent<\/span>\r\n                                                                                <span class=\"wpdiscuz-sort-button wpdiscuz-vote-sort-up\" data-sorting=\"by_vote\">Le plus populaire<\/span>\r\n                                                                        <\/div>\r\n                            <\/div>\r\n                                                <\/div>\r\n                <\/div>\r\n                <div class=\"wpd-comment-info-bar\">\r\n                    <div class=\"wpd-current-view\"><i class=\"fas fa-quote-left\"><\/i> Commentaires<\/div>\r\n                    <div class=\"wpd-filter-view-all\">Show all comments<\/div>\r\n                <\/div>\r\n                                <div class=\"wpd-thread-list\">\r\n                    <div id='wpd-comm-70_0' class='comment even thread-even depth-1 wpd-comment wpd_comment_level-1'><div class=\"wpd-comment-wrap wpd-blog-guest\">\r\n    <div class=\"wpd-comment-left\">\r\n    <div class=\"wpd-avatar\">\r\n    <img alt='bast00' src='https:\/\/secure.gravatar.com\/avatar\/cc853959ecaa102f1edfb92e53cb80ddb39f99aad04bf727c1804947d0b89f38?s=64&#038;d=mm&#038;r=g' srcset='https:\/\/secure.gravatar.com\/avatar\/cc853959ecaa102f1edfb92e53cb80ddb39f99aad04bf727c1804947d0b89f38?s=128&#038;d=mm&#038;r=g 2x' class='avatar avatar-64 photo' height='64' width='64' \/>\r\n<\/div>\r\n    \r\n    \r\n<\/div>\r\n    <div id=\"comment-70\" class=\"wpd-comment-right\">\r\n    <div class=\"wpd-comment-header\">\r\n    <div class=\"wpd-comment-author\">\r\n    bast00\r\n<\/div>\r\n    <div class=\"wpd-comment-date\" title=\"June 10, 2024 11:17 am\">\r\n    <i class='far fa-clock' aria-hidden='true'><\/i>\r\n    1 an \r\n<\/div>\r\n    \r\n    <div class=\"wpd-comment-share wpd-hidden wpd-tooltip wpd-top\">\r\n    <i class='fas fa-share-alt' aria-hidden='true'><\/i>\r\n    <div class=\"wpd-tooltip-content\">\r\n        <a class='wc_tw' rel='noreferrer' target='_blank' href='https:\/\/twitter.com\/intent\/tweet?text=I appreciated the explanations of the different activity grouping optio... &url=https%3A%2F%2Fschedulejs.com%2Fen%2Fschedulejs-viewer-features%2F%23comment-70' title='Share on Twitter'><i class='fab fa-twitter wpf-cta' aria-hidden='true'><\/i><\/a><a class='wc_vk' rel='noreferrer' target='_blank' href='https:\/\/vk.com\/share.php?url=https:\/\/schedulejs.com\/fr\/schedulejs-viewer-features\/' title='Share on VKontakte'><i class='fab fa-vk wpf-cta' aria-hidden='true'><\/i><\/a><a class='wc_ok' rel='noreferrer' target='_blank' href='https:\/\/connect.ok.ru\/offer?url=https:\/\/schedulejs.com\/fr\/schedulejs-viewer-features\/' title='Share on Odnoklassniki'><i class='fab fa-odnoklassniki wpf-cta' aria-hidden='true'><\/i><\/a>\r\n    <\/div>\r\n<\/div>\r\n    <div class=\"wpd-space\"><\/div>\r\n    <div class=\"wpd-comment-link wpd-hidden\">\r\n    <span wpd-tooltip='Comment link' wpd-tooltip-position='left'><i class='fas fa-link' aria-hidden='true' data-wpd-clipboard='https:\/\/schedulejs.com\/en\/schedulejs-viewer-features\/#comment-70'><\/i><\/span>\r\n<\/div>\r\n<\/div>\r\n    \r\n    <div class=\"wpd-comment-text\">\r\n    <p>I appreciated the explanations of the different activity grouping options and the additional screens available in the ScheduleJS Viewer. It seems to be a complete tool for managing projects efficiently.<\/p>\n\r\n<\/div>\r\n    <div class=\"wpd-comment-footer\">\r\n    <div class=\"wpd-vote\">\r\n    <div class=\"wpd-vote-up wpd_not_clicked\">\r\n        <svg aria-hidden='true' focusable='false' data-prefix='fas' data-icon='plus' class='svg-inline--fa fa-plus fa-w-14' role='img' xmlns='https:\/\/www.w3.org\/2000\/svg' viewbox='0 0 448 512'><path d='M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z'><\/path><\/svg>\r\n    <\/div>\r\n    <div class='wpd-vote-result' title='0'>0<\/div>\r\n    <div class=\"wpd-vote-down wpd_not_clicked\">\r\n        <svg aria-hidden='true' focusable='false' data-prefix='fas' data-icon='minus' class='svg-inline--fa fa-minus fa-w-14' role='img' xmlns='https:\/\/www.w3.org\/2000\/svg' viewbox='0 0 448 512'><path d='M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z'><\/path><\/svg>\r\n    <\/div>\r\n<\/div>\r\n    <div class=\"wpd-reply-button\">\r\n    <svg xmlns='https:\/\/www.w3.org\/2000\/svg' viewbox='0 0 24 24'><path d='M10 9V5l-7 7 7 7v-4.1c5 0 8.5 1.6 11 5.1-1-5-4-10-11-11z'\/><path d='M0 0h24v24H0z' fill='none'\/><\/svg>\r\n    <span>Answer<\/span>\r\n<\/div>\r\n    <div class=\"wpd-space\"><\/div>\r\n    \r\n    \r\n<\/div>\r\n<\/div>\r\n<\/div><div id='wpdiscuz_form_anchor-70_0'><\/div><\/div><div id='wpd-comm-71_0' class='comment odd alt thread-odd thread-alt depth-1 wpd-comment wpd_comment_level-1'><div class=\"wpd-comment-wrap wpd-blog-guest\">\r\n    <div class=\"wpd-comment-left\">\r\n    <div class=\"wpd-avatar\">\r\n    <img alt='pista45' src='https:\/\/secure.gravatar.com\/avatar\/cc853959ecaa102f1edfb92e53cb80ddb39f99aad04bf727c1804947d0b89f38?s=64&#038;d=mm&#038;r=g' srcset='https:\/\/secure.gravatar.com\/avatar\/cc853959ecaa102f1edfb92e53cb80ddb39f99aad04bf727c1804947d0b89f38?s=128&#038;d=mm&#038;r=g 2x' class='avatar avatar-64 photo' height='64' width='64' \/>\r\n<\/div>\r\n    \r\n    \r\n<\/div>\r\n    <div id=\"comment-71\" class=\"wpd-comment-right\">\r\n    <div class=\"wpd-comment-header\">\r\n    <div class=\"wpd-comment-author\">\r\n    pista45\r\n<\/div>\r\n    <div class=\"wpd-comment-date\" title=\"June 10, 2024 11:20 am\">\r\n    <i class='far fa-clock' aria-hidden='true'><\/i>\r\n    1 an \r\n<\/div>\r\n    \r\n    <div class=\"wpd-comment-share wpd-hidden wpd-tooltip wpd-top\">\r\n    <i class='fas fa-share-alt' aria-hidden='true'><\/i>\r\n    <div class=\"wpd-tooltip-content\">\r\n        <a class='wc_tw' rel='noreferrer' target='_blank' href='https:\/\/twitter.com\/intent\/tweet?text=The activity and assignment screens seem to be very useful for visualiz... &url=https%3A%2F%2Fschedulejs.com%2Fen%2Fschedulejs-viewer-features%2F%23comment-71' title='Share on Twitter'><i class='fab fa-twitter wpf-cta' aria-hidden='true'><\/i><\/a><a class='wc_vk' rel='noreferrer' target='_blank' href='https:\/\/vk.com\/share.php?url=https:\/\/schedulejs.com\/fr\/schedulejs-viewer-features\/' title='Share on VKontakte'><i class='fab fa-vk wpf-cta' aria-hidden='true'><\/i><\/a><a class='wc_ok' rel='noreferrer' target='_blank' href='https:\/\/connect.ok.ru\/offer?url=https:\/\/schedulejs.com\/fr\/schedulejs-viewer-features\/' title='Share on Odnoklassniki'><i class='fab fa-odnoklassniki wpf-cta' aria-hidden='true'><\/i><\/a>\r\n    <\/div>\r\n<\/div>\r\n    <div class=\"wpd-space\"><\/div>\r\n    <div class=\"wpd-comment-link wpd-hidden\">\r\n    <span wpd-tooltip='Comment link' wpd-tooltip-position='left'><i class='fas fa-link' aria-hidden='true' data-wpd-clipboard='https:\/\/schedulejs.com\/en\/schedulejs-viewer-features\/#comment-71'><\/i><\/span>\r\n<\/div>\r\n<\/div>\r\n    \r\n    <div class=\"wpd-comment-text\">\r\n    <p>The activity and assignment screens seem to be very useful for visualizing project data. But how does the functionality for resizing simultaneously open projects work ?<\/p>\n\r\n<\/div>\r\n    <div class=\"wpd-comment-footer\">\r\n    <div class=\"wpd-vote\">\r\n    <div class=\"wpd-vote-up wpd_not_clicked\">\r\n        <svg aria-hidden='true' focusable='false' data-prefix='fas' data-icon='plus' class='svg-inline--fa fa-plus fa-w-14' role='img' xmlns='https:\/\/www.w3.org\/2000\/svg' viewbox='0 0 448 512'><path d='M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z'><\/path><\/svg>\r\n    <\/div>\r\n    <div class='wpd-vote-result' title='0'>0<\/div>\r\n    <div class=\"wpd-vote-down wpd_not_clicked\">\r\n        <svg aria-hidden='true' focusable='false' data-prefix='fas' data-icon='minus' class='svg-inline--fa fa-minus fa-w-14' role='img' xmlns='https:\/\/www.w3.org\/2000\/svg' viewbox='0 0 448 512'><path d='M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z'><\/path><\/svg>\r\n    <\/div>\r\n<\/div>\r\n    <div class=\"wpd-reply-button\">\r\n    <svg xmlns='https:\/\/www.w3.org\/2000\/svg' viewbox='0 0 24 24'><path d='M10 9V5l-7 7 7 7v-4.1c5 0 8.5 1.6 11 5.1-1-5-4-10-11-11z'\/><path d='M0 0h24v24H0z' fill='none'\/><\/svg>\r\n    <span>Answer<\/span>\r\n<\/div>\r\n    <div class=\"wpd-space\"><\/div>\r\n    \r\n    \r\n<\/div>\r\n<\/div>\r\n<\/div><div id='wpdiscuz_form_anchor-71_0'><\/div><\/div><!-- \/\/ From wpDiscuz's Caches \/\/ -->                    <div class=\"wpdiscuz-comment-pagination\">\r\n                                            <\/div>\r\n                <\/div>\r\n            <\/div>\r\n                <\/div>\r\n        <\/div>\r\n    <div id=\"wpdiscuz-loading-bar\" class=\"wpdiscuz-loading-bar-unauth\"><\/div>\r\n    <div id=\"wpdiscuz-comment-message\" class=\"wpdiscuz-comment-message-unauth\"><\/div>\r\n    <\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Cet article montre comment mettre en \u0153uvre un rendu dynamique en fonction du niveau de zoom actuel des graphiques.<\/p>","protected":false},"author":1,"featured_media":10242,"comment_status":"open","ping_status":"open","sticky":false,"template":"elementor_header_footer","format":"standard","meta":{"footnotes":""},"categories":[57,60],"tags":[],"class_list":["post-11149","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-implementations","category-schedulejs-viewer","blog-post blog-spacing"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.5 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Dynamic rendering: Zoom-level<\/title>\n<meta name=\"description\" content=\"This article shows how to implement dynamic rendering depending on the current zoom-level of the graphics.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/schedulejs.com\/fr\/dynamic-rendering-zoom-level\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Dynamic rendering: Zoom-level\" \/>\n<meta property=\"og:description\" content=\"This article shows how to implement dynamic rendering depending on the current zoom-level of the graphics.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/schedulejs.com\/fr\/dynamic-rendering-zoom-level\/\" \/>\n<meta property=\"article:published_time\" content=\"2023-06-05T13:37:02+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-07-02T07:26:11+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2022\/11\/custom.png\" \/>\n\t<meta property=\"og:image:width\" content=\"2880\" \/>\n\t<meta property=\"og:image:height\" content=\"1800\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"wordpress\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@ScheduleJS\" \/>\n<meta name=\"twitter:site\" content=\"@ScheduleJS\" \/>\n<meta name=\"twitter:label1\" content=\"\u00c9crit par\" \/>\n\t<meta name=\"twitter:data1\" content=\"wordpress\" \/>\n\t<meta name=\"twitter:label2\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/schedulejs.com\\\/dynamic-rendering-zoom-level\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/schedulejs.com\\\/dynamic-rendering-zoom-level\\\/\"},\"author\":{\"name\":\"wordpress\",\"@id\":\"https:\\\/\\\/schedulejs.com\\\/#\\\/schema\\\/person\\\/dcf1d1444881cf1c59df51e7f2c07dbd\"},\"headline\":\"Dynamic rendering: Zoom-level\",\"datePublished\":\"2023-06-05T13:37:02+00:00\",\"dateModified\":\"2024-07-02T07:26:11+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/schedulejs.com\\\/dynamic-rendering-zoom-level\\\/\"},\"wordCount\":814,\"commentCount\":2,\"publisher\":{\"@id\":\"https:\\\/\\\/schedulejs.com\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/schedulejs.com\\\/dynamic-rendering-zoom-level\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/schedulejs.com\\\/wp-content\\\/uploads\\\/2022\\\/11\\\/custom.png\",\"articleSection\":[\"Implementations\",\"ScheduleJS Viewer\"],\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/schedulejs.com\\\/dynamic-rendering-zoom-level\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/schedulejs.com\\\/dynamic-rendering-zoom-level\\\/\",\"url\":\"https:\\\/\\\/schedulejs.com\\\/dynamic-rendering-zoom-level\\\/\",\"name\":\"Dynamic rendering: Zoom-level\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/schedulejs.com\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/schedulejs.com\\\/dynamic-rendering-zoom-level\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/schedulejs.com\\\/dynamic-rendering-zoom-level\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/schedulejs.com\\\/wp-content\\\/uploads\\\/2022\\\/11\\\/custom.png\",\"datePublished\":\"2023-06-05T13:37:02+00:00\",\"dateModified\":\"2024-07-02T07:26:11+00:00\",\"description\":\"This article shows how to implement dynamic rendering depending on the current zoom-level of the graphics.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/schedulejs.com\\\/dynamic-rendering-zoom-level\\\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/schedulejs.com\\\/dynamic-rendering-zoom-level\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\\\/\\\/schedulejs.com\\\/dynamic-rendering-zoom-level\\\/#primaryimage\",\"url\":\"https:\\\/\\\/schedulejs.com\\\/wp-content\\\/uploads\\\/2022\\\/11\\\/custom.png\",\"contentUrl\":\"https:\\\/\\\/schedulejs.com\\\/wp-content\\\/uploads\\\/2022\\\/11\\\/custom.png\",\"width\":2880,\"height\":1800,\"caption\":\"Schedulejs viewer gantt\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/schedulejs.com\\\/dynamic-rendering-zoom-level\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Accueil\",\"item\":\"https:\\\/\\\/schedulejs.com\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Dynamic rendering: Zoom-level\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/schedulejs.com\\\/#website\",\"url\":\"https:\\\/\\\/schedulejs.com\\\/\",\"name\":\"ScheduleJS - Applicative Gantt charts\",\"description\":\"Create advanced Gantt charts using web technologies\",\"publisher\":{\"@id\":\"https:\\\/\\\/schedulejs.com\\\/#organization\"},\"alternateName\":\"ScheduleJS\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/schedulejs.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/schedulejs.com\\\/#organization\",\"name\":\"ScheduleJS\",\"url\":\"https:\\\/\\\/schedulejs.com\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\\\/\\\/schedulejs.com\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/schedulejs.com\\\/wp-content\\\/uploads\\\/2021\\\/05\\\/logo_schedulejs_blue_1500x500.png\",\"contentUrl\":\"https:\\\/\\\/schedulejs.com\\\/wp-content\\\/uploads\\\/2021\\\/05\\\/logo_schedulejs_blue_1500x500.png\",\"width\":1500,\"height\":500,\"caption\":\"ScheduleJS\"},\"image\":{\"@id\":\"https:\\\/\\\/schedulejs.com\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/x.com\\\/ScheduleJS\",\"https:\\\/\\\/www.linkedin.com\\\/showcase\\\/schedulejs\\\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/schedulejs.com\\\/#\\\/schema\\\/person\\\/dcf1d1444881cf1c59df51e7f2c07dbd\",\"name\":\"wordpress\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/6a75ce3fbea1f5d75b3421485bbb1d13c75ccd55580543fd67bcca73f43984b4?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/6a75ce3fbea1f5d75b3421485bbb1d13c75ccd55580543fd67bcca73f43984b4?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/6a75ce3fbea1f5d75b3421485bbb1d13c75ccd55580543fd67bcca73f43984b4?s=96&d=mm&r=g\",\"caption\":\"wordpress\"},\"sameAs\":[\"https:\\\/\\\/schedulejs.com\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Dynamic rendering: Zoom-level","description":"This article shows how to implement dynamic rendering depending on the current zoom-level of the graphics.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/schedulejs.com\/fr\/dynamic-rendering-zoom-level\/","og_locale":"fr_FR","og_type":"article","og_title":"Dynamic rendering: Zoom-level","og_description":"This article shows how to implement dynamic rendering depending on the current zoom-level of the graphics.","og_url":"https:\/\/schedulejs.com\/fr\/dynamic-rendering-zoom-level\/","article_published_time":"2023-06-05T13:37:02+00:00","article_modified_time":"2024-07-02T07:26:11+00:00","og_image":[{"width":2880,"height":1800,"url":"https:\/\/schedulejs.com\/wp-content\/uploads\/2022\/11\/custom.png","type":"image\/png"}],"author":"wordpress","twitter_card":"summary_large_image","twitter_creator":"@ScheduleJS","twitter_site":"@ScheduleJS","twitter_misc":{"\u00c9crit par":"wordpress","Dur\u00e9e de lecture estim\u00e9e":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/schedulejs.com\/dynamic-rendering-zoom-level\/#article","isPartOf":{"@id":"https:\/\/schedulejs.com\/dynamic-rendering-zoom-level\/"},"author":{"name":"wordpress","@id":"https:\/\/schedulejs.com\/#\/schema\/person\/dcf1d1444881cf1c59df51e7f2c07dbd"},"headline":"Dynamic rendering: Zoom-level","datePublished":"2023-06-05T13:37:02+00:00","dateModified":"2024-07-02T07:26:11+00:00","mainEntityOfPage":{"@id":"https:\/\/schedulejs.com\/dynamic-rendering-zoom-level\/"},"wordCount":814,"commentCount":2,"publisher":{"@id":"https:\/\/schedulejs.com\/#organization"},"image":{"@id":"https:\/\/schedulejs.com\/dynamic-rendering-zoom-level\/#primaryimage"},"thumbnailUrl":"https:\/\/schedulejs.com\/wp-content\/uploads\/2022\/11\/custom.png","articleSection":["Implementations","ScheduleJS Viewer"],"inLanguage":"fr-FR","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/schedulejs.com\/dynamic-rendering-zoom-level\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/schedulejs.com\/dynamic-rendering-zoom-level\/","url":"https:\/\/schedulejs.com\/dynamic-rendering-zoom-level\/","name":"Dynamic rendering: Zoom-level","isPartOf":{"@id":"https:\/\/schedulejs.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/schedulejs.com\/dynamic-rendering-zoom-level\/#primaryimage"},"image":{"@id":"https:\/\/schedulejs.com\/dynamic-rendering-zoom-level\/#primaryimage"},"thumbnailUrl":"https:\/\/schedulejs.com\/wp-content\/uploads\/2022\/11\/custom.png","datePublished":"2023-06-05T13:37:02+00:00","dateModified":"2024-07-02T07:26:11+00:00","description":"This article shows how to implement dynamic rendering depending on the current zoom-level of the graphics.","breadcrumb":{"@id":"https:\/\/schedulejs.com\/dynamic-rendering-zoom-level\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/schedulejs.com\/dynamic-rendering-zoom-level\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/schedulejs.com\/dynamic-rendering-zoom-level\/#primaryimage","url":"https:\/\/schedulejs.com\/wp-content\/uploads\/2022\/11\/custom.png","contentUrl":"https:\/\/schedulejs.com\/wp-content\/uploads\/2022\/11\/custom.png","width":2880,"height":1800,"caption":"Schedulejs viewer gantt"},{"@type":"BreadcrumbList","@id":"https:\/\/schedulejs.com\/dynamic-rendering-zoom-level\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Accueil","item":"https:\/\/schedulejs.com\/"},{"@type":"ListItem","position":2,"name":"Dynamic rendering: Zoom-level"}]},{"@type":"WebSite","@id":"https:\/\/schedulejs.com\/#website","url":"https:\/\/schedulejs.com\/","name":"ScheduleJS - Applicative Gantt charts","description":"Create advanced Gantt charts using web technologies","publisher":{"@id":"https:\/\/schedulejs.com\/#organization"},"alternateName":"ScheduleJS","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/schedulejs.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"fr-FR"},{"@type":"Organization","@id":"https:\/\/schedulejs.com\/#organization","name":"ScheduleJS","url":"https:\/\/schedulejs.com\/","logo":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/schedulejs.com\/#\/schema\/logo\/image\/","url":"https:\/\/schedulejs.com\/wp-content\/uploads\/2021\/05\/logo_schedulejs_blue_1500x500.png","contentUrl":"https:\/\/schedulejs.com\/wp-content\/uploads\/2021\/05\/logo_schedulejs_blue_1500x500.png","width":1500,"height":500,"caption":"ScheduleJS"},"image":{"@id":"https:\/\/schedulejs.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/x.com\/ScheduleJS","https:\/\/www.linkedin.com\/showcase\/schedulejs\/"]},{"@type":"Person","@id":"https:\/\/schedulejs.com\/#\/schema\/person\/dcf1d1444881cf1c59df51e7f2c07dbd","name":"wordpress","image":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/secure.gravatar.com\/avatar\/6a75ce3fbea1f5d75b3421485bbb1d13c75ccd55580543fd67bcca73f43984b4?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/6a75ce3fbea1f5d75b3421485bbb1d13c75ccd55580543fd67bcca73f43984b4?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/6a75ce3fbea1f5d75b3421485bbb1d13c75ccd55580543fd67bcca73f43984b4?s=96&d=mm&r=g","caption":"wordpress"},"sameAs":["https:\/\/schedulejs.com"]}]}},"_links":{"self":[{"href":"https:\/\/schedulejs.com\/fr\/wp-json\/wp\/v2\/posts\/11149","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/schedulejs.com\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/schedulejs.com\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/schedulejs.com\/fr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/schedulejs.com\/fr\/wp-json\/wp\/v2\/comments?post=11149"}],"version-history":[{"count":0,"href":"https:\/\/schedulejs.com\/fr\/wp-json\/wp\/v2\/posts\/11149\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/schedulejs.com\/fr\/wp-json\/wp\/v2\/media\/10242"}],"wp:attachment":[{"href":"https:\/\/schedulejs.com\/fr\/wp-json\/wp\/v2\/media?parent=11149"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/schedulejs.com\/fr\/wp-json\/wp\/v2\/categories?post=11149"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/schedulejs.com\/fr\/wp-json\/wp\/v2\/tags?post=11149"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}