Replace note markers with ones styled like the other markers
authorLeo Koppelkamm <diebuche@gmail.com>
Sun, 5 May 2013 13:30:17 +0000 (15:30 +0200)
committerTom Hughes <tom@compton.nu>
Sun, 2 Jun 2013 17:44:09 +0000 (18:44 +0100)
app/assets/images/NoteMarker.svg [new file with mode: 0644]
app/assets/images/closed_note_marker.png
app/assets/images/closed_note_marker@2x.png [new file with mode: 0644]
app/assets/images/new_note_marker.png
app/assets/images/new_note_marker@2x.png [new file with mode: 0644]
app/assets/images/open_note_marker.png
app/assets/images/open_note_marker@2x.png [new file with mode: 0644]
app/assets/javascripts/index/notes.js.erb

diff --git a/app/assets/images/NoteMarker.svg b/app/assets/images/NoteMarker.svg
new file mode 100644 (file)
index 0000000..47b7bb5
--- /dev/null
@@ -0,0 +1,56 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg id="Layer_1" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" version="1.1" xml:space="preserve" height="79px" viewBox="0 0 211 79" width="211px" enable-background="new 0 0 211 79" y="0px" x="0px" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/"><metadata id="metadata3147"><rdf:RDF><cc:Work rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/><dc:title/></cc:Work></rdf:RDF></metadata>
+<linearGradient id="path3873_5_" x1="95.316" gradientUnits="userSpaceOnUse" y1="-15.335" gradientTransform="matrix(1 0 0 -1 -28.706 44.038)" x2="95.316" y2="22.229">
+       <stop id="stop3088" stop-color="#286EB5" offset="0"/>
+       <stop id="stop3090" stop-color="#4D9CD1" offset="1"/>
+</linearGradient>
+<linearGradient id="path3873_6_" x1="3.7354" gradientUnits="userSpaceOnUse" y1="3.1758" gradientTransform="matrix(1 0 0 -1 62.874 44.037)" x2="3.7354" y2="22.228">
+       <stop id="stop3093" stop-color="#306D98" offset="0"/>
+       <stop id="stop3095" stop-color="#3984B8" offset="1"/>
+</linearGradient>
+<rect id="rect3149" fill-rule="evenodd" height="14.864" width="14.552" y="26.51" x="59.246" fill="#fff"/><rect id="rect3919" fill-rule="evenodd" height="17.462" width="16.838" y="26.094" x="98.328" fill="#fff"/><rect id="rect3921" fill-rule="evenodd" transform="matrix(.66179 -.74969 .66179 .74969 0 0)" height="16.809" width="15.119" y="136.43" x="89.713" fill="#fff"/><path id="path3925" d="m17.566 30.771 5.7167-6.1325 9.4586 0.20788 4.4695 7.068-2.8064 11.33-8.835 0.72759-5.4049-1.4552-2.3906-6.4443z" fill="#fff"/><path id="path3873_1_" fill="url(#path3873_5_)" d="m66.654 21.988c-6.572 0-12.044 5.691-12.044 11.865 0 2.777 1.563 6.309 2.693 8.747l9.307 17.871 9.261-17.871c1.131-2.438 2.738-5.792 2.738-8.747 0-6.174-5.382-11.865-11.955-11.865v0zm0 7.154c2.584 0.018 4.678 2.121 4.678 4.711 0 2.588-2.094 4.662-4.678 4.678-2.585-0.016-4.679-2.09-4.679-4.678 0-2.59 2.094-4.693 4.679-4.711z" connector-curvature="0" export-ydpi="180" stroke="url(#path3873_6_)" stroke-linecap="round" export-filename="C:\Users\dave.STK\Desktop\git\Leaflet\Leaflet\dist\images\marker-icon@2x.png" stroke-width="1.1" nodetypes="zscccszcscsc" export-xdpi="180"/>
+<path id="path3792_1_" fill="none" export-xdpi="180" stroke-opacity=".1216" export-ydpi="180" stroke="#fff" stroke-linecap="round" radius="-1.09294" export-filename="C:\Users\dave.STK\Desktop\git\Leaflet\Leaflet\dist\images\marker-icon@2x.png" stroke-width="1.1" type="inkscape:offset" original="M 416.53125 503.625 C 409.95868 503.625 404.5 509.29393 404.5 515.46875 C 404.5 518.24668 406.05726 521.78106 407.1875 524.21875 L 416.5 542.09375 L 425.75 524.21875 C 426.88024 521.78106 428.5 518.42346 428.5 515.46875 C 428.5 509.29393 423.10382 503.625 416.53125 503.625 z M 416.53125 510.78125 C 419.11574 510.79795 421.21875 512.88037 421.21875 515.46875 C 421.21875 518.05715 419.11574 520.13969 416.53125 520.15625 C 413.94676 520.13975 411.875 518.05715 411.875 515.46875 C 411.875 512.88038 413.94676 510.79802 416.53125 510.78125 z " d="m66.641 23.093c-5.944 0-10.938 5.221-10.938 10.75 0 2.359 1.442 5.832 2.562 8.25 0.005 0.012 0.025 0.021 0.03 0.031l8.313 15.969 8.25-15.969c0.006-0.012 0.025-0.02 0.031-0.031 1.135-2.448 2.625-5.706 2.625-8.25 0.002-5.537-4.93-10.75-10.873-10.75v0zm0 4.969c3.167 0.021 5.781 2.602 5.781 5.781 0 3.182-2.613 5.762-5.781 5.781-3.168-0.02-5.75-2.609-5.75-5.781s2.582-5.76 5.75-5.781z"/>
+<g id="g3099" stroke-width="1.1" stroke-linecap="round">
+               <linearGradient id="path3873_7_" x1="56.017" gradientUnits="userSpaceOnUse" y1="-15.335" gradientTransform="matrix(1 0 0 -1 -28.706 44.038)" x2="56.017" y2="22.229">
+               <stop id="stop3102" stop-color="#C72118" offset="0"/>
+               <stop id="stop3104" stop-color="#D2534F" offset="1"/>
+       </linearGradient>
+               <linearGradient id="path3873_8_" x1="-35.564" gradientUnits="userSpaceOnUse" y1="3.1758" gradientTransform="matrix(1 0 0 -1 62.874 44.037)" x2="-35.564" y2="22.228">
+               <stop id="stop3107" stop-color="#983A38" offset="0"/>
+               <stop id="stop3109" stop-color="#B83D3B" offset="1"/>
+       </linearGradient>
+               <path id="path3873_3_" d="m27.355 21.988c-6.572 0-12.044 5.691-12.044 11.865 0 2.777 1.563 6.309 2.693 8.747l9.307 17.871 9.262-17.871c1.13-2.438 2.737-5.792 2.737-8.747 0.001-6.174-5.382-11.865-11.955-11.865zm2.875 12.86l3.547-3.547c0.781-0.781 0.781-2.047 0-2.828-0.782-0.781-2.049-0.781-2.829 0l-3.547 3.547-3.547-3.547c-0.779-0.781-2.047-0.781-2.828 0s-0.781 2.047 0 2.828l3.547 3.547-3.547 3.546c-0.781 0.78-0.781 2.048 0 2.828 0.391 0.391 0.902 0.586 1.414 0.586s1.024-0.195 1.414-0.586l3.547-3.546 3.547 3.546c0.39 0.391 0.902 0.586 1.414 0.586s1.023-0.195 1.415-0.586c0.781-0.78 0.781-2.048 0-2.828l-3.547-3.546z" fill-rule="evenodd" connector-curvature="0" export-ydpi="180" stroke="url(#path3873_8_)" export-filename="C:\Users\dave.STK\Desktop\git\Leaflet\Leaflet\dist\images\marker-icon@2x.png" clip-rule="evenodd" fill="url(#path3873_7_)" nodetypes="zscccszcscsc" export-xdpi="180"/>
+               <path id="path3792_3_" d="m27.343 23.093c-5.944 0-10.938 5.221-10.938 10.75 0 2.359 1.442 5.832 2.562 8.25 0.005 0.012 0.025 0.021 0.03 0.031l8.313 15.969 8.25-15.969c0.005-0.012 0.025-0.02 0.03-0.031 1.136-2.448 2.625-5.706 2.625-8.25 0.002-5.537-4.929-10.75-10.872-10.75zm5.02 3.706c-0.829 0-1.607 0.323-2.193 0.909l-2.768 2.769-2.769-2.77c-0.585-0.585-1.363-0.908-2.192-0.908-0.828 0-1.607 0.323-2.191 0.909-0.586 0.585-0.908 1.363-0.908 2.191s0.322 1.606 0.908 2.192l2.769 2.768-2.769 2.77c-0.586 0.584-0.908 1.363-0.908 2.191s0.322 1.607 0.908 2.191c0.585 0.586 1.363 0.908 2.191 0.908 0.829 0 1.607-0.322 2.193-0.908l2.768-2.767 2.769 2.767c0.585 0.586 1.363 0.908 2.192 0.908 0.828 0 1.607-0.322 2.191-0.908 0.586-0.583 0.908-1.363 0.908-2.191s-0.322-1.607-0.908-2.191l-2.769-2.77 2.769-2.768c0.586-0.586 0.908-1.364 0.908-2.192s-0.322-1.606-0.908-2.192c-0.583-0.584-1.363-0.908-2.191-0.908z" stroke-opacity=".1216" export-ydpi="180" stroke="#fff" export-filename="C:\Users\dave.STK\Desktop\git\Leaflet\Leaflet\dist\images\marker-icon@2x.png" radius="-1.09294" fill="none" type="inkscape:offset" original="M 416.53125 503.625 C 409.95868 503.625 404.5 509.29393 404.5 515.46875 C 404.5 518.24668 406.05726 521.78106 407.1875 524.21875 L 416.5 542.09375 L 425.75 524.21875 C 426.88024 521.78106 428.5 518.42346 428.5 515.46875 C 428.5 509.29393 423.10382 503.625 416.53125 503.625 z M 416.53125 510.78125 C 419.11574 510.79795 421.21875 512.88037 421.21875 515.46875 C 421.21875 518.05715 419.11574 520.13969 416.53125 520.15625 C 413.94676 520.13975 411.875 518.05715 411.875 515.46875 C 411.875 512.88038 413.94676 510.79802 416.53125 510.78125 z " export-xdpi="180"/>
+</g>
+<g id="g3113" stroke-width="1.1" stroke-linecap="round">
+               <linearGradient id="path3873_9_" x1="135.47" gradientUnits="userSpaceOnUse" y1="-15.335" gradientTransform="matrix(1 0 0 -1 -28.706 44.038)" x2="135.47" y2="22.229">
+               <stop id="stop3116" stop-color="#7CB928" offset="0"/>
+               <stop id="stop3118" stop-color="#A2C857" offset="1"/>
+       </linearGradient>
+               <linearGradient id="path3873_10_" x1="43.886" gradientUnits="userSpaceOnUse" y1="3.1758" gradientTransform="matrix(1 0 0 -1 62.874 44.037)" x2="43.886" y2="22.228">
+               <stop id="stop3121" stop-color="#74963A" offset="0"/>
+               <stop id="stop3123" stop-color="#89B63E" offset="1"/>
+       </linearGradient>
+               <path id="path3873_4_" d="m106.8 21.988c-6.572 0-12.045 5.691-12.045 11.865 0 2.777 1.564 6.309 2.693 8.747l9.307 17.871 9.262-17.871c1.131-2.438 2.738-5.792 2.738-8.747 0-6.174-5.38-11.865-11.96-11.865zm-1.18 20.069c-0.521 0-1.025-0.215-1.389-0.604-0.025-0.027-2.609-2.793-3.945-3.996-0.779-0.703-0.841-1.904-0.139-2.684 0.703-0.781 1.904-0.842 2.684-0.139 0.64 0.576 1.501 1.438 2.275 2.232 1.244-2.398 3.327-6 5.765-8.545 0.726-0.758 1.929-0.783 2.687-0.057 0.758 0.725 0.783 1.928 0.058 2.686-3.412 3.562-6.228 9.906-6.255 9.971-0.258 0.584-0.792 1-1.422 1.108-0.11 0.018-0.22 0.028-0.32 0.028z" fill-rule="evenodd" connector-curvature="0" export-ydpi="180" stroke="url(#path3873_10_)" export-filename="C:\Users\dave.STK\Desktop\git\Leaflet\Leaflet\dist\images\marker-icon@2x.png" clip-rule="evenodd" fill="url(#path3873_9_)" nodetypes="zscccszcscsc" export-xdpi="180"/>
+               <path id="path3792_6_" d="m106.79 23.093c-5.943 0-10.938 5.221-10.938 10.75 0 2.359 1.443 5.832 2.562 8.25 0.006 0.012 0.025 0.021 0.031 0.031l8.312 15.969 8.25-15.969c0.006-0.012 0.025-0.02 0.031-0.031 1.135-2.448 2.625-5.706 2.625-8.25 0.01-5.537-4.93-10.75-10.87-10.75zm5.45 3.543c-0.814 0-1.604 0.338-2.166 0.926-2.09 2.18-3.914 5.074-5.236 7.471-0.502-0.498-0.928-0.904-1.273-1.217-0.553-0.498-1.266-0.771-2.009-0.771-0.849 0-1.661 0.361-2.228 0.992-1.107 1.227-1.01 3.129 0.219 4.236 1.288 1.16 3.85 3.901 3.874 3.926 0.569 0.609 1.368 0.957 2.196 0.957 0.166 0 0.334-0.014 0.498-0.041 1.002-0.172 1.841-0.824 2.248-1.75 0.029-0.064 2.805-6.271 6.043-9.652 0.555-0.578 0.851-1.34 0.834-2.141-0.018-0.801-0.346-1.547-0.925-2.102-0.57-0.537-1.3-0.834-2.08-0.834z" stroke-opacity=".1216" export-ydpi="180" stroke="#fff" export-filename="C:\Users\dave.STK\Desktop\git\Leaflet\Leaflet\dist\images\marker-icon@2x.png" radius="-1.09294" fill="none" type="inkscape:offset" original="M 416.53125 503.625 C 409.95868 503.625 404.5 509.29393 404.5 515.46875 C 404.5 518.24668 406.05726 521.78106 407.1875 524.21875 L 416.5 542.09375 L 425.75 524.21875 C 426.88024 521.78106 428.5 518.42346 428.5 515.46875 C 428.5 509.29393 423.10382 503.625 416.53125 503.625 z M 416.53125 510.78125 C 419.11574 510.79795 421.21875 512.88037 421.21875 515.46875 C 421.21875 518.05715 419.11574 520.13969 416.53125 520.15625 C 413.94676 520.13975 411.875 518.05715 411.875 515.46875 C 411.875 512.88038 413.94676 510.79802 416.53125 510.78125 z " export-xdpi="180"/>
+</g>
+<rect id="rect3771_1_" export-xdpi="180" fill-opacity="0" export-ydpi="180" width="25" export-filename="C:\Users\dave.STK\Desktop\git\Leaflet\Leaflet\dist\images\marker-icon@2x.png" y="20.958" x="14.811" height="41.001" display="none" fill="#fff">
+</rect>
+<linearGradient id="path3873_11_" x1="188.85" gradientUnits="userSpaceOnUse" y1="-15.335" gradientTransform="matrix(1 0 0 -1 -28.706 44.038)" x2="188.85" y2="22.229">
+       <stop id="stop3129" stop-color="#286EB5" offset="0"/>
+       <stop id="stop3131" stop-color="#4D9CD1" offset="1"/>
+</linearGradient>
+<linearGradient id="path3873_12_" x1="97.272" gradientUnits="userSpaceOnUse" y1="3.1758" gradientTransform="matrix(1 0 0 -1 62.874 44.037)" x2="97.272" y2="22.228">
+       <stop id="stop3134" stop-color="#306D98" offset="0"/>
+       <stop id="stop3136" stop-color="#3984B8" offset="1"/>
+</linearGradient>
+<path id="path3873_2_" fill="url(#path3873_11_)" d="m160.19 21.988c-6.572 0-12.044 5.691-12.044 11.865 0 2.777 1.563 6.309 2.693 8.747l9.307 17.871 9.262-17.871c1.13-2.438 2.737-5.792 2.737-8.747-0.01-6.174-5.39-11.865-11.96-11.865v0zm2.05 10.861v-4.816c0-1.105-0.895-2-2-2-1.104 0-2.001 0.897-2 2v4.815h-4.815c-1.104-0.001-2 0.896-2 2s0.895 2 2 2h4.815v4.815c-0.001 1.104 0.896 2 2 2 0.552 0 1.052-0.224 1.414-0.586 0.361-0.361 0.586-0.861 0.586-1.414v-4.815h4.815c0.551 0 1.052-0.224 1.414-0.586 0.361-0.362 0.585-0.862 0.586-1.415 0.001-1.104-0.896-2.001-2-2-0.008 0.0044-4.815 0.002-4.815 0.002z" fill-rule="evenodd" connector-curvature="0" stroke-linecap="round" export-ydpi="180" stroke="url(#path3873_12_)" export-filename="C:\Users\dave.STK\Desktop\git\Leaflet\Leaflet\dist\images\marker-icon@2x.png" clip-rule="evenodd" stroke-width="1.1" nodetypes="zscccszcscsc" export-xdpi="180"/>
+<path id="path3792_2_" fill="none" export-xdpi="180" stroke-opacity=".1216" export-ydpi="180" stroke="#fff" stroke-linecap="round" radius="-1.09294" export-filename="C:\Users\dave.STK\Desktop\git\Leaflet\Leaflet\dist\images\marker-icon@2x.png" stroke-width="1.1" type="inkscape:offset" original="M 416.53125 503.625 C 409.95868 503.625 404.5 509.29393 404.5 515.46875 C 404.5 518.24668 406.05726 521.78106 407.1875 524.21875 L 416.5 542.09375 L 425.75 524.21875 C 426.88024 521.78106 428.5 518.42346 428.5 515.46875 C 428.5 509.29393 423.10382 503.625 416.53125 503.625 z M 416.53125 510.78125 C 419.11574 510.79795 421.21875 512.88037 421.21875 515.46875 C 421.21875 518.05715 419.11574 520.13969 416.53125 520.15625 C 413.94676 520.13975 411.875 518.05715 411.875 515.46875 C 411.875 512.88038 413.94676 510.79802 416.53125 510.78125 z " d="m160.18 23.093c-5.944 0-10.938 5.221-10.938 10.75 0 2.359 1.442 5.832 2.562 8.25 0.005 0.012 0.025 0.021 0.03 0.031l8.313 15.969 8.25-15.969c0.005-0.012 0.025-0.02 0.03-0.031 1.136-2.448 2.625-5.706 2.625-8.25 0.01-5.537-4.92-10.75-10.86-10.75v0zm-2.13 2.757c-0.586 0.586-0.908 1.365-0.908 2.194l0.001 3.714-3.716-0.001c-0.827 0-1.606 0.322-2.192 0.908-0.586 0.585-0.908 1.365-0.906 2.193-0.001 0.828 0.321 1.606 0.906 2.191 0.586 0.585 1.365 0.908 2.193 0.908l3.714-0.001 0.001 3.716c-0.001 0.826 0.321 1.605 0.907 2.191s1.365 0.908 2.191 0.907c0.828 0.001 1.606-0.322 2.191-0.907 0.587-0.587 0.909-1.365 0.909-2.193l0.001-3.713 3.714-0.001c0.827 0 1.605-0.322 2.191-0.908s0.909-1.365 0.908-2.192c0.002-0.827-0.322-1.606-0.907-2.191s-1.364-0.909-2.191-0.907h-3.717l0.002-3.715c0-0.828-0.323-1.607-0.908-2.192-0.586-0.585-1.364-0.908-2.193-0.908-0.8-0.002-1.58 0.321-2.17 0.907v0z"/>
+<rect id="rect3771_7_" export-xdpi="180" fill-opacity="0" export-ydpi="180" width="25" export-filename="C:\Users\dave.STK\Desktop\git\Leaflet\Leaflet\dist\images\marker-icon@2x.png" y="20.958" x="147.64" height="41.001" display="none" fill="#fff">
+</rect>
+<rect id="rect3771_2_" export-xdpi="180" fill-opacity="0" export-ydpi="180" width="25" export-filename="C:\Users\dave.STK\Desktop\git\Leaflet\Leaflet\dist\images\marker-icon@2x.png" y="20.958" x="54.109" height="41.001" display="none" fill="#fff">
+</rect>
+<rect id="rect3771_5_" export-xdpi="180" fill-opacity="0" export-ydpi="180" width="25" export-filename="C:\Users\dave.STK\Desktop\git\Leaflet\Leaflet\dist\images\marker-icon@2x.png" y="20.958" x="94.26" height="41.001" display="none" fill="#fff">
+</rect>
+<rect id="rect3923" opacity=".5" fill-rule="evenodd" transform="matrix(.66351 -.74817 .66351 .74817 0 0)" height="18.745" width="16.861" y="8.749" x="4.5441" fill="#fff"/></svg>
index bf6d6bb25860ecd9c6976b89f67f12fc49dbe3aa..ad2812fbed6f85c06db0b505f6e2147e9b4d87d5 100644 (file)
Binary files a/app/assets/images/closed_note_marker.png and b/app/assets/images/closed_note_marker.png differ
diff --git a/app/assets/images/closed_note_marker@2x.png b/app/assets/images/closed_note_marker@2x.png
new file mode 100644 (file)
index 0000000..ea434e9
Binary files /dev/null and b/app/assets/images/closed_note_marker@2x.png differ
index 671cf424c87241ecf5447d775f532cabd5552243..a41464487e72589901742b731e1a361883c6775b 100644 (file)
Binary files a/app/assets/images/new_note_marker.png and b/app/assets/images/new_note_marker.png differ
diff --git a/app/assets/images/new_note_marker@2x.png b/app/assets/images/new_note_marker@2x.png
new file mode 100644 (file)
index 0000000..6098079
Binary files /dev/null and b/app/assets/images/new_note_marker@2x.png differ
index a58031663b38e5e66a8a237279d3be193f7a0d46..6fe5cb7ac4a7032e3643af8899c6c2d4ecc3a205 100644 (file)
Binary files a/app/assets/images/open_note_marker.png and b/app/assets/images/open_note_marker.png differ
diff --git a/app/assets/images/open_note_marker@2x.png b/app/assets/images/open_note_marker@2x.png
new file mode 100644 (file)
index 0000000..e465ca9
Binary files /dev/null and b/app/assets/images/open_note_marker@2x.png differ
index a58e5c56816070fcef53a15cbe95f1f47a0d4fc4..7336c49ec60121e25ee4a8e02ba837e6b82d2fc6 100644 (file)
@@ -7,18 +7,18 @@ $(document).ready(function () {
   var noteIcons = {
     "new": L.icon({
       iconUrl: "<%= image_path 'new_note_marker.png' %>",
-      iconSize: [22, 22],
-      iconAnchor: [11, 11]
+      iconSize: [25, 40],
+      iconAnchor: [12, 40]
     }),
     "open": L.icon({
       iconUrl: "<%= image_path 'open_note_marker.png' %>",
-      iconSize: [22, 22],
-      iconAnchor: [11, 11]
+      iconSize: [25, 40],
+      iconAnchor: [12, 40]
     }),
     "closed": L.icon({
       iconUrl: "<%= image_path 'closed_note_marker.png' %>",
-      iconSize: [22, 22],
-      iconAnchor: [11, 11]
+      iconSize: [25, 40],
+      iconAnchor: [12, 40]
     })
   };
 
@@ -96,7 +96,7 @@ $(document).ready(function () {
     {
       marker = L.marker(feature.geometry.coordinates.reverse(), {
         icon: noteIcons[feature.properties.status],
-        opacity: 0.7
+        opacity: 0.9
       });
 
       marker.addTo(noteLayer).bindPopup(
@@ -151,7 +151,7 @@ $(document).ready(function () {
       minWidth: 320,
       maxWidth: mapSize.y * 1 / 3,
       maxHeight: mapSize.y * 2 / 3,
-      offset: new L.Point(0, -3),
+      offset: new L.Point(0, -40),
       autoPanPadding: new L.Point(60, 40)
     };
   }
@@ -264,7 +264,7 @@ $(document).ready(function () {
 
     newNote = L.marker(map.containerPointToLatLng(markerPosition), {
       icon: noteIcons["new"],
-      opacity: 0.7,
+      opacity: 0.9,
       draggable: true
     });